@cat-factory/app 0.248.0 → 0.249.0

package/app/modular/tutorial-tours.ts

@@ -152,6 +152,15 @@ export const TUTORIAL_REQUIREMENTS = {
     labelKey: 'tutorial.requirements.library',
     met: (gates) => gates.libraryAvailable,
   },
+  // The CONNECTION rather than the permission to make one: starting from a design is
+  // member-tier, and the frame-header button the tour clicks exists only once some admin has
+  // connected a design source. A tour gated on `integrations.manage` would be withheld from
+  // exactly the persona it is written for.
+  designSource: {
+    id: 'design-source',
+    labelKey: 'tutorial.requirements.designSource',
+    met: (gates) => gates.designSourceConnected,
+  },
 } as const satisfies Record<string, TutorialRequirement>
 
 export const TUTORIAL_TOURS: readonly TutorialTour[] = [
@@ -575,6 +584,74 @@ export const TUTORIAL_TOURS: readonly TutorialTour[] = [
       },
     ],
   },
+  {
+    id: 'start-from-design',
+    order: 55,
+    icon: 'i-lucide-frame',
+    titleKey: 'tutorial.tours.startFromDesign.title',
+    descriptionKey: 'tutorial.tours.startFromDesign.description',
+    // The delivery loop as a DESIGNER enters it, which is a different first step from
+    // `first-task`: the work starts from a frame in Figma, not from a title someone types. It
+    // rides the loop's order (after the run tours, before the platform half) rather than
+    // replacing `first-task`, because it ends in the same add-task form and everything after
+    // that point is the arc those tours already cover.
+    //
+    // Offered at launch, unlike the platform tours, and gated on the design source being
+    // CONNECTED: on a board with one, this is the everyday loop rather than reference material.
+    requires: [
+      TUTORIAL_REQUIREMENTS.boardWrite,
+      TUTORIAL_REQUIREMENTS.service,
+      TUTORIAL_REQUIREMENTS.designSource,
+    ],
+    steps: [
+      {
+        id: 'intro',
+        titleKey: 'tutorial.tours.startFromDesign.steps.intro.title',
+        bodyKey: 'tutorial.tours.startFromDesign.steps.intro.body',
+      },
+      {
+        id: 'open',
+        target: 'frame-start-from-design',
+        advanceOn: 'target-click',
+        placement: 'bottom',
+        titleKey: 'tutorial.tours.startFromDesign.steps.open.title',
+        bodyKey: 'tutorial.tours.startFromDesign.steps.open.body',
+      },
+      {
+        id: 'paste',
+        target: 'start-from-design-link',
+        // Inside the modal the previous click opens.
+        waitForTargetMs: 8000,
+        placement: 'bottom',
+        titleKey: 'tutorial.tours.startFromDesign.steps.paste.title',
+        bodyKey: 'tutorial.tours.startFromDesign.steps.paste.body',
+      },
+      {
+        // Left to the anchor-skip rather than given a `when`: the resolved card appears only
+        // once a link has actually been pasted, and someone walking the tour without one in
+        // hand should reach the finish card rather than stall on an input they cannot fill.
+        id: 'resolved',
+        target: 'start-from-design-resolved',
+        waitForTargetMs: 8000,
+        placement: 'bottom',
+        titleKey: 'tutorial.tours.startFromDesign.steps.resolved.title',
+        bodyKey: 'tutorial.tours.startFromDesign.steps.resolved.body',
+      },
+      {
+        id: 'continue',
+        target: 'start-from-design-continue',
+        advanceOn: 'target-click',
+        placement: 'top',
+        titleKey: 'tutorial.tours.startFromDesign.steps.continue.title',
+        bodyKey: 'tutorial.tours.startFromDesign.steps.continue.body',
+      },
+      {
+        id: 'finish',
+        titleKey: 'tutorial.tours.startFromDesign.steps.finish.title',
+        bodyKey: 'tutorial.tours.startFromDesign.steps.finish.body',
+      },
+    ],
+  },
   // ---------------------------------------------------------------------------------------
   // The platform half. Ordered after the whole delivery loop so the catalogue reads in the
   // order someone meets these things: learn the loop, then the machinery under it.

package/app/pages/index.vue

