import React, { useState, useRef, useEffect } from 'react'; import type { DocumentInfo } from '../../types'; import { UploadSection } from './UploadSection'; import { DocumentList } from './DocumentList'; import { useAuth } from '../../hooks/useAuth'; import { ConfirmModal } from '../ConfirmModal'; interface SidebarProps { documents: DocumentInfo[]; selectedDocId: string | null; isUploading: boolean; uploadError: string | null; fileInputRef: React.RefObject; onFileChange: (event: React.ChangeEvent) => void; onDocumentSelect: (id: string) => void; onDocumentDelete: (id: string, event: React.MouseEvent) => void; onShowAuth: (view: 'login' | 'register') => void; sidebarOpen: boolean; } export function Sidebar({ documents, selectedDocId, isUploading, uploadError, fileInputRef, onFileChange, onDocumentSelect, onDocumentDelete, onShowAuth, sidebarOpen, }: SidebarProps) { const { user, logout, deleteAccount } = useAuth(); const [menuOpen, setMenuOpen] = useState(false); const [showDeleteModal, setShowDeleteModal] = useState(false); const [showSignOutModal, setShowSignOutModal] = useState(false); const menuRef = useRef(null); // Close menu when clicking outside useEffect(() => { function handleClickOutside(event: MouseEvent) { if (menuRef.current && !menuRef.current.contains(event.target as Node)) { setMenuOpen(false); } } document.addEventListener('mousedown', handleClickOutside); return () => document.removeEventListener('mousedown', handleClickOutside); }, []); const executeDeleteAccount = async () => { setShowDeleteModal(false); try { await deleteAccount(); } catch (err: unknown) { console.error(err); } }; return ( ); }