Task #603: distinct, non-purple home-tile colours

The four default home-screen tiles (Notes / Services / Meetings /
Admin) showed up as three blue tiles + one orange one. Root cause was
NOT the DB — seed.ts already gave each app a distinct hex — but the
`gradientForColor()` mapper in `artifacts/tx-os/src/pages/home.tsx`
only recognised blue/purple/green/orange/pink/teal, so yellow
(#eab308), red (#ef4444), and the dark navy meetings colour all fell
through to the default blue gradient.

Changes:

1. `artifacts/tx-os/src/index.css` — added `.icon-tile-red` and
   `.icon-tile-yellow` gradients matching the existing tile style.

2. `artifacts/tx-os/src/pages/home.tsx` — `gradientForColor()` now
   maps red/dc2626 and yellow/facc15 first. Purple branch stays for
   admin-custom apps but no seeded row uses it.

3. `scripts/src/seed.ts` —
   - Meetings: `#0B1E3F` → `#22c55e` (green).
   - Notifications: `#8b5cf6` → `#06b6d4` (cyan) — kills the last
     purple in the default palette per user direction.

4. `scripts/src/update-app-colors.ts` (new) — idempotent migration
   that bumps existing rows ONLY when they still hold the exact old
   default colour, so admin customisations from the Apps editor are
   preserved. Wired into `scripts/package.json` as
   `pnpm run update-app-colors`.

5. `scripts/redeploy.sh` — new step 5/6 runs the colour migration
   after seed and before `docker compose up -d`, on the same one-shot
   `migrate` container pattern as other one-shot scripts.

No schema changes, no new deps. tx-os tsc passes, scripts tsc passes.
After `./scripts/redeploy.sh` on Mac, home shows four distinct hues
(yellow / orange / green / red) and no tile is purple anywhere.
This commit is contained in:
riyadhafraa
2026-05-18 13:52:42 +00:00
parent bcffb2a532
commit 4290bc54c9
6 changed files with 86 additions and 8 deletions
+2
View File
@@ -235,6 +235,8 @@
.icon-tile-orange { background: linear-gradient(135deg, #FDBA74, #F59E0B); }
.icon-tile-pink { background: linear-gradient(135deg, #F9A8D4, #EC4899); }
.icon-tile-teal { background: linear-gradient(135deg, #5EEAD4, #14B8A6); }
.icon-tile-red { background: linear-gradient(135deg, #FCA5A5, #EF4444); }
.icon-tile-yellow { background: linear-gradient(135deg, #FDE68A, #EAB308); }
/* Top bar variant — flat very-light glass, no heavy border */
.topbar-glass {
+9
View File
@@ -81,6 +81,15 @@ function resolveIcon(name: string): LucideIcon {
function gradientForColor(color: string): string {
const c = (color ?? "").toLowerCase();
// #603: each built-in app now ships with a distinct hue so the four
// default tiles (Notes/Services/Meetings/Admin) read as four different
// colours instead of three blues + one orange. New patterns added for
// yellow (#eab308 / facc15) and red (#ef4444 / dc2626), and the green
// branch already accepts the new #22c55e Meetings colour. The purple
// branch stays for any admin who manually picks a purple via the
// Apps editor, but no seeded row uses it any more.
if (c.includes("ef4444") || c.includes("dc2626") || c.includes("red")) return "icon-tile-red";
if (c.includes("eab308") || c.includes("facc15") || c.includes("yellow")) return "icon-tile-yellow";
if (c.includes("a855f7") || c.includes("8b5cf6") || c.includes("purple") || c.includes("violet")) return "icon-tile-purple";
if (c.includes("10b981") || c.includes("22c55e") || c.includes("green") || c.includes("emerald")) return "icon-tile-green";
if (c.includes("f59e0b") || c.includes("f97316") || c.includes("orange") || c.includes("amber")) return "icon-tile-orange";