@spunto/design-system 0.13.1 → 0.14.1

package/README.md

@@ -120,14 +120,16 @@ panel are the same concept seen twice, so they share `/projects`.
   differently: `WorkerStatusDot`/`WorkerStatusPill` (+`resolveWorkerStatus`,
   `workerStatusConfig`), `SetupProgress` (+`setupProgress`, `phaseLabel`,
   `setupTotalMs`), `StepIndicator`, `ResourceBars`, `GitBranchChips`/
-  `GitStatusSummary`/`RequestedBranchChip`, `TagChips` (+`tagColor`),
-  `CreatorAvatar`.
-- **What a worker is working on, in two tenses**: `gitStatus` is what it *did*
-  check out (a chip per repo) and `worker.branch` is what it was *asked* to
-  check out. The live status wins as soon as it exists; until then — during
-  setup, and on a stopped worker — the requested branch holds its place as a
-  lone chip (`RequestedBranchChip`), in the same shell so it reads as the same
-  kind of information.
+  `GitStatusSummary`, `TagChips` (+`tagColor`), `CreatorAvatar`.
+- **One list of repositories, drawn as given.** `gitStatus` answers "what is
+  this worker working on", and the *tense* of that answer belongs to the caller:
+  the live checkout once it's known, the branches the worker was asked to check
+  out while it isn't (setup in flight, stopped worker). The card doesn't hold a
+  second, worker-level branch and doesn't decide when the list is meaningful —
+  only the caller knows whether its own data is still fresh. Keep the same
+  `path` for both tenses (Spunto clones into `/workspace/<workspacePath>`, which
+  is what `git-status` reports) and the transition is a value change on the same
+  chip.
 - **Types are structural**, never the apps' OpenAPI types: the dashboard and
   Spunto Lite model a worker differently, so `WorkerCardWorker` asks for the
   minimum, everything optional but `id`, and an unknown state falls back to

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spunto/design-system",
-  "version": "0.13.1",
+  "version": "0.14.1",
   "description": "Spunto's shared design system — warm/flame tokens, color constants, and UI primitives.",
   "type": "module",
   "license": "MIT",

package/src/components/workers/git-branch-chips.tsx

@@ -77,27 +77,6 @@ export function GitBranchChips({ repos, repoHref, className }: GitBranchChipsPro
   )
 }
 
