Gallery has no bulk move to folder — user with 12 designs all in the 'Inbox' folder wants to move them to specific folders one at a time, no way to multi-select and move #253

Closed
opened 2026-10-04 03:35:44 +00:00 by Mark · 1 comment
Owner

Finding

src/pages/Gallery.tsx's multi-select state is selectedDesigns: Set<string> (per #179). The bulk actions are:

  • Bulk delete (per the previous scan)
  • Bulk favorite toggle
  • Bulk export (maybe)

The RightClickMenu.tsx has onMoveToFolder (per the snippet I saw earlier). It's wired in the per-card right-click menu. But the bulk move (multi-select → choose destination folder) is not wired.

grep -n 'bulkMove\|MOVE_BULK\|moveSelectedToFolder' src/pages/Gallery.tsx returns 0.

A user with 12 designs in "Inbox" and 4 folders ("Work", "Personal", "Archive", "Family"):

  • Wants to move 4 designs to "Work", 3 to "Personal", 2 to "Archive", 3 to "Family"
  • Has to right-click each design, choose "Move to → Work", confirm
  • 12 right-clicks

Where

  • Multi-select: src/pages/Gallery.tsx (Set of selected design ids)
  • Right-click move: src/components/gallery/RightClickMenu.tsx (per-card)
  • No bulk move: grep -n 'bulkMove' src/ returns 0

Suggested fix shape

When multi-select is active (selectedDesigns.size > 1), show a "Move to…" button in the multi-select toolbar:

{selectedDesigns.size > 1 && (
  <DropdownMenu>
    <DropdownMenuTrigger>
      <FolderInput size={14} />
      Move to…
    </DropdownMenuTrigger>
    <DropdownMenuContent>
      {folders.map((folder) => (
        <DropdownMenuItem
          key={folder.id}
          onClick={() => onBulkMoveToFolder(Array.from(selectedDesigns), folder.id)}
        >
          <Folder size={12} />
          {folder.name}
        </DropdownMenuItem>
      ))}
    </DropdownMenuContent>
  </DropdownMenu>
)}

onBulkMoveToFolder(designIds, folderId) dispatches MOVE_DESIGNS reducer action that updates each design's folderId to the new value.

This mirrors the bulk delete pattern (per the existing confirmBulkDelete function in Gallery.tsx).

Severity

Low. The user can right-click each design. Power users with many designs notice.

Discovered by

Gap analysis (2026-10-02) of gallery multi-select affordances.

  • #179 (open) — Gallery multi-select. The selection is in place; the bulk actions are the parallel concern.
  • The right-click "Move to" (in RightClickMenu.tsx) is the per-card version.
  • The bulk delete is the pattern to mirror for the bulk move.
## Finding `src/pages/Gallery.tsx`'s multi-select state is `selectedDesigns: Set<string>` (per #179). The bulk actions are: - Bulk delete (per the previous scan) - Bulk favorite toggle - Bulk export (maybe) The `RightClickMenu.tsx` has `onMoveToFolder` (per the snippet I saw earlier). It's wired in the per-card right-click menu. But the bulk move (multi-select → choose destination folder) is not wired. `grep -n 'bulkMove\|MOVE_BULK\|moveSelectedToFolder' src/pages/Gallery.tsx` returns 0. A user with 12 designs in "Inbox" and 4 folders ("Work", "Personal", "Archive", "Family"): - Wants to move 4 designs to "Work", 3 to "Personal", 2 to "Archive", 3 to "Family" - Has to right-click each design, choose "Move to → Work", confirm - 12 right-clicks ## Where - Multi-select: `src/pages/Gallery.tsx` (Set<string> of selected design ids) - Right-click move: `src/components/gallery/RightClickMenu.tsx` (per-card) - No bulk move: `grep -n 'bulkMove' src/` returns 0 ## Suggested fix shape When multi-select is active (selectedDesigns.size > 1), show a "Move to…" button in the multi-select toolbar: ```tsx {selectedDesigns.size > 1 && ( <DropdownMenu> <DropdownMenuTrigger> <FolderInput size={14} /> Move to… </DropdownMenuTrigger> <DropdownMenuContent> {folders.map((folder) => ( <DropdownMenuItem key={folder.id} onClick={() => onBulkMoveToFolder(Array.from(selectedDesigns), folder.id)} > <Folder size={12} /> {folder.name} </DropdownMenuItem> ))} </DropdownMenuContent> </DropdownMenu> )} ``` `onBulkMoveToFolder(designIds, folderId)` dispatches `MOVE_DESIGNS` reducer action that updates each design's `folderId` to the new value. This mirrors the bulk delete pattern (per the existing `confirmBulkDelete` function in Gallery.tsx). ## Severity Low. The user can right-click each design. Power users with many designs notice. ## Discovered by Gap analysis (2026-10-02) of gallery multi-select affordances. ## Related - #179 (open) — Gallery multi-select. The selection is in place; the bulk actions are the parallel concern. - The right-click "Move to" (in `RightClickMenu.tsx`) is the per-card version. - The bulk delete is the pattern to mirror for the bulk move.
Author
Owner

#253 — already shipped via the bulk-action toolbar (#179). Closing this finding.

Bulk move-to-folder was added as part of the multi-select toolbar work and is in main:

  • src/components/gallery/SelectionToolbar.tsx:142-181 — Move to Folder button + DropdownMenu listing every non-default folder (bulk-move-trigger test id, bulk-move-{id} items).
  • src/pages/Gallery.tsx:931-947 — confirmBulkMove(folderId) loops handleMoveToFolder(id, folderId, { silent: true }) for every selected design and shows a single summary toast (Moved N designs to {folderName}).
  • src/pages/Gallery.tsx:1363 — <SelectionToolbar ... onBulkMove={confirmBulkMove} ... /> wires it to the rendered toolbar.
  • src/pages/Gallery.tsx:329-343 — handleMoveToFolder already takes { silent: true } so the batch fires one summary toast instead of N per-design toasts.
  • Test coverage in src/pages/issue-179.test.tsx (12 tests, 11 pass + 1 it.skip for Radix DropdownMenu interaction — a known jsdom limitation; Playwright e2e is the right home for that, see the skip reason in the file).

Closing as already-shipped. The gap-analysis finding pre-dated the bulk-action toolbar landing.

#253 — already shipped via the bulk-action toolbar (#179). Closing this finding. Bulk move-to-folder was added as part of the multi-select toolbar work and is in `main`: - `src/components/gallery/SelectionToolbar.tsx:142-181` — `Move to Folder` button + DropdownMenu listing every non-default folder (`bulk-move-trigger` test id, `bulk-move-{id}` items). - `src/pages/Gallery.tsx:931-947` — `confirmBulkMove(folderId)` loops `handleMoveToFolder(id, folderId, { silent: true })` for every selected design and shows a single summary toast (`Moved N designs to {folderName}`). - `src/pages/Gallery.tsx:1363` — `<SelectionToolbar ... onBulkMove={confirmBulkMove} ... />` wires it to the rendered toolbar. - `src/pages/Gallery.tsx:329-343` — `handleMoveToFolder` already takes `{ silent: true }` so the batch fires one summary toast instead of N per-design toasts. - Test coverage in `src/pages/issue-179.test.tsx` (12 tests, 11 pass + 1 `it.skip` for Radix DropdownMenu interaction — a known jsdom limitation; Playwright e2e is the right home for that, see the skip reason in the file). Closing as already-shipped. The gap-analysis finding pre-dated the bulk-action toolbar landing.
Mark closed this issue 2026-10-04 10:03:51 +00:00
Sign in to join this conversation.
No description provided.