Global Search Box for Spools/Filaments #35

New Issue

2026-01-16T04:57:58Z

tonym commented

2026-01-16 04:57:58 +00:00

Summary

Add a prominent search box to quickly find spools/filaments by name, color, material, etc.

Upstream Issues

https://github.com/Donkie/Spoolman/issues/598 (4 reactions)
https://github.com/Donkie/Spoolman/issues/356 (9 reactions) - Fuzzy search

Problem

With large inventories, scrolling through filtered lists is tedious. Users want to quickly type and find items.

Proposed Solution

1. Search Box on List Pages

Prominent search input at top of spool/filament lists
Searches across multiple fields: name, material, color, vendor, notes
Real-time filtering as you type

2. Fuzzy Search

Tolerate spelling variations and typos
Use libraries like fuse.js for fuzzy matching
Category-aware filtering based on current page context

3. Global Search (Header)

Search icon in header/nav
Opens search modal or dropdown
Search across ALL resources (spools, filaments, vendors, locations)
Keyboard shortcut: Cmd/Ctrl+K

4. Search Results

Group by resource type
Show color swatch, name, key details
Click to navigate to item

Implementation

// Fuzzy search with fuse.js
const fuse = new Fuse(items, {
  keys: ["name", "material", "vendor.name", "color_hex"],
  threshold: 0.4
});

## Summary Add a prominent search box to quickly find spools/filaments by name, color, material, etc. ## Upstream Issues - https://github.com/Donkie/Spoolman/issues/598 (4 reactions) - https://github.com/Donkie/Spoolman/issues/356 (9 reactions) - Fuzzy search ## Problem With large inventories, scrolling through filtered lists is tedious. Users want to quickly type and find items. ## Proposed Solution ### 1. Search Box on List Pages - Prominent search input at top of spool/filament lists - Searches across multiple fields: name, material, color, vendor, notes - Real-time filtering as you type ### 2. Fuzzy Search - Tolerate spelling variations and typos - Use libraries like fuse.js for fuzzy matching - Category-aware filtering based on current page context ### 3. Global Search (Header) - Search icon in header/nav - Opens search modal or dropdown - Search across ALL resources (spools, filaments, vendors, locations) - Keyboard shortcut: Cmd/Ctrl+K ### 4. Search Results - Group by resource type - Show color swatch, name, key details - Click to navigate to item ## Implementation ```tsx // Fuzzy search with fuse.js const fuse = new Fuse(items, { keys: ["name", "material", "vendor.name", "color_hex"], threshold: 0.4 }); ``` ## Related - #16 Filter by Color

tonym referenced this issue from a commit

2026-01-23 05:09:50 +00:00

feat: Add quick wins batch (#42, #43, #25, #35, #20, #36, #39)

tonym closed this issue

2026-01-23 05:14:09 +00:00

tonym referenced this issue from a commit

2026-01-23 05:17:45 +00:00

docs: Update CLAUDE.md with completed issues #20, #25, #35, #36, #39, #42, #43

Sign in to join this conversation.