@@ -55,6 +55,9 @@ const DocumentTemplatesModal = defineAsyncComponent(
 const SpawnPreviewModal = defineAsyncComponent(
   () => import('~/components/documents/SpawnPreviewModal.vue'),
 )
+const StartFromDesignModal = defineAsyncComponent(
+  () => import('~/components/documents/StartFromDesignModal.vue'),
+)
 const BootstrapModal = defineAsyncComponent(
   () => import('~/components/bootstrap/BootstrapModal.vue'),
 )
@@ -472,6 +475,7 @@ watch(
         <DocumentImportModal v-if="ui.documentImport" />
         <DocumentTemplatesModal v-if="ui.documentTemplates" />
         <SpawnPreviewModal v-if="ui.spawnPreview" />
+        <StartFromDesignModal v-if="ui.startFromDesign" />
         <BootstrapModal v-if="ui.bootstrapOpen" />
         <AddServiceFromRepoModal v-if="ui.addServiceOpen" />
         <GitHubPanel v-if="ui.githubOpen" />

package/app/stores/documents.spec.ts

@@ -154,3 +154,63 @@ describe('documents store: manual refresh', () => {
     expect(store.freshnessFor('figma', 'file1:1-2')).toBeUndefined()
   })
 })
+
+describe('documents store: the OAuth and design halves of the source list', () => {
+  /** The source listing the probe reads: descriptors PLUS what this deployment can OAuth. */
+  function stubSources(oauthSources: string[]) {
+    stubApi({
+      listDocumentSources: () =>
+        Promise.resolve({
+          sources: [
+            {
+              source: 'figma',
+              label: 'Figma',
+              icon: 'i',
+              credentialFields: [],
+              refLabel: '',
+              refPlaceholder: '',
+              oauth: { scopes: ['file_content:read'] },
+            },
+            {
+              source: 'notion',
+              label: 'Notion',
+              icon: 'i',
+              credentialFields: [],
+              refLabel: '',
+              refPlaceholder: '',
+            },
+          ],
+          oauthSources,
+        }),
+      listDocumentConnections: () =>
+        Promise.resolve({ connections: [{ source: 'figma', label: 'Figma', connectedAt: 1 }] }),
+    })
+  }
+
+  it('offers OAuth where the deployment has a registered app', async () => {
+    stubSources(['figma'])
+    const store = useDocumentsStore()
+    await store.probe()
+    expect(store.canConnectWithOAuth('figma')).toBe(true)
+  })
+
+  it('withholds it where the SOURCE declares an OAuth half but the deployment registered nothing', async () => {
+    // Figma declares the half in both cases; only the registered app decides whether the button
+    // is offered. Folded onto the descriptor, this case would render a "Connect with Figma" that
+    // can only 503.
+    stubSources([])
+    const store = useDocumentsStore()
+    await store.probe()
+    expect(store.descriptorFor('figma')?.oauth).toBeDefined()
+    expect(store.canConnectWithOAuth('figma')).toBe(false)
+  })
+
+  it('lists only CONNECTED design sources, so no affordance opens onto a dead end', async () => {
+    stubSources(['figma'])
+    const store = useDocumentsStore()
+    await store.probe()
+    // Notion is connectable and not a design source; Figma is both connected and a design one.
+    // The classification comes from contracts, so adding a source cannot leave it unclassified.
+    expect(store.connectedDesignSources).toEqual(['figma'])
+  })
+})

package/app/stores/documents.ts

@@ -14,6 +14,7 @@ import type {
 } from '~/types/domain'
 import { isConnectableSource } from '@cat-factory/contracts'
 import { useDocumentFreshness } from '~/composables/useDocumentFreshness'
+import { useDocumentSourceConnect } from '~/composables/useDocumentSourceConnect'
 import { useSourceIntegration } from '~/composables/useSourceIntegration'
 import { useUpsertList } from '~/composables/useUpsertList'
 import { useWorkspaceStore } from '~/stores/workspace'
