@spunto/design-system 0.11.0 → 0.11.1

package/package.json

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

package/src/components/projects/advanced-sections.tsx

@@ -4,7 +4,7 @@ import type { ReactNode } from "react"
 import { ChevronDownIcon, Settings2Icon } from "lucide-react"
 
 import { cn } from "../../utils"
-import type { ProjectFormSectionId, ProjectFormValue } from "./types"
+import type { ProjectFormSectionId, ProjectFormValue, ProjectSecretRef } from "./types"
 
 export interface AdvancedDisclosureProps {
   open: boolean
@@ -101,7 +101,17 @@ export function AdvancedDisclosure({
  * `lifecycle`, `3 secrets`. Pure, and exported, because a caller rendering its
  * own fold needs the same sentence.
  */
-export function advancedSummary(value: ProjectFormValue, sections: ProjectFormSectionId[]): string[] {
+export function advancedSummary(
+  value: ProjectFormValue,
+  sections: ProjectFormSectionId[],
+  /**
+   * Secrets already stored server-side. They count: a project whose only
+   * advanced setting is three secrets would otherwise show an empty summary and
+   * keep the fold shut over them — exactly the "hides configuration you didn't
+   * set yourself" failure this component exists to avoid.
+   */
+  savedSecrets: ProjectSecretRef[] = []
+): string[] {
   const out: string[] = []
   for (const id of sections) {
     switch (id) {
@@ -124,9 +134,11 @@ export function advancedSummary(value: ProjectFormValue, sections: ProjectFormSe
       case "docker":
         if (value.dockerInDocker) out.push("docker-in-docker")
         break
-      case "secrets":
-        if (value.secrets.length) out.push(`${value.secrets.length} secret${value.secrets.length > 1 ? "s" : ""}`)
+      case "secrets": {
+        const n = value.secrets.length + savedSecrets.filter((x) => !value.removedSecretIds.includes(x.id)).length
+        if (n) out.push(`${n} secret${n > 1 ? "s" : ""}`)
         break
+      }
       // Identity, image and repositories are never advanced — they're the form.
       default:
         break

package/src/components/projects/project-form.tsx

@@ -182,11 +182,11 @@ export function ProjectForm({
 }: ProjectFormProps) {
   const patch = (next: Partial<ProjectFormValue>) => onChange({ ...value, ...next })
 
-  const rows = manifestRows(value, sections)
+  const rows = manifestRows(value, sections, savedSecrets)
 
   const advanced = sections.filter((id) => advancedSections.includes(id))
   const primary = sections.filter((id) => !advancedSections.includes(id))
-  const summary = advancedSummary(value, advanced)
+  const summary = advancedSummary(value, advanced, savedSecrets)
   // Start open when there's already something in there — the initial value is
   // read once, on mount, so a later edit can't yank the fold open under the
   // user's cursor.
@@ -450,7 +450,12 @@ function parsePorts(raw: string): number[] {
  * actually shown get a line: a creation form that hides ports shouldn't recap
  * an empty "ports" row.
  */
-export function manifestRows(value: ProjectFormValue, sections: ProjectFormSectionId[]): ManifestRow[] {
+export function manifestRows(
+  value: ProjectFormValue,
+  sections: ProjectFormSectionId[],
+  /** Counted alongside the drafts — an existing secret is still a secret. */
+  savedSecrets: ProjectSecretRef[] = []
+): ManifestRow[] {
   const shown = new Set(sections)
   const rows: ManifestRow[] = []
 
@@ -481,8 +486,10 @@ export function manifestRows(value: ProjectFormValue, sections: ProjectFormSecti
     rows.push({ label: "prewarm", value: `${value.prewarmImages.length}`, done: value.prewarmImages.length > 0 })
   if (shown.has("docker"))
     rows.push({ label: "docker", value: value.dockerInDocker ? "in-docker" : "off", done: value.dockerInDocker })
-  if (shown.has("secrets"))
-    rows.push({ label: "secrets", value: `${value.secrets.length}`, done: value.secrets.length > 0 })
+  if (shown.has("secrets")) {
+    const n = value.secrets.length + savedSecrets.filter((x) => !value.removedSecretIds.includes(x.id)).length
+    rows.push({ label: "secrets", value: `${n}`, done: n > 0 })
+  }
 
   return rows
 }