Gallery has no 'sort' within a folder (e.g., by name, by stitch count) — user with 30 designs in one folder can only see the default order, no way to sort by date edited or stitches #312

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

Finding

The Gallery has a global sort mode (per the snippet: 'newest', 'oldest', 'recently-edited', 'name-asc', 'name-desc', 'Most stitches'). But the sort is global — it applies to all folders.

grep -rn 'sortByFolder\|perFolderSort' src/pages/Gallery.tsx returns 0.

A user with:

  • 30 designs in "Work" folder
  • 5 designs in "Personal" folder
  • Wants to sort "Work" by "Most stitches" but "Personal" by "Name"

Currently: one sort applies to all. The user has to switch sort to see different orders.

The fix is per-folder sort: each folder remembers its preferred sort.

Where

  • Gallery state: src/pages/Gallery.tsx (single sortMode)
  • No per-folder sort: grep -rn 'perFolderSort' src/ returns 0
  • The folder system: src/components/gallery/FolderNav.tsx

Suggested fix shape

  1. State: replace sortMode: SortMode with sortModes: Record<string, SortMode> (folder ID → sort mode):
const [sortModes, setSortModes] = useState<Record<string, SortMode>>({});
const currentSortMode = sortModes[activeFolder] ?? 'newest';
const setSortMode = (mode: SortMode) => setSortModes((prev) => ({ ...prev, [activeFolder]: mode }));
  1. Persistence: persist the sortModes to localStorage so each folder's preference survives a refresh.

  2. UI: the sort dropdown shows the current folder's sort mode. The "all" folder has its own sort.

  3. Migration: existing localStorage (which has a single sortMode) migrates to sortModes['all'].

Severity

Low. The user can use the global sort. Power users with many folders notice.

Discovered by

Gap analysis (2026-10-02) of gallery sort.

  • The current single sort mode is in src/pages/Gallery.tsx.
  • The folder system (per #148) is the same pattern: per-folder state.
  • Figma/Notion have per-folder sort; the gallery's gap is the parallel.
## Finding The Gallery has a global sort mode (per the snippet: 'newest', 'oldest', 'recently-edited', 'name-asc', 'name-desc', 'Most stitches'). But the sort is global — it applies to all folders. `grep -rn 'sortByFolder\|perFolderSort' src/pages/Gallery.tsx` returns 0. A user with: - 30 designs in "Work" folder - 5 designs in "Personal" folder - Wants to sort "Work" by "Most stitches" but "Personal" by "Name" Currently: one sort applies to all. The user has to switch sort to see different orders. The fix is per-folder sort: each folder remembers its preferred sort. ## Where - Gallery state: `src/pages/Gallery.tsx` (single `sortMode`) - No per-folder sort: `grep -rn 'perFolderSort' src/` returns 0 - The folder system: `src/components/gallery/FolderNav.tsx` ## Suggested fix shape 1. **State**: replace `sortMode: SortMode` with `sortModes: Record<string, SortMode>` (folder ID → sort mode): ```ts const [sortModes, setSortModes] = useState<Record<string, SortMode>>({}); const currentSortMode = sortModes[activeFolder] ?? 'newest'; const setSortMode = (mode: SortMode) => setSortModes((prev) => ({ ...prev, [activeFolder]: mode })); ``` 2. **Persistence**: persist the `sortModes` to localStorage so each folder's preference survives a refresh. 3. **UI**: the sort dropdown shows the current folder's sort mode. The "all" folder has its own sort. 4. **Migration**: existing localStorage (which has a single `sortMode`) migrates to `sortModes['all']`. ## Severity Low. The user can use the global sort. Power users with many folders notice. ## Discovered by Gap analysis (2026-10-02) of gallery sort. ## Related - The current single sort mode is in `src/pages/Gallery.tsx`. - The folder system (per #148) is the same pattern: per-folder state. - Figma/Notion have per-folder sort; the gallery's gap is the parallel.
Author
Owner

Closed retroactively after fix landed on main in 7cd6dad ("Apply changes from kilo-gsd.py run for Mark/Kimi_Agent_Brother_10_Digitizing_App#316"). That commit's patch set also covers #312: src/components/gallery/persistedFilters.ts gained sortModes: Record<string, SortMode> plus the v1→v2 legacy migration; src/components/workspace/CanvasArea.tsx and src/pages/Gallery.tsx were updated to the per-folder setter (fixes TS2561 sortMode should be sortModes); new test file src/components/gallery/issue-312-per-folder-sort.test.ts was added. The kilo-gsd run for #312 hit push-rejected (fetch first) and left a salvage marker; the launcher re-spawned a fresh run, but the fix had already landed via the parallel #316 commit before that. Watcher t_47ebdef4 closing #312 with this comment.

Closed retroactively after fix landed on main in 7cd6dad ("Apply changes from kilo-gsd.py run for Mark/Kimi_Agent_Brother_10_Digitizing_App#316"). That commit's patch set also covers #312: src/components/gallery/persistedFilters.ts gained `sortModes: Record<string, SortMode>` plus the v1→v2 legacy migration; src/components/workspace/CanvasArea.tsx and src/pages/Gallery.tsx were updated to the per-folder setter (fixes TS2561 `sortMode` should be `sortModes`); new test file src/components/gallery/issue-312-per-folder-sort.test.ts was added. The kilo-gsd run for #312 hit push-rejected (`fetch first`) and left a salvage marker; the launcher re-spawned a fresh run, but the fix had already landed via the parallel #316 commit before that. Watcher t_47ebdef4 closing #312 with this comment.
Mark 2026-10-05 14:38:25 +00:00
Sign in to join this conversation.
No description provided.