@@ -32,6 +33,10 @@ export const useDocumentsStore = defineStore('documents', () => {
   const api = useApi()
   const workspace = useWorkspaceStore()
 
+  // What this DEPLOYMENT can OAuth, reported beside the descriptors and read through
+  // `useDocumentSourceConnect`, which owns why that is a separate fact from the descriptor's own.
+  const oauthSources = ref<DocumentSourceKind[]>([])
+
   // Shared opt-in / probe / connections lifecycle (see `useSourceIntegration`).
   const integration = useSourceIntegration<
     DocumentSourceKind,
@@ -41,16 +46,32 @@ export const useDocumentsStore = defineStore('documents', () => {
     enabled: () => !!workspace.workspaceId,
     workspaceId: () => workspace.workspaceId,
     fetch: async () => {
-      const [{ sources }, { connections }] = await Promise.all([
+      const [{ sources, oauthSources: oauth }, { connections }] = await Promise.all([
         api.listDocumentSources(workspace.requireId()),
         api.listDocumentConnections(workspace.requireId()),
       ])
+      oauthSources.value = oauth
       return { sources, connections }
     },
   })
   const { available, sources, connections, connectedSources, anyConnected } = integration
   const { descriptorFor, connectionFor, isConnected, probe, ensureProbed } = integration
 
+  // Connecting a source, and what this board may connect it WITH, in its own collaborator: the
+  // question grew several parts when OAuth landed, and none of the store's other concerns (the
+  // imported documents, their freshness, the doc-kind role links) read any of them.
+  const { canConnectWithOAuth, connectedDesignSources, connect, disconnect, beginOAuthConnect } =
+    useDocumentSourceConnect({
+      workspaceId: () => workspace.requireId(),
+      oauthSources,
+      connectedSources,
+      onConnected: (conn) => {
+        integration.upsertConnection(conn)
+        available.value = true
+      },
+      onDisconnected: (source) => integration.removeConnection(source),
+    })
+
   const { items: documents, upsert: upsertDoc } = useUpsertList<SourceDocument>({
     key: (d) => `${d.source}:${d.externalId}`,
     prepend: true,
@@ -76,19 +97,6 @@ export const useDocumentsStore = defineStore('documents', () => {
     return documents.value.filter((d) => d.linkedBlockId === blockId)
   }
 
-  /** Connect the workspace to a source with its credential bag. */
-  async function connect(source: DocumentSourceKind, credentials: Record<string, string>) {
-    const conn = await api.connectDocumentSource(workspace.requireId(), source, credentials)
-    integration.upsertConnection(conn)
-    available.value = true
-  }
-
-  /** Disconnect the workspace from a source. */
-  async function disconnect(source: DocumentSourceKind) {
-    await api.disconnectDocumentSource(workspace.requireId(), source)
-    integration.removeConnection(source)
-  }
-
   /** Load the imported documents for the workspace (across sources). */
   async function loadDocuments() {
     documents.value = await api.listDocuments(workspace.requireId())
@@ -125,20 +133,36 @@ export const useDocumentsStore = defineStore('documents', () => {
     return results
   }
 
-  /** Preview the board structure a page would expand into (no writes). */
-  function plan(source: DocumentSourceKind, externalId: string): Promise<DocumentBoardPlan> {
-    return api.planDocument(workspace.requireId(), source, externalId)
+  /**
+   * Preview the board structure a page would expand into (no writes).
+   *
+   * With `frameId` the preview is TARGET-AWARE: the planner is told which service the work goes
+   * inside and proposes its modules and tasks instead of an architecture.
+   */
+  function plan(
+    source: DocumentSourceKind,
+    externalId: string,
+    frameId?: string,
+  ): Promise<DocumentBoardPlan> {
+    return api.planDocument(workspace.requireId(), source, {
+      externalId,
+      ...(frameId ? { frameId } : {}),
+    })
   }
 
   /**
-   * Apply a page's structure to the board as new top-level frames, then refresh the
-   * board snapshot. The endpoint also accepts a `frameId` that flattens the planned
-   * frames into an existing service; the SPA deliberately never sends one, because the
-   * planner is target-blind and that path discards the frame titles/types the preview
-   * shows. Scoping a spawn to a service needs a target-aware plan first.
+   * Apply a page's structure to the board, then refresh the board snapshot.
+   *
+   * `frameId` must be the SAME frame the preview was planned for. The endpoint re-plans against
+   * it, so a targeted preview and its write agree; sending a frame the preview did not use would
+   * flatten a board-wide plan into it and discard the frame titles and types the user approved,
+   * which is why this was board-level only until target-aware planning existed.
    */
-  async function spawn(source: DocumentSourceKind, externalId: string) {
-    const { result } = await api.spawnDocument(workspace.requireId(), source, { externalId })
+  async function spawn(source: DocumentSourceKind, externalId: string, frameId?: string) {
+    const { result } = await api.spawnDocument(workspace.requireId(), source, {
+      externalId,
+      ...(frameId ? { frameId } : {}),
+    })
     await workspace.refresh()
     return result
   }
@@ -218,6 +242,10 @@ export const useDocumentsStore = defineStore('documents', () => {
   return {
     available,
     sources,
+    oauthSources,
+    canConnectWithOAuth,
+    connectedDesignSources,
+    beginOAuthConnect,
     connections,
     documents,
     loading,

package/app/stores/ui/modals.ts

@@ -192,6 +192,11 @@ function createDocumentTaskModals(resetHubReturn: ResetHubReturn) {
   // opened standalone, and the modal offers every container on the board.
   const bugHunt = ref<{ source: TaskSourceKind | null; containerId: string | null } | null>(null)
 
+  // Start-from-design: paste a design link, and the resolved reference is staged onto a new task
+  // in `frameId`. `frameId` is always present — the affordance lives on a frame header, and the
+  // flow ends in the add-task form, which needs a container to create in.
+  const startFromDesign = ref<{ frameId: string } | null>(null)
+
   // Add-task modal: the container (service frame or module) a new task is being
   // added to, or null when closed. The user types the title + description; nothing
   // is launched until they explicitly start the created task.
@@ -266,6 +271,13 @@ function createDocumentTaskModals(resetHubReturn: ResetHubReturn) {
   function closeBugHunt() {
     bugHunt.value = null
   }
+  function openStartFromDesign(frameId: string) {
+    resetHubReturn()
+    startFromDesign.value = { frameId }
+  }
+  function closeStartFromDesign() {
+    startFromDesign.value = null
+  }
   function openAddTask(containerId: string, prefill: AddTaskPrefill | null = null) {
     addTaskPrefill.value = prefill
     addTaskContainerId.value = containerId
@@ -301,6 +313,7 @@ function createDocumentTaskModals(resetHubReturn: ResetHubReturn) {
     taskConnect,
     taskImport,
     bugHunt,
+    startFromDesign,
     addTaskContainerId,
     addTaskPrefill,
     reviewFrictionContext,
@@ -320,6 +333,8 @@ function createDocumentTaskModals(resetHubReturn: ResetHubReturn) {
     closeTaskImport,
     openBugHunt,
     closeBugHunt,
+    openStartFromDesign,
+    closeStartFromDesign,
     openAddTask,
     closeAddTask,
     openReviewFriction,

package/i18n/locales/de.json

@@ -2198,6 +2198,18 @@
         "keysValidation": "Geben Sie die S3-Access Key ID und das Secret ein",
         "saved": "Inhaltsspeicher gespeichert",
         "saveFailed": "Inhaltsspeicher konnte nicht gespeichert werden"
+      },
+      "figma": {
+        "title": "Figma-App (OAuth)",
+        "description": "Aktiviert den Ablauf „Mit Figma verbinden“. Ohne ihn können Workspaces Figma weiterhin mit einem persönlichen Zugriffstoken verbinden.",
+        "clientId": "Client-ID",
+        "clientSecret": "Client-Secret",
+        "redirectUrl": "Redirect-URL",
+        "validation": "Client-ID, Secret und Redirect-URL eingeben",
+        "saved": "Figma-OAuth gespeichert",
+        "saveFailed": "Figma-OAuth konnte nicht gespeichert werden",
+        "cleared": "Figma-OAuth gelöscht",
+        "clearFailed": "Figma-OAuth konnte nicht gelöscht werden"
       }
     },
     "accountFragments": {
@@ -3003,7 +3015,8 @@
       "accessDenied": {
         "title": "Zugriff verweigert",
         "hint": "Sie haben keinen Zugriff auf das Repository, das diesem Service zugrunde liegt."
-      }
+      },
+      "startFromDesignTitle": "Mit einem Design starten"
     },
     "decisionBadge": {
       "decisionNeeded": "Entscheidung erforderlich",
@@ -3075,7 +3088,11 @@
     "attachIssueDisabledConnect": "Verbinden Sie zuerst einen Issue-Tracker (Integrationen)",
     "attachIssueDisabledEnable": "Aktivieren Sie zuerst die Issue-Tracker-Integration",
     "importsOnAdd": "importiert beim Hinzufügen",
-    "unreadable": "Konnte nicht abgerufen werden: {error}"
+    "unreadable": "Konnte nicht abgerufen werden: {error}",
+    "pastedLink": {
+      "offer": "Diese Beschreibung verlinkt eine {source}-Seite. Als Kontext anhängen?",
+      "attach": "Anhängen"
+    }
   },
   "providers": {
     "presetMismatch": {
@@ -3921,13 +3938,19 @@
     "connect": {
       "title": "Quelle verbinden",
       "sourceFallback": "Quelle",
-      "intro": "Verbinden Sie {source}, um Anforderungen, RFCs und PRDs zu importieren, und erzeugen Sie dann Board-Struktur oder hängen Sie sie als Agent-Kontext an Aufgaben an.",
+      "intro": "Verbinde {source}, um Seiten und Designs auf dieses Board zu holen: importieren, in Board-Struktur ausklappen oder als Agent-Kontext an eine Aufgabe hängen.",
       "disconnect": "Trennen",
       "connect": "Verbinden",
       "update": "Verbindung aktualisieren",
       "connected": "{source} verbunden",
       "disconnected": "{source} getrennt",
-      "connectFailed": "Verbindung nicht möglich"
+      "connectFailed": "Verbindung nicht möglich",
+      "oauth": {
+        "action": "Mit {source} verbinden",
+        "scopes": "Du wirst um folgende Berechtigungen gebeten: {scopes}",
+        "fallback": "Lieber ein Token? Nutze stattdessen die Felder unten.",
+        "failed": "Die Anmeldung bei {source} konnte nicht gestartet werden"
+      }
     },
     "spawn": {
       "title": "Struktur-Vorschau",
@@ -3942,7 +3965,15 @@
       "summary": "{frames} · {modules} · {tasks}",
       "frameCount": "{count} Frame | {count} Frames",
       "moduleCount": "{count} Modul | {count} Module",
-      "taskCount": "{count} Aufgabe | {count} Aufgaben"
+      "taskCount": "{count} Aufgabe | {count} Aufgaben",
+      "reusedCount": "{count} Modul wiederverwendet | {count} Module wiederverwendet",
+      "intoService": "innerhalb des gewählten Service",
+      "target": {
+        "label": "Zu Service hinzufügen",
+        "help": "Ein Design beschreibt Screens, keine Architektur. Der Plan schlägt deshalb Arbeit innerhalb eines bereits vorhandenen Service vor.",
+        "placeholder": "Service wählen",
+        "required": "Wähle den Service, zu dem dieses Design gehört."
+      }
     },
     "taskDocs": {
       "heading": "Kontextdokumente",
@@ -3975,6 +4006,20 @@
       "remove": "Entfernen",
       "linkFailed": "Die Dokumentverknüpfung konnte nicht aktualisiert werden",
       "loadFailed": "Dokumentvorlagen konnten nicht geladen werden"
+    },
+    "startFromDesign": {
+      "title": "Mit einem Design starten",
+      "intro": "Füge den Link zu einem Frame oder einer ganzen Datei ein. Er wird an die neue Aufgabe gehängt, und der Agent liest Layout, Texte, Komponenten und Tokens.",
+      "noSource": "Noch keine Design-Quelle verbunden. Ein Admin kann Figma oder Zeplin unter Integrationen verbinden.",
+      "linkLabel": "Design-Link",
+      "linkPlaceholder": "https://www.figma.com/design/…?node-id=1-2",
+      "checking": "Link wird geprüft…",
+      "trimmed": "Auf die unterstützte Form dieses Links gekürzt.",
+      "widened": "Der Frame {scope} konnte nicht gelesen werden, daher wird die gesamte Datei angehängt.",
+      "unchecked": "Der Link konnte gerade nicht geprüft werden. Er wird beim Anlegen der Aufgabe abgerufen.",
+      "uncheckedAmbiguous": "Der Link konnte nicht geprüft werden, und es ist mehr als eine Design-Quelle verbunden. Zu welcher er gehört, ist damit unbekannt. Bitte erneut versuchen.",
+      "rejected": "Keine verbundene Design-Quelle erkennt diesen Link.",
+      "continue": "Weiter"
     }
   },
   "tasks": {
@@ -6969,7 +7014,8 @@
       "library": "Eine in diesem Deployment aktivierte Kontextfragment-Bibliothek",
       "failedRun": "Ein fehlgeschlagener Lauf",
       "infrastructure": "Ein mit diesem Workspace verbundenes Ausführungs-Backend",
-      "advancedTier": "Der erweiterte Oberflächenmodus"
+      "advancedTier": "Der erweiterte Oberflächenmodus",
+      "designSource": "Eine verbundene Design-Quelle"
     },
     "overlay": {
       "next": "Weiter",
@@ -7349,6 +7395,36 @@
             "body": "Ein Entwurf, der angibt, welche davon er nutzt, bekommt im nächsten Schritt ihre vollen Kontrakte. Einer, der nichts angibt, bekommt nichts: dass das hier aktuell bleibt, ist also die Bedingung dafür, dass es funktioniert."
           }
         }
+      },
+      "startFromDesign": {
+        "title": "Mit einem Design starten",
+        "description": "Mach aus einem Design-Frame eine Aufgabe, die ein Agent bauen kann.",
+        "steps": {
+          "intro": {
+            "title": "Vom Design aus arbeiten",
+            "body": "Wenn die Arbeit im Design-Tool beginnt, ist der Frame das Briefing. Diese Tour hängt einen an eine neue Aufgabe."
+          },
+          "open": {
+            "title": "Mit einem Design starten",
+            "body": "Jeder Service-Frame hat diese Schaltfläche, sobald eine Design-Quelle verbunden ist."
+          },
+          "paste": {
+            "title": "Link einfügen",
+            "body": "Kopiere im Design-Tool den Link zu einem Frame oder einer ganzen Datei und füge ihn hier ein."
+          },
+          "resolved": {
+            "title": "Prüfen, was angehängt wurde",
+            "body": "Der Link wird auf seine unterstützte Form gekürzt. Konnte der Frame selbst nicht gelesen werden, wird stattdessen die ganze Datei angehängt, und genau das steht hier."
+          },
+          "continue": {
+            "title": "Weiter zur Aufgabe",
+            "body": "Das Design liegt an der neuen Aufgabe bereit. Beschreibe das gewünschte Ergebnis und lege sie an."
+          },
+          "finish": {
+            "title": "Bereit für den Lauf",
+            "body": "Der Agent liest Layout, Texte, Komponenten und Tokens des Designs, und jeder Lauf gleicht es erneut mit der Quelle ab."
+          }
+        }
       }
     },
     "nudge": {

package/i18n/locales/en.json

@@ -481,7 +481,8 @@
       "accessDenied": {
         "title": "Permission denied",
         "hint": "You don't have access to the repository backing this service."
-      }
+      },
+      "startFromDesignTitle": "Start from a design"
     },
     "decisionBadge": {
       "decisionNeeded": "Decision needed",
@@ -556,7 +557,11 @@
     "attachIssueDisabledConnect": "Connect an issue tracker first (Integrations)",
     "attachIssueDisabledEnable": "Enable the issue-tracker integration first",
     "importsOnAdd": "imports on add",
-    "unreadable": "Could not be fetched: {error}"
+    "unreadable": "Could not be fetched: {error}",
+    "pastedLink": {
+      "offer": "This description links a {source} page. Attach it as context?",
+      "attach": "Attach"
+    }
   },
   "errors": {
     "generic": {
@@ -2138,6 +2143,18 @@
         "keysValidation": "Enter the S3 access key id and secret",
         "saved": "Content storage saved",
         "saveFailed": "Could not save content storage"
+      },
+      "figma": {
+        "title": "Figma app (OAuth)",
+        "description": "Enables the \"Connect with Figma\" flow. Without it, workspaces can still connect Figma by pasting a personal access token.",
+        "clientId": "Client ID",
+        "clientSecret": "Client secret",
+        "redirectUrl": "Redirect URL",
+        "validation": "Enter the client id, secret and redirect URL",
+        "saved": "Figma OAuth saved",
+        "saveFailed": "Could not save Figma OAuth",
+        "cleared": "Figma OAuth cleared",
+        "clearFailed": "Could not clear Figma OAuth"
       }
     },
     "accountFragments": {
@@ -4443,13 +4460,19 @@
     "connect": {
       "title": "Connect source",
       "sourceFallback": "Source",
-      "intro": "Connect {source} to import requirements, RFCs and PRDs, then spawn board structure or attach them to tasks as agent context.",
+      "intro": "Connect {source} to bring its pages and designs onto this board: import one, expand it into board structure, or attach it to a task as agent context.",
       "disconnect": "Disconnect",
       "connect": "Connect",
       "update": "Update connection",
       "connected": "{source} connected",
       "disconnected": "{source} disconnected",
-      "connectFailed": "Could not connect"
+      "connectFailed": "Could not connect",
+      "oauth": {
+        "action": "Connect with {source}",
+        "scopes": "You will be asked to grant: {scopes}",
+        "fallback": "Prefer a token? Use the fields below instead.",
+        "failed": "Could not start the {source} sign-in"
+      }
     },
     "spawn": {
       "title": "Preview structure",
@@ -4464,7 +4487,15 @@
       "summary": "{frames} · {modules} · {tasks}",
       "frameCount": "{count} frame | {count} frames",
       "moduleCount": "{count} module | {count} modules",
-      "taskCount": "{count} task | {count} tasks"
+      "taskCount": "{count} task | {count} tasks",
+      "reusedCount": "{count} module reused | {count} modules reused",
+      "intoService": "inside the selected service",
+      "target": {
+        "label": "Add to service",
+        "help": "A design describes screens, not an architecture, so the plan proposes work inside a service that already exists.",
+        "placeholder": "Pick a service",
+        "required": "Pick the service this design belongs to."
+      }
     },
     "taskDocs": {
       "heading": "Context documents",
@@ -4497,6 +4528,20 @@
       "remove": "Remove",
       "linkFailed": "Couldn't update the document link",
       "loadFailed": "Couldn't load document templates"
+    },
+    "startFromDesign": {
+      "title": "Start from a design",
+      "intro": "Paste a link to a frame or a whole file. It is attached to the new task, and the agent reads its layout, text, components and tokens.",
+      "noSource": "No design source is connected yet. An admin can connect Figma or Zeplin from Integrations.",
+      "linkLabel": "Design link",
+      "linkPlaceholder": "https://www.figma.com/design/…?node-id=1-2",
+      "checking": "Checking the link…",
+      "trimmed": "Trimmed to the supported form of this link.",
+      "widened": "The frame {scope} could not be read, so the whole file is attached instead.",
+      "unchecked": "The link could not be checked right now. It is fetched when the task is created.",
+      "uncheckedAmbiguous": "The link could not be checked, and more than one design source is connected, so which one it belongs to is unknown. Try again.",
+      "rejected": "No connected design source recognises this link.",
+      "continue": "Continue"
     }
   },
   "tasks": {
@@ -7215,7 +7260,8 @@
       "library": "The context fragment library enabled on this deployment",
       "failedRun": "A run that failed",
       "infrastructure": "An execution backend connected to this workspace",
-      "advancedTier": "The advanced interface mode"
+      "advancedTier": "The advanced interface mode",
+      "designSource": "A connected design source"
     },
     "overlay": {
       "next": "Next",
@@ -7604,6 +7650,36 @@
             "body": "A design that declares which of these it uses gets their full contracts in the next step. One that declares nothing gets nothing, so keeping this current is what makes it work."
           }
         }
+      },
+      "startFromDesign": {
+        "title": "Start from a design",
+        "description": "Turn a design frame into a task an agent can build.",
+        "steps": {
+          "intro": {
+            "title": "Work from the design",
+            "body": "When the work starts in a design tool, the frame is the brief. This tour attaches one to a new task."
+          },
+          "open": {
+            "title": "Start from a design",
+            "body": "Every service frame carries this button once a design source is connected."
+          },
+          "paste": {
+            "title": "Paste the link",
+            "body": "Copy the link to a frame or a whole file from your design tool and paste it here."
+          },
+          "resolved": {
+            "title": "Check what was attached",
+            "body": "The link is trimmed to its supported form. If the frame itself could not be read, the whole file is attached instead and it says so here."
+          },
+          "continue": {
+            "title": "Carry on to the task",
+            "body": "The design is staged on the new task. Describe the outcome you want and create it."
+          },
+          "finish": {
+            "title": "Ready to run",
+            "body": "The agent reads the design's layout, text, components and tokens, and every run re-checks it against the source."
+          }
+        }
       }
     },
     "nudge": {