feat: Add color column with filter to spool list
Some checks failed
CI / style (push) Has been cancelled
CI / build-client (push) Has been cancelled
CI / build-amd64 (push) Has been cancelled
CI / build-tester (push) Has been cancelled
CI / test (cockroachdb) (push) Has been cancelled
CI / test (mariadb) (push) Has been cancelled
CI / test (postgres) (push) Has been cancelled
CI / test (sqlite) (push) Has been cancelled
CI / build-arm64 (push) Has been cancelled
CI / build-armv7 (push) Has been cancelled
CI / publish-images (push) Has been cancelled
CI / publish-release (push) Has been cancelled

Add optional color column to spool list showing filament color swatches
with multi-select filtering capability.

Backend:
- GET /api/v1/color endpoint to list distinct filament colors
- filament.color_hex query param on spool list for filtering

Frontend:
- ColorFilterColumn component renders color swatches
- useSpoolmanColors() hook fetches available colors
- Filter dropdown shows swatches with hex codes
- Column hidden by default (enable via column selector)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-21 21:11:18 -06:00
parent 8fc06cdb18
commit 9bfc322f32
9 changed files with 193 additions and 11 deletions

View File

@@ -122,7 +122,7 @@ Environment variables (see `.env.example`):
This is a fork with UX improvements. Issues are tracked on the Gitea instance above.
## UX Improvement Issues
## UX Improvement Issues (Gitea)
| # | Title | Status |
|---|-------|--------|
@@ -132,16 +132,23 @@ This is a fork with UX improvements. Issues are tracked on the Gitea instance ab
| 4 | Layout Max-Width | ✅ DONE |
| 5 | Temperature Ranges | ✅ DONE |
| 6 | Spool Adjustment History | ✅ DONE |
| 7 | 3dfilamentprofiles Integration | ❌ REMOVED (bot protection) |
| 8 | (see Gitea #8) | ✅ DONE |
| 9 | Hierarchical Locations (Room/Bin) | Open |
| 7 | 3dfilamentprofiles Integration | ❌ REMOVED |
| 8 | (duplicate of #7) | ✅ DONE |
| 9 | Hierarchical Locations (Room/Bin) | **Open** |
| 10 | Database Import/Export | ✅ DONE |
| 11 | Theme Colors | ✅ DONE |
| 12 | Clickable Dashboard Cards | ✅ DONE |
| 13 | QR Code Size Setting | ✅ DONE |
| 14 | Parse Temps from Comments | ✅ DONE |
| 15 | Print Job Tracking / Slicer Integration | ✅ DONE |
| 16 | Prev/Next Navigation on Edit Pages | ✅ DONE |
| 11 | Slicer Integration / Print Jobs | ✅ DONE |
| 12 | Redesign Home Page Dashboard | **Open** |
| 13 | Batch Operations (Multi-Select Edit) | **Open** |
| 14 | Extra Weight Field (DryPods, etc.) | **Open** |
| 15 | Spool Count per Filament in List | **Open** |
### Other Features (not tracked in Gitea)
- ✅ Theme Colors (5 options)
- ✅ Clickable Dashboard Cards
- ✅ QR Code Size Setting
- ✅ Parse Temps from Comments
- ✅ Prev/Next Navigation on Edit Pages
- ✅ Color Column in Spool List (with filter)
### Issue #1 Complete - Inline Creation Modals
@@ -326,6 +333,28 @@ Track pending print jobs from slicer and manage filament deduction after prints
- Configure via env vars: `SPOOLMAN_URL`, `SPOOLMAN_SPOOL_ID`
- Or config file: `~/.config/spoolman/slicer.conf`
### Color Column in Spool List
Added optional color column to the spool list with filtering capability.
**Backend:**
- `spoolman/database/filament.py` - `find_colors()` function to get distinct color hex codes
- `spoolman/api/v1/other.py` - `GET /api/v1/color` endpoint to list all colors
- `spoolman/api/v1/spool.py` - Added `filament.color_hex` query parameter for filtering
- `spoolman/database/spool.py` - Filter implementation (supports comma-separated values)
**Frontend:**
- `client/src/components/column.tsx` - `ColorFilterColumn` component renders color swatches
- `client/src/components/otherModels.tsx` - `useSpoolmanColors()` hook to fetch colors
- `client/src/pages/spools/list.tsx` - Added color column (hidden by default)
- `client/public/locales/en/common.json` - Added "Color" translation key
**Features:**
- Color displayed as small swatch with hex tooltip
- Filter dropdown shows swatches with hex codes
- Multi-select filtering (can filter by multiple colors)
- Column hidden by default (enable via column selector)
---
## Deployment