idolpx/meatloaf-config
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(MediaManager): simplify ActionsModal by removing select all button and adding filter toggle

Browse Source
This commit is contained in:
Jaime Idolpx 2026-06-12 23:17:26 -04:00
parent 3d69970ea5
commit c287de5bad
1 changed files with 15 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/app/components/MediaManager.tsx
View File

@ -6,7 +6,8 @@ import {
BookOpen,
Braces,
Check,
CheckSquare,
ChevronDown,
ChevronLeft,
ChevronRight,
ClipboardPaste,
@ -207,9 +208,7 @@ interface FolderManagementActions {
onUpload: () => void;
clipboard: Clipboard | null;
onPaste: () => void;
selectedCount: number;
totalCount: number;
onSelectAll: () => void;
isRoot: boolean;
}
@ -278,11 +277,6 @@ function ActionsModal({ entry, onClose, onOpen, onMount, onDownload, onDuplicate
<span>{fm.clipboard.op === 'copy' ? 'Copy' : 'Move'} {fm.clipboard.paths.length} item{fm.clipboard.paths.length !== 1 ? 's' : ''} here</span>
</button>
)}
<button onClick={() => { onClose(); fm.onSelectAll(); }}
className="w-full text-left px-4 py-3 rounded border border-neutral-200 hover:bg-neutral-50 inline-flex items-center gap-3">
<CheckSquare className="w-4 h-4 text-neutral-500" />
<span>{fm.selectedCount === fm.totalCount && fm.totalCount > 0 ? 'Deselect All' : 'Select All'}</span>
</button>
{!fm.isRoot && <div className="border-t border-neutral-100" />}
</>
)}
@ -435,6 +429,7 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
const [actionEntry, setActionEntry] = useState<EntryInfo | null>(null);
const [folderActionOpen, setFolderActionOpen] = useState(false);
const [dragOver, setDragOver] = useState(false);
const [showFilter, setShowFilter] = useState(false);
const [showNewFile, setShowNewFile] = useState(false);
const [newFileName, setNewFileName] = useState('');
@ -984,15 +979,6 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
<button onClick={() => void load(path)} className="p-1.5 rounded hover:bg-neutral-100" title="Refresh">
<RefreshCw className="w-4 h-4" />
</button>
<button onClick={() => { setShowNewFile(v => !v); setShowNewFolder(false); }} className="p-1.5 rounded hover:bg-neutral-100" title="New File">
<FilePlus className="w-4 h-4" />
</button>
<button onClick={() => { setShowNewFolder(v => !v); setShowNewFile(false); }} className="p-1.5 rounded hover:bg-neutral-100" title="New Folder">
<FolderPlus className="w-4 h-4" />
</button>
<button onClick={() => fileInputRef.current?.click()} className="p-1.5 rounded hover:bg-neutral-100" title="Upload">
<Upload className="w-4 h-4" />
</button>
<button onClick={() => setFolderActionOpen(true)} className="p-1.5 rounded hover:bg-neutral-100" title="Actions">
<MoreVertical className="w-4 h-4" />
</button>
@ -1042,6 +1028,13 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
<SlidersHorizontal className="w-3.5 h-3.5" strokeWidth={3} />
</button>
)}
<button
onClick={() => setShowFilter(v => !v)}
className={`p-1 rounded flex-shrink-0 ${showFilter ? 'text-blue-600' : 'text-neutral-400 hover:text-neutral-600'}`}
title={showFilter ? 'Hide filter' : 'Filter & sort'}
>
<ChevronDown className={`w-3.5 h-3.5 transition-transform duration-150 ${showFilter ? 'rotate-180' : ''}`} />
</button>
</div>
{(folderConfig?.['base_url']) && (
<div className="text-xs text-neutral-400 mt-0.5 truncate">
@ -1107,10 +1100,11 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
</button>
</div>
)}
</div>
{/* ── Filter + sort bar ── */}
<div className="bg-neutral-50 border-b border-neutral-200 px-4 py-2 flex items-center gap-2 flex-shrink-0">
{showFilter && <div className="bg-neutral-50 border-b border-neutral-200 px-4 py-2 flex items-center gap-2 flex-shrink-0">
<div className="relative flex-1 min-w-0">
<Search className="absolute left-2 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-neutral-400 pointer-events-none" />
<input
@ -1135,7 +1129,7 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
{sortKey === k ? (sortAsc ? ' ↑' : ' ↓') : ''}
</button>
))}
</div>
</div>}
{/* ── Selection / clipboard bar ── */}
{(selCount > 0 || clipboard) && (
@ -1308,9 +1302,7 @@ export default function MediaManager({ initialPath, rootPath, title, config, set
onUpload: () => fileInputRef.current?.click(),
clipboard,
onPaste: () => void paste(),
selectedCount: selected.size,
totalCount: visible.length,
onSelectAll: selectAll,
isRoot: path === (rootPath ?? '/'),
} : undefined}
/>