ai-collab/bulk-image-organizer

Fork 0

PR8: Tag badge visual spec (colors, Dupe_ visibility, overflow) #14

New issue

Closed

opened 2026-06-04 16:54:15 +00:00 by Grok · 2 comments

Grok commented

2026-06-04 16:54:15 +00:00

Member

Context

PR5 ThumbnailDelegate draws small tag badges using deterministic HSV colors from tag name (MD5 hash). DELETE is excluded from badges and uses a red X overlay instead.

Ambiguity

TECHNICAL_OUTLINE §3.2 mentions tag badges but not:

Whether badge fill comes from tags.color column vs generated color
Whether Dupe_* tags appear on the main grid or only in Dupe Review
Max badges per cell, overflow UI (+N vs tooltip), and badge placement (over thumb vs below filename)
Text contrast / accessibility requirements for dark theme (PR12)

Current interim (PR5)

Up to 4 visible badges + +N overflow chip
Badges overlaid on bottom of thumb area
DELETE never shown as a badge

Requested decision

Document in DESIGN.md or a DR before PR8 tagging UI so delegate and tag panel stay consistent.

Blocks

Non-blocking for PR5; should be resolved before PR8.

## Context PR5 `ThumbnailDelegate` draws small tag badges using deterministic HSV colors from tag name (MD5 hash). DELETE is excluded from badges and uses a red X overlay instead. ## Ambiguity TECHNICAL_OUTLINE §3.2 mentions tag badges but not: - Whether badge fill comes from `tags.color` column vs generated color - Whether `Dupe_*` tags appear on the main grid or only in Dupe Review - Max badges per cell, overflow UI (`+N` vs tooltip), and badge placement (over thumb vs below filename) - Text contrast / accessibility requirements for dark theme (PR12) ## Current interim (PR5) - Up to 4 visible badges + `+N` overflow chip - Badges overlaid on bottom of thumb area - `DELETE` never shown as a badge ## Requested decision Document in DESIGN.md or a DR before PR8 tagging UI so delegate and tag panel stay consistent. ## Blocks Non-blocking for PR5; should be resolved before PR8.

Grok referenced this issue

2026-06-04 17:12:05 +00:00

PR5: Thumbnail grid foundation (IconMode + delegate) #16

ValleyGeek commented

2026-06-04 17:55:50 +00:00

Owner

Tags are saved per-workspace, not globally
There should be a container canvas available on the UI for all project tags, excluding Dupe_* and DELETE
The Container will have a "Tags" title above it to the left with a "New Tag" button above it to the right
"New Tag" will open a basic popup with a text field for tag name and a set 9 standard color chips plus one to chose a custom color from a color wheel. At the bottom will be a "Trash Bin" Icon button (disabled), "Cancel," and "Save" button
Double-clicking a tag in the picker will open the same popup window to allow the tag to be renamed or given a different color. In addition to the cancel and save buttons, on edit, the trashcan button should be enabled which will remove the tag from the pool and all associated images.
Clicking a tag a single time will toggle it for the selected photos
The number of tags visible should scale based on the size of the displayed images. At a lower thresholds the count of displayed tags should reduce and at higher thresholds more should display. This will likely need to be tied to real screen size rather than image scaling directly. Keep hard coded to 4 at this point in and we'll refine in later deliverables.

- Tags are saved per-workspace, not globally - There should be a container canvas available on the UI for all project tags, excluding `Dupe_*` and `DELETE` - The Container will have a "Tags" title above it to the left with a "New Tag" button above it to the right - "New Tag" will open a basic popup with a text field for tag name and a set 9 standard color chips plus one to chose a custom color from a color wheel. At the bottom will be a "Trash Bin" Icon button (disabled), "Cancel," and "Save" button - Double-clicking a tag in the picker will open the same popup window to allow the tag to be renamed or given a different color. In addition to the cancel and save buttons, on edit, the trashcan button should be enabled which will remove the tag from the pool and all associated images. - Clicking a tag a single time will toggle it for the selected photos - The number of tags visible should scale based on the size of the displayed images. At a lower thresholds the count of displayed tags should reduce and at higher thresholds more should display. This will likely need to be tied to real screen size rather than image scaling directly. Keep hard coded to 4 at this point in and we'll refine in later deliverables.

Grok commented

2026-06-04 18:08:10 +00:00

Author

Member

Resolved per ValleyGeek comment — recorded as DR-013 in docs/DECISIONS.md and DESIGN.md PR8.

Decision summary:

Tags are per-workspace (working DB)
Tag panel UX: "Tags" / "New Tag", picker excludes Dupe_* and DELETE
New/Edit dialog: 9 preset colors + custom wheel; trash on edit removes tag everywhere
Single-click toggles tag on selection
Grid badges: hard cap 4 for now; use tags.color when PR8 loads tags; DELETE = red X only

PR5: interim hash-based badge colors + 4-cap delegate (matches "hardcode 4" direction).

PR8: full tag panel + DB colors.

Closing as resolved.

**Resolved** per ValleyGeek comment — recorded as **DR-013** in `docs/DECISIONS.md` and DESIGN.md PR8. **Decision summary:** - Tags are per-workspace (working DB) - Tag panel UX: "Tags" / "New Tag", picker excludes `Dupe_*` and `DELETE` - New/Edit dialog: 9 preset colors + custom wheel; trash on edit removes tag everywhere - Single-click toggles tag on selection - Grid badges: **hard cap 4** for now; use `tags.color` when PR8 loads tags; DELETE = red X only **PR5:** interim hash-based badge colors + 4-cap delegate (matches "hardcode 4" direction). **PR8:** full tag panel + DB colors. Closing as resolved.

Grok closed this issue

2026-06-04 18:08:15 +00:00

No milestone

No project

No assignees

2 participants

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

ai-collab/bulk-image-organizer#14

No description provided.

Rows
Columns