Repository navigation
ui(icons): unify mini-icon system for trees and shared chrome #472
Description
Problem
Mini icons across Querya Desktop are almost entirely ad-hoc material.Icon(..., size: N) with no shared semantic registry or size tokens. Lucide / shadcn icon wrappers exist in vendored shadcn_flutter but are unused in lib/.
This causes the same UI roles to render differently by surface (native tree vs SDUI vs toolbars) and makes density / branding hard to keep consistent.
Scope
1. Shared icon layer
- Introduce a small semantic icon map (e.g.
QueryaIcons/AppIcons) for tree + chrome roles: database, schema, table, view, function, sequence, index, folder, expand, error, loading affordance, etc. - Centralize size tokens for mini roles (tree leaf / group / expand / toolbar / menu) instead of scattered
12|13|14|16|18. - Keep Material as the glyph source for now (or explicitly decide Lucide) — avoid mixing families without a rule.
2. Connections / object trees
Align entity → icon across drivers and reuse one row chrome path where possible:
| Role | Current drift |
|---|---|
| Table leaf | PG reuses table_chart; MySQL/SQLite use grid_on |
| View | Tree view_agenda_rounded vs SDUI visibility_outlined |
| Schema | Only PG uses diamond_outlined (outlined among rounded) |
| Expand / spinner | 13 vs 14; spinner 10–14 |
| Errors | Mongo has error_outline; PG/MySQL often text-only |
| Redis DB rows | Custom InkWell — bypasses _PgTreeRow |
| SDUI extension tree | Separate outlined map at size 16 (sdui_tree_builder.dart) |
Key files:
lib/features/connections/connections_panel_pg_tree.dart(_PgTreeRow)lib/features/connections/connections_panel_{mysql,sqlite,redis,mongo,extension}.dartlib/core/sdui/sdui_tree_builder.dartlib/features/connections/driver_icon.dart(PNG brands — keep)
3. Deduplicate connection-type icons
ConnectionType / driver → icon maps are copied in:
connections_panel.dartnew_connection_dialog.dartworkspace_empty_hero.dart
Collapse to one source (ideally next to DriverIcon).
4. Broader chrome (light pass)
Apply the same size tokens to toolbars, title-bar menu leadings, toasts, and dialog headers so mini icons don’t jump between 15–24 without reason. Tab strip can stay text-only unless we deliberately add icons later.
Non-goals
- Full Lucide migration of the app
- Redesigning driver PNG brand marks
- Changing tree information architecture / labels
Acceptance criteria
- One semantic icon map used by PG/MySQL/SQLite/Mongo/Redis trees and SDUI string→icon mapping
- Shared size tokens for tree mini icons (leaf / group / expand) and documented toolbar/menu sizes
- Connection-type icon map defined once; panel / new-connection / empty hero consume it
- Same entity type shows the same glyph across native trees (and SDUI where the string maps to that entity)
- Error / empty affordances in trees consistently use an icon + message pattern
- No new Lucide/Material mix without an explicit comment/policy in the icon module
References
Post-0.4.11-b UI pass; related surfaces shipped under shell UX / connections panel.
Activity
Merge pull request #475 from QueryaHub/issue/472-unify-mini-icons
Merge pull request #476 from QueryaHub/issue/472-tree-visual-unify
ZhuchkaTriplesix commentedon Jul 28, 2026
Shipped on
dev(PR targeteddev, so auto-close did not fire). See related merged PRs.