-export interface RequestedBranchChipProps {
-  branch: string
-  className?: string
-}
-
-/**
- * The branch a worker was *asked* to check out, as a lone chip — no repo name,
- * because at that point nothing is cloned yet and there is none to show. Same
- * shell as the chips above on purpose: it's the placeholder they replace once
- * the live status arrives, and a different-looking chip would read as a
- * different kind of information.
- */
-export function RequestedBranchChip({ branch, className }: RequestedBranchChipProps) {
-  return (
-    <span data-slot="requested-branch-chip" className={cn(CHIP, className)} title={`Requested branch: ${branch}`}>
-      <GitBranchIcon className="h-2.5 w-2.5 shrink-0" />
-      <span className="min-w-0 truncate">{branch}</span>
-    </span>
-  )
-}
-
 /** Amber for local work not yet committed/pushed, muted for what's merely behind. */
 function RepoCounters({ repo }: { repo: GitRepoStatus }) {
   return (

package/src/components/workers/index.ts

@@ -18,8 +18,8 @@ export type { SetupProgressProps, StepState } from "./setup-progress"
 export { ResourceBars } from "./resource-bars"
 export type { ResourceBarsProps, WorkerStats } from "./resource-bars"
 
-export { GitBranchChips, GitStatusSummary, RequestedBranchChip, repoName } from "./git-branch-chips"
-export type { GitBranchChipsProps, GitRepoStatus, GitStatusSummaryProps, RequestedBranchChipProps } from "./git-branch-chips"
+export { GitBranchChips, GitStatusSummary, repoName } from "./git-branch-chips"
+export type { GitBranchChipsProps, GitRepoStatus, GitStatusSummaryProps } from "./git-branch-chips"
 
 export { TagChips } from "./tag-chips"
 export type { TagChipsProps } from "./tag-chips"

package/src/components/workers/types.ts

@@ -31,12 +31,6 @@ export interface WorkerCardWorker {
   /** Docker-level state: `running` | `stopped` | `exited` | `created` | `not_found` | `error`. */
   dockerState?: string | null
   createdAt?: string | null
-  /**
-   * Branch asked for at creation — what the worker is *going to* check out. The
-   * live per-repo status (`gitStatus`) says what it *did* check out, and takes
-   * over as soon as it exists.
-   */
-  branch?: string | null
   projectVersion?: number | null
   tags?: string[] | null
   setupStatus?: WorkerSetupStatus | null

package/src/components/workers/worker-card.tsx

@@ -14,7 +14,7 @@ import {
 import { cn, formatDuration, formatRelativeTime } from "../../utils"
 import { buttonVariants } from "../button-variants"
 import { CreatorAvatar } from "./creator-avatar"
-import { GitBranchChips, RequestedBranchChip, type GitRepoStatus } from "./git-branch-chips"
+import { GitBranchChips, type GitRepoStatus } from "./git-branch-chips"
 import { ResourceBars, type WorkerStats } from "./resource-bars"
 import { SetupProgress, setupTotalMs } from "./setup-progress"
 import { TagChips } from "./tag-chips"
@@ -42,7 +42,14 @@ export interface WorkerCardProps {
   nodeOnline?: boolean
   /** Live container stats. Absent → no resource bars (the usual case for a stopped worker). */
   stats?: WorkerStats | null
-  /** Checked-out repositories. Absent/empty → no chips. */
+  /**
+   * What this worker is working on, as one list of repositories — drawn as
+   * given. Which tense that list is in belongs to the caller: the live checkout
+   * once it's known, the branches the worker was *asked* to check out while it
+   * isn't (setup in flight, worker stopped). The card doesn't second-guess it,
+   * because only the caller knows whether its own data is still meaningful.
+   * Absent/empty → no chips.
+   */
   gitStatus?: GitRepoStatus[] | null
   /** Chip → URL (e.g. code-server at that folder). Returning undefined renders a static chip. */
   repoHref?: (repo: GitRepoStatus) => string | undefined
@@ -121,9 +128,10 @@ export function WorkerCard({
 
   // Live detail is only meaningful once the container is up *and* done setting
   // up: mid-setup a stale "running" from docker would show stats for a worker
-  // that isn't usable yet.
+  // that isn't usable yet. That guard is for `stats`, which the card reads as
+  // live-or-nothing; `gitStatus` is drawn as given (see the prop).
   const settled = status.running && !status.settingUp
-  const repos = settled ? (gitStatus ?? []) : []
+  const repos = gitStatus ?? []
   const outdated =
     !status.settingUp &&
     worker.projectVersion != null &&
@@ -141,7 +149,13 @@ export function WorkerCard({
       // full-width row on a phone — and a 290 px card in a sidebar on a 27"
       // screen is exactly as cramped as a phone.
       className={cn(
-        "@container overflow-hidden rounded-xl border border-border bg-card transition-colors hover:shadow-sm",
+        // `flex h-full flex-col`, avec le pied en `mt-auto` : dans une grille de
+        // cartes, les cellules s'étirent sur la plus haute, et sans ça le bouton
+        // s'arrête là où le contenu s'arrête — une rangée de cartes finit avec
+        // des bandes de carte vide sous les boutons, à des hauteurs différentes.
+        // Hors grille, `height: 100%` d'un parent en hauteur automatique se
+        // résout en automatique : rien ne change.
+        "@container flex h-full flex-col overflow-hidden rounded-xl border border-border bg-card transition-colors hover:shadow-sm",
         className
       )}
     >
@@ -209,16 +223,10 @@ export function WorkerCard({
         </div>
       )}
 
-      {repos.length > 0 ? (
+      {repos.length > 0 && (
         <div className="px-4 pb-3">
           <GitBranchChips repos={repos} repoHref={repoHref} />
         </div>
-      ) : (
-        worker.branch && (
-          <div className="px-4 pb-3">
-            <RequestedBranchChip branch={worker.branch} />
-          </div>
-        )
       )}
 
       {settled && stats && (
@@ -278,7 +286,7 @@ export function WorkerCard({
       )}
 
       {(footer ?? href) && (
-        <div className="border-t border-border/50 bg-muted/20 px-3 py-2">
+        <div className="mt-auto border-t border-border/50 bg-muted/20 px-3 py-2">
           {footer ?? (
             <Link href={href!} className={cn(buttonVariants({ variant: "default", size: "sm" }), "h-7 w-full gap-1.5 text-xs")}>
               {viewLabel}