34 lines
2.2 KiB
JavaScript
34 lines
2.2 KiB
JavaScript
import { CloudUpload } from 'lucide-react'
|
|
import { useDriveController } from '@/hooks/useDriveController'
|
|
import DriveSidebar from '@/components/drive/DriveSidebar'
|
|
import DriveToolbar from '@/components/drive/DriveToolbar'
|
|
import DriveExplorer from '@/components/drive/DriveExplorer'
|
|
import DriveDialogs from '@/components/drive/DriveDialogs'
|
|
import UploadTray from '@/components/drive/UploadTray'
|
|
import AdminUsersPage from '@/pages/AdminUsersPage'
|
|
|
|
export default function DrivePage({user, onLogout}) {
|
|
const controller = useDriveController(user)
|
|
const {sidebar, setSidebar, drag, setDrag, filesInput, uploadFiles, isTrash, canWrite} = controller
|
|
|
|
return (
|
|
<div className="flex h-dvh min-h-[540px] overflow-hidden bg-background"
|
|
onDragOver={e => {if(e.dataTransfer?.types?.includes('Files')){e.preventDefault();setDrag(true)}}}
|
|
onDragLeave={e => {if(!e.currentTarget.contains(e.relatedTarget))setDrag(false)}}
|
|
onDrop={e => {e.preventDefault();setDrag(false);if(!isTrash&&canWrite)uploadFiles(e.dataTransfer.files)}}>
|
|
{sidebar && <button className="fixed inset-0 z-30 bg-black/40 md:hidden" aria-label="Fermer le menu" onClick={() => setSidebar(false)} />}
|
|
<DriveSidebar controller={controller} user={user} onLogout={onLogout} />
|
|
<main className="flex min-w-0 flex-1 flex-col overflow-hidden">
|
|
{controller.view === 'users' && user.is_admin ? <AdminUsersPage onOpenSidebar={() => setSidebar(true)} dark={controller.dark} setDark={controller.setDark} /> : <>
|
|
<DriveToolbar controller={controller} />
|
|
<DriveExplorer controller={controller} user={user} />
|
|
</>}
|
|
</main>
|
|
<input className="hidden" ref={filesInput} type="file" multiple onChange={e => uploadFiles(e.target.files)} />
|
|
{drag && !isTrash && canWrite && <div className="pointer-events-none fixed inset-3 z-50 grid place-items-center rounded-3xl border-4 border-dashed border-primary bg-background/90"><div className="text-center"><CloudUpload className="mx-auto mb-3 size-14 text-primary"/><h2 className="text-xl font-semibold">Dépose tes fichiers ici</h2></div></div>}
|
|
<DriveDialogs controller={controller} user={user} />
|
|
<UploadTray uploads={controller.uploads} />
|
|
</div>
|
|
)
|
|
}
|