diff options
| author | soryu <soryu@soryu.co> | 2025-12-23 19:11:57 +0000 |
|---|---|---|
| committer | soryu <soryu@soryu.co> | 2025-12-23 19:11:57 +0000 |
| commit | f5222a7ae5ade5589436778cb01fc0abe625b3c3 (patch) | |
| tree | 6e9739517d371179e6018412cba011b3f38868ef /makima/frontend/src/components/files/FileList.tsx | |
| parent | 3c0adec8e3a9dd3bc34251e87e0fb5314793426d (diff) | |
| download | soryu-f5222a7ae5ade5589436778cb01fc0abe625b3c3.tar.gz soryu-f5222a7ae5ade5589436778cb01fc0abe625b3c3.zip | |
Add editable file sections and a drag&drop feature
Diffstat (limited to 'makima/frontend/src/components/files/FileList.tsx')
| -rw-r--r-- | makima/frontend/src/components/files/FileList.tsx | 14 |
1 files changed, 12 insertions, 2 deletions
diff --git a/makima/frontend/src/components/files/FileList.tsx b/makima/frontend/src/components/files/FileList.tsx index 7e1eea4..a859aa1 100644 --- a/makima/frontend/src/components/files/FileList.tsx +++ b/makima/frontend/src/components/files/FileList.tsx @@ -5,6 +5,7 @@ interface FileListProps { loading: boolean; onSelect: (id: string) => void; onDelete: (id: string) => void; + onCreate: () => void; } function formatDuration(seconds: number | null): string { @@ -30,6 +31,7 @@ export function FileList({ loading, onSelect, onDelete, + onCreate, }: FileListProps) { if (loading) { return ( @@ -41,8 +43,16 @@ export function FileList({ return ( <div className="panel h-full flex flex-col"> - <div className="font-mono text-xs text-[#9bc3ff] tracking-wide uppercase p-4 pb-2 border-b border-dashed border-[rgba(117,170,252,0.35)]"> - FILES// + <div className="flex items-center justify-between p-4 pb-2 border-b border-dashed border-[rgba(117,170,252,0.35)]"> + <div className="font-mono text-xs text-[#9bc3ff] tracking-wide uppercase"> + FILES// + </div> + <button + onClick={onCreate} + className="px-3 py-1 font-mono text-xs text-[#9bc3ff] border border-[rgba(117,170,252,0.25)] hover:border-[#3f6fb3] hover:bg-[rgba(117,170,252,0.05)] transition-colors uppercase" + > + + New + </button> </div> <div className="flex-1 overflow-y-auto"> |