app: use SquareCode as the program icon

Swap the canonical KIND_ICONS.program glyph from Package to SquareCode, and route the palette + System-map program affordances through it. (The Programs nav icon in Layout.tsx changes too, committed separately with its own WIP.)
This commit is contained in:
2026-07-07 17:27:20 -07:00
parent 6f2326ee19
commit a29422d870
3 changed files with 10 additions and 7 deletions

View File

@@ -1,9 +1,11 @@
import { useEffect, useMemo, useState } from "react" import { useEffect, useMemo, useState } from "react"
import { useNavigate } from "react-router-dom" import { useNavigate } from "react-router-dom"
import { ExternalLink, Gauge, Maximize2, Package, Search } from "lucide-react" import { ExternalLink, Gauge, Maximize2, Search } from "lucide-react"
import { useGateway, useGraph, useMeshDeployments, usePrograms } from "@/services/api/hooks" import { useGateway, useGraph, useMeshDeployments, usePrograms } from "@/services/api/hooks"
import { kindIcon } from "@/lib/labels" import { kindIcon } from "@/lib/labels"
const ProgramIcon = kindIcon("program")
// The command palette — the keyboard twin of the System map's inspect panel. ⌘K // The command palette — the keyboard twin of the System map's inspect panel. ⌘K
// from anywhere: an empty query is the "Start Menu" (launchable apps); typing // from anywhere: an empty query is the "Start Menu" (launchable apps); typing
// searches every deployment and program. One row per real thing: a deployed // searches every deployment and program. One row per real thing: a deployed
@@ -233,7 +235,7 @@ function PaletteBody({ onClose }: { onClose: () => void }) {
title="Go to program (source)" title="Go to program (source)"
className="shrink-0 text-[var(--muted)] hover:text-[var(--card-foreground)]" className="shrink-0 text-[var(--muted)] hover:text-[var(--card-foreground)]"
> >
<Package size={13} /> <ProgramIcon size={13} />
</button> </button>
)} )}
<button <button

View File

@@ -1,18 +1,18 @@
import type { LucideIcon } from "lucide-react" import type { LucideIcon } from "lucide-react"
import { Box, Clock, LayoutTemplate, Package, Server, Waypoints, Wrench } from "lucide-react" import { Box, Clock, LayoutTemplate, Server, SquareCode, Waypoints, Wrench } from "lucide-react"
// Canonical kind → icon — the single source of truth so the nav, Overview tiles, // Canonical kind → icon — the single source of truth so the nav, Overview tiles,
// cards, the System map, and the command palette all speak one visual language. // cards, the System map, and the command palette all speak one visual language.
// (Colors live in KindBadge; labels/descriptions are below.) `program` is the // (Colors live in KindBadge; labels/descriptions are below.) `program` is the
// catalog pseudo-kind, not a deployment kind — the same Package glyph the // catalog pseudo-kind, not a deployment kind — the SquareCode glyph the Programs
// Programs nav entry and Overview tile use. // nav entry and Overview tile use.
export const KIND_ICONS: Record<string, LucideIcon> = { export const KIND_ICONS: Record<string, LucideIcon> = {
service: Server, service: Server,
job: Clock, job: Clock,
tool: Wrench, tool: Wrench,
static: LayoutTemplate, static: LayoutTemplate,
reference: Waypoints, reference: Waypoints,
program: Package, program: SquareCode,
} }
export function kindIcon(kind: string): LucideIcon { export function kindIcon(kind: string): LucideIcon {

View File

@@ -31,6 +31,7 @@ import {
Plus, Plus,
RotateCw, RotateCw,
Router, Router,
SquareCode,
Trash2, Trash2,
X, X,
} from "lucide-react" } from "lucide-react"
@@ -169,7 +170,7 @@ function MapNode({ data }: NodeProps) {
d.onProgram?.(d.program!) d.onProgram?.(d.program!)
}} }}
> >
<Package size={11} /> <SquareCode size={11} />
</button> </button>
) : ( ) : (
// No program (inline infra) — a same-size, non-interactive cell with a // No program (inline infra) — a same-size, non-interactive cell with a