@cat-factory/app 0.259.3 → 0.261.0

package/app/components/settings/McpAuthorizeScreen.vue

@@ -0,0 +1,262 @@
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import {
+  MCP_AUTHORIZATION_REQUEST_INVALID,
+  PUBLIC_API_SCOPES,
+  type PublicApiScope,
+} from '@cat-factory/contracts'
+import { apiErrorEnvelope, apiErrorReason } from '~/composables/api/errors'
+
+// The consent screen an MCP host's authorization request lands on
+// (`/mcp-authorize?request=…`), reached by a redirect from `GET /oauth/authorize`.
+//
+// A page in the APP rather than a screen the backend renders, and that is the security shape of
+// this flow: the authorization endpoint is a top-level navigation a third party triggers, carrying
+// no bearer token, so a screen served there could never say WHO is approving. Here the session is
+// the app's own, and the two calls this page makes are ordinary gated API where the board choice
+// and its `secrets.manage` check actually run.
+//
+// Not a public route: an expired session renders the login screen on this same URL, and once the
+// person signs in the query string is still here and the flow continues (`postSignInUrl`, which
+// LoginScreen reloads to, exists to keep it). That is correct rather than a gap, and it is also how
+// an SSO deployment gets its identity provider into a flow that otherwise has no idea who anyone
+// is.
+
+const api = useApi()
+const { t } = useI18n()
+
+type Screen = 'loading' | 'deciding' | 'submitting' | 'failed'
+
+const screen = ref<Screen>('loading')
+const detail = ref<string | null>(null)
+/**
+ * A refusal that did NOT consume the request, shown beside the choices rather than instead of
+ * them. See `decide`: the two failures are answered differently because only one of them ends the
+ * flow.
+ */
+const decisionError = ref<string | null>(null)
+const clientName = ref('')
+const redirectOrigin = ref('')
+const workspaces = ref<{ label: string; value: string }[]>([])
+const workspaceId = ref<string | undefined>(undefined)
+/**
+ * Starts at the FLOOR of the ladder and is replaced by the server's `defaultScope` once the request
+ * resolves. The screen never preselects from the host's own ask: an unauthenticated registration
+ * can name any scope, so the server clamps it (`consentDefaultScope`) and this page renders what it
+ * was given. Least privilege before that answer arrives, in case a render ever beats it.
+ */
+const scope = ref<PublicApiScope>('read')
+/** What the host asked for, when the server preselected something else. Shown, never applied. */
+const requestedScope = ref<PublicApiScope | null>(null)
+
+const sealedRequest = computed(() =>
+  typeof window === 'undefined'
+    ? ''
+    : (new URLSearchParams(window.location.search).get('request') ?? ''),
+)
+
+/**
+ * The ladder, as choices. Every rung is offered rather than a curated subset: the rungs are what
+ * the surface itself enforces, and hiding one would leave a host that genuinely needs it unable to
+ * be granted it from the screen built for granting.
+ */
+const scopeItems = computed(() =>
+  PUBLIC_API_SCOPES.map((value) => ({
+    value,
+    label: t(`mcpAuthorize.scope.${value}.label`),
+    description: t(`mcpAuthorize.scope.${value}.description`),
+  })),
+)
+
+onMounted(async () => {
+  if (!sealedRequest.value) {
+    screen.value = 'failed'
+    detail.value = t('mcpAuthorize.error.noRequest')
+    return
+  }
+  try {
+    const [request, boards] = await Promise.all([
+      api.describeMcpAuthorization(sealedRequest.value),
+      api.listWorkspaces(),
+    ])
+    clientName.value = request.clientName
+    redirectOrigin.value = request.redirectOrigin
+    scope.value = request.defaultScope
+    // Only worth saying when the two differ: identical values would be a line telling a person
+    // that the thing in front of them is the thing in front of them.
+    requestedScope.value =
+      request.requestedScope && request.requestedScope !== request.defaultScope
+        ? request.requestedScope
+        : null
+    workspaces.value = boards.map((board) => ({ label: board.name, value: board.id }))
+    workspaceId.value = workspaces.value[0]?.value
+    screen.value = 'deciding'
+  } catch (e) {
+    // Terminal whatever the cause: with no request to describe there is nothing to decide, and the
+    // person is told to start again from the host, which is the only place a new one comes from.
+    screen.value = 'failed'
+    detail.value = apiErrorEnvelope(e)?.message ?? t('mcpAuthorize.error.expired')
+  }
+})
+
+async function decide(decision: 'approve' | 'deny') {
+  if (decision === 'approve' && !workspaceId.value) return
+  screen.value = 'submitting'
+  decisionError.value = null
+  try {
+    const result = await api.decideMcpAuthorization(
+      decision === 'approve'
+        ? {
+            decision,
+            request: sealedRequest.value,
+            workspaceId: workspaceId.value as string,
+            scope: scope.value,
+          }
+        : { decision, request: sealedRequest.value },
+    )
+    // A full navigation, never a router push: the destination is the HOST's own callback, which is
+    // waiting for a browser to arrive at it with the code on the query string.
+    if (typeof window !== 'undefined') window.location.assign(result.redirectTo)
+  } catch (e) {
+    // Two outcomes, because two things can be wrong and only one of them ends the flow. The sealed
+    // request gone is TERMINAL: nothing on this page can mint another, so it says so and offers the
+    // way out. Anything else (this board is one the person cannot mint a key on, it disappeared,
+    // the deployment hiccuped) leaves the request valid and this screen the only place the decision
+    // can be made, so dropping to a dead end over it would strand a person who has a board they
+    // COULD have picked one dropdown away.
+    if (apiErrorReason(e) === MCP_AUTHORIZATION_REQUEST_INVALID) {
+      screen.value = 'failed'
+      detail.value = apiErrorEnvelope(e)?.message ?? t('mcpAuthorize.error.expired')
+      return
+    }
+    screen.value = 'deciding'
+    decisionError.value = apiErrorEnvelope(e)?.message ?? t('mcpAuthorize.error.failed')
+  }
+}
+
+function backToApp() {
+  if (typeof window !== 'undefined') window.location.assign('/')
+}
+</script>
+
+<template>
+  <div
+    class="flex min-h-screen w-screen items-center justify-center bg-slate-950 p-4 text-slate-100"
+    data-testid="mcp-authorize"
+  >
+    <div
+      class="w-full max-w-md rounded-xl border border-slate-800 bg-slate-900/80 p-8 backdrop-blur"
+    >
+      <template v-if="screen === 'loading'">
+        <UIcon name="i-lucide-loader" class="mx-auto h-10 w-10 animate-spin text-indigo-400" />
+      </template>
+
+      <template v-else-if="screen === 'failed'">
+        <UIcon name="i-lucide-alert-triangle" class="mx-auto mb-3 h-10 w-10 text-red-400" />
+        <h1
+          class="mb-1 text-center text-lg font-semibold text-white"
+          data-testid="mcp-authorize-failed"
+        >
+          {{ t('mcpAuthorize.error.title') }}
+        </h1>
+        <p class="mb-6 text-center text-sm break-words text-slate-400">{{ detail }}</p>
+        <UButton block color="neutral" variant="subtle" @click="backToApp">
+          {{ t('mcpAuthorize.back') }}
+        </UButton>
+      </template>
+
+      <template v-else>
+        <UIcon name="i-lucide-plug-zap" class="mx-auto mb-3 h-10 w-10 text-indigo-400" />
+        <h1 class="mb-1 text-center text-lg font-semibold text-white">
+          {{ t('mcpAuthorize.title', { client: clientName }) }}
+        </h1>
+        <!-- The origin is the one fact here an attacker cannot choose: it was matched against what
+             the client registered before this screen was ever reached. The name beside it is a
+             stranger's own words, so the copy presents it as a claim rather than as identity.
+             The copy reads "It says it is {client}, and …" in every locale, so BOTH holes have to
+             be filled: an unpassed `client` renders a sentence naming nobody, on the one screen
+             whose whole subject is who is asking. -->
+        <p class="mb-6 text-center text-sm text-slate-400">
+          {{ t('mcpAuthorize.subtitle', { client: clientName, origin: redirectOrigin }) }}
+        </p>
+
+        <div v-if="!workspaces.length" class="mb-6 text-center text-sm text-amber-300">
+          {{ t('mcpAuthorize.noWorkspaces') }}
+        </div>
+
+        <template v-else>
+          <UFormField :label="t('mcpAuthorize.workspace.label')" class="mb-4">
+            <USelect
+              v-model="workspaceId"
+              :items="workspaces"
+              value-key="value"
+              class="w-full"
+              data-testid="mcp-authorize-workspace"
+            />
+          </UFormField>
+
+          <UFormField
+            :label="t('mcpAuthorize.scopeLabel')"
+            :description="t('mcpAuthorize.scopeHint')"
+            :class="requestedScope ? 'mb-2' : 'mb-6'"
+          >
+            <URadioGroup
+              v-model="scope"
+              :items="scopeItems"
+              value-key="value"
+              data-testid="mcp-authorize-scope"
+            />
+          </UFormField>
+
+          <!-- Only when the host asked for something other than what is preselected. Anyone can
+               register a client and ask for `admin`, so the ask is reported as a fact ABOUT the
+               host rather than acted on: raising the grant stays a thing a person does. -->
+          <p
+            v-if="requestedScope"
+            class="mb-6 text-xs text-amber-300"
+            data-testid="mcp-authorize-requested-scope"
+          >
+            {{
+              t('mcpAuthorize.requestedScope', {
+                client: clientName,
+                scope: t(`mcpAuthorize.scope.${requestedScope}.label`),
+              })
+            }}
+          </p>
+        </template>
+
+        <p
+          v-if="decisionError"
+          class="mb-4 text-center text-sm break-words text-red-400"
+          data-testid="mcp-authorize-decision-error"
+        >
+          {{ decisionError }}
+        </p>
+
+        <div class="flex gap-2">
+          <UButton
+            block
+            color="neutral"
+            variant="subtle"
+            :disabled="screen === 'submitting'"
+            @click="decide('deny')"
+          >
+            {{ t('mcpAuthorize.deny') }}
+          </UButton>
+          <UButton
+            block
+            color="primary"
+            :loading="screen === 'submitting'"
+            :disabled="!workspaceId"
+            data-testid="mcp-authorize-approve"
+            @click="decide('approve')"
+          >
+            {{ t('mcpAuthorize.approve') }}
+          </UButton>
+        </div>
+
+        <p class="mt-4 text-center text-xs text-slate-500">{{ t('mcpAuthorize.revokeHint') }}</p>
+      </template>
+    </div>
+  </div>
+</template>

package/app/composables/api/mcpAuthorization.ts

@@ -0,0 +1,30 @@
+import {
+  decideMcpAuthorizationContract,
+  describeMcpAuthorizationContract,
+  type McpAuthorizationDecision,
+} from '@cat-factory/contracts'
+import type { ApiContext } from './context'
+
+/**
+ * The consent screen an MCP host's authorization request lands on.
+ *
+ * The mirror image of the tool-server OAuth calls beside it: those connect THIS deployment to
+ * someone else's MCP server, these let someone else's host connect to this one. Neither is
+ * workspace-prefixed, and for opposite reasons: there the board is sealed into the vendor's state,
+ * here it is what the person on the screen is choosing.
+ *
+ * Both are POSTs, the read included. The sealed request is a value the page carries rather than an
+ * id it looks up, and a query string would write it into browser history and every log in between.
+ */
+export function mcpAuthorizationApi({ send }: ApiContext) {
+  return {
+    describeMcpAuthorization: (request: string) =>
+      send(describeMcpAuthorizationContract, { body: { request } }),
+
+    // Answers with WHERE to send the browser, rather than redirecting: a 302 on a `fetch` is
+    // followed by the browser without this page seeing it, which would deliver the host's callback
+    // an XHR instead of the navigation it is waiting for.
+    decideMcpAuthorization: (body: McpAuthorizationDecision) =>
+      send(decideMcpAuthorizationContract, { body }),
+  }
+}

package/app/composables/useApi.ts

@@ -35,6 +35,7 @@ import { modelsApi } from './api/models'
 import { notificationsApi } from './api/notifications'
 import { packageRegistriesApi } from './api/packageRegistries'
 import { capabilityCredentialsApi } from './api/capabilityCredentials'
+import { mcpAuthorizationApi } from './api/mcpAuthorization'
 import { toolServersApi } from './api/toolServers'
 import { preflightsApi } from './api/preflights'
 import { presetsApi } from './api/presets'
@@ -161,6 +162,7 @@ export function useApi() {
     ...testSecretsApi(ctx),
     ...packageRegistriesApi(ctx),
     ...capabilityCredentialsApi(ctx),
+    ...mcpAuthorizationApi(ctx),
     ...toolServersApi(ctx),
     ...previewApi(ctx),
     ...environmentsApi(ctx),

package/app/composables/useBoardActivity.ts

@@ -0,0 +1,111 @@
+import { inject, onBeforeUnmount, onMounted, provide, type InjectionKey, type Ref } from 'vue'
+
+/**
+ * The board's shared "something may have moved" pulse.
+ *
+ * The two DOM-measuring drivers on the canvas (dependency edges, task expansion) cannot ask
+ * the DOM "did anything change since last frame" without doing the measurement that IS the
+ * cost, so each used to measure unconditionally every frame. This publishes the signals that
+ * can START a visible change instead; the drivers pair it with `useSettlingRaf`, which
+ * carries each wake through the animation that follows and parks once the output holds still.
+ *
+ * The signals are deliberately coarse. A pulse that fires when nothing moved costs a handful
+ * of frames; one that fails to fire leaves a stale arrow on screen, so this errs toward
+ * firing:
+ *
+ *  - a `MutationObserver` over the canvas subtree, watching structure plus `style` / `class`.
+ *    That is every Vue-driven render change on the board, Vue Flow's own pan/zoom transform
+ *    included. Attribute changes the drivers themselves write (`x1`/`y1` on the edge overlay)
+ *    are outside the filter, so a driver cannot pulse itself awake forever.
+ *  - a `ResizeObserver` on the canvas, plus window `resize`: layout changes with no mutation.
+ *  - pointer, wheel and scroll gestures on the canvas: the user moving something.
+ *
+ * What it does NOT catch is a reflow with no mutation and no gesture, such as a late-loading
+ * image or font resizing a card. Those settle on the next pulse of any kind.
+ */
+export type BoardActivity = {
+  /** Subscribe to the pulse. Returns the unsubscribe. */
+  subscribe: (onPulse: () => void) => () => void
+  /** Fire the pulse from a signal the observers above cannot see. */
+  pulse: () => void
+}
+
+const boardActivityKey: InjectionKey<BoardActivity> = Symbol('boardActivity')
+
+/**
+ * Installs the signal sources on the board canvas element and provides the pulse to the
+ * canvas's descendants. Returns it too, because a component cannot inject what it provides.
+ */
+export function provideBoardActivity(container: Ref<HTMLElement | null>): BoardActivity {
+  const subscribers = new Set<() => void>()
+  const pulse = () => {
+    for (const onPulse of subscribers) onPulse()
+  }
+
+  const activity: BoardActivity = {
+    subscribe(onPulse) {
+      subscribers.add(onPulse)
+      return () => subscribers.delete(onPulse)
+    },
+    pulse,
+  }
+  provide(boardActivityKey, activity)
+
+  const mutations = new MutationObserver(pulse)
+  const resizes = new ResizeObserver(pulse)
+  // `scroll` does not bubble, so it is caught in the capture phase; the gestures are
+  // passive listeners because the pulse never wants to cancel one.
+  const gestures = [
+    'pointerdown',
+    'pointermove',
+    'pointerup',
+    'pointerleave',
+    'wheel',
+    'scroll',
+  ] as const
+  const gestureOptions = { capture: true, passive: true }
+
+  onMounted(() => {
+    // The canvas binds this ref to its own root, so by mount it is always set; the narrowing is
+    // for the nullable template-ref type rather than a case that happens.
+    const el = container.value
+    if (!el) return
+    mutations.observe(el, {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      attributeFilter: ['style', 'class'],
+    })
+    resizes.observe(el)
+    for (const type of gestures) el.addEventListener(type, pulse, gestureOptions)
+    window.addEventListener('resize', pulse)
+  })
+
+  onBeforeUnmount(() => {
+    mutations.disconnect()
+    resizes.disconnect()
+    const el = container.value
+    for (const type of gestures) el?.removeEventListener(type, pulse, gestureOptions)
+    window.removeEventListener('resize', pulse)
+    subscribers.clear()
+  })
+
+  return activity
+}
+
+/** Keeps `onPulse` subscribed to a pulse the caller already holds, for the component's lifetime. */
+export function onBoardActivity(activity: BoardActivity, onPulse: () => void): void {
+  onBeforeUnmount(activity.subscribe(onPulse))
+}
+
+/**
+ * The same, for a descendant of the canvas that reads the pulse by injection. Throws when used
+ * outside the board canvas: a driver that silently subscribed to nothing would measure once and
+ * then freeze, which reads as a layout bug rather than the wiring one it is. The canvas itself
+ * cannot inject what it provides, so it passes the returned pulse to `onBoardActivity` instead.
+ */
+export function useBoardActivity(onPulse: () => void): void {
+  const activity = inject(boardActivityKey, null)
+  if (!activity) throw new Error('useBoardActivity() requires a board canvas ancestor')
+  onBoardActivity(activity, onPulse)
+}

package/app/composables/useSettlingRaf.ts

@@ -0,0 +1,32 @@
+import { onBeforeUnmount, onMounted } from 'vue'
+import { createSettlingLoop, type SettlingLoop } from '~/utils/settlingLoop'
+
+/**
+ * Vue lifecycle wrapper around {@link createSettlingLoop}: an animation-frame loop that runs
+ * while `compute()` keeps changing something and parks once it settles. The caller wakes it
+ * with the returned `poke`, wired to whatever signals can start a change (see
+ * `useBoardActivity` for the board's shared set).
+ *
+ * `compute` MUST report honestly whether it changed anything: returning `true` unconditionally
+ * turns this back into the unconditional 60fps loop it replaced.
+ */
+export function useSettlingRaf(
+  compute: () => boolean,
+  options: { settleFrames?: number } = {},
+): Pick<SettlingLoop, 'poke'> {
+  const loop = createSettlingLoop({
+    compute,
+    settleFrames: options.settleFrames,
+    scheduler: {
+      schedule: (run) => requestAnimationFrame(run),
+      cancel: (handle) => cancelAnimationFrame(handle),
+    },
+  })
+
+  // The first frame runs on mount: the board arrives with blocks already laid out, and
+  // nothing would poke a loop that had never measured anything.
+  onMounted(loop.poke)
+  onBeforeUnmount(loop.stop)
+
+  return { poke: loop.poke }
+}

package/app/composables/useTaskExpansion.ts

@@ -1,7 +1,8 @@
 import type { Ref } from 'vue'
 import { onMounted, onBeforeUnmount } from 'vue'
-import { useRafFn } from '@vueuse/core'
 import { lodAtLeast } from '~/composables/useSemanticZoom'
+import { onBoardActivity, type BoardActivity } from '~/composables/useBoardActivity'
+import { useSettlingRaf } from '~/composables/useSettlingRaf'
 import { headerDistanceSq, type Rect } from '~/utils/taskExpansionRanking'
 
 function intersects(a: Rect, b: Rect) {
@@ -33,8 +34,12 @@ function sameSet(a: Set<string>, b: Set<string>) {
  *
  * Only tasks with a running pipeline (steps to show) are candidates for either grant — a
  * task that wouldn't expand never blocks a neighbour and never lifts an empty card.
+ *
+ * Deciding costs a rect per candidate plus an `elementFromPoint`, so it runs only while the
+ * board is moving: the canvas activity pulse wakes it and `useSettlingRaf` parks it again once
+ * the two grants stop changing.
  */
-export function useTaskExpansion(container: Ref<HTMLElement | null>) {
+export function useTaskExpansion(container: Ref<HTMLElement | null>, activity: BoardActivity) {
   const board = useBoardStore()
   const execution = useExecutionStore()
   const ui = useUiStore()
@@ -79,21 +84,29 @@ export function useTaskExpansion(container: Ref<HTMLElement | null>) {
     return id
   }
 
-  function recompute() {
+  /** Re-decide both grants; reports whether either of them changed. */
+  function recompute(): boolean {
     // Hover expands a card at ANY zoom band, so the pointer hit is resolved BEFORE the
     // zoom gate below — resolving it after would collapse the hovered card the moment the
     // user zoomed back out past the `steps` band.
     const hovered = hoveredTaskId()
-    if (store.hoveredId !== hovered) store.setHovered(hovered)
+    let changed = false
+    if (store.hoveredId !== hovered) {
+      store.setHovered(hovered)
+      changed = true
+    }
 
     // The zoom-driven expansion (every on-screen card, overlap-resolved) is deep-band
     // only; clear its grants otherwise. The hover grant above stands on its own.
     if (!lodAtLeast(ui.lod, 'steps')) {
-      if (store.allowed.size) store.setAllowed(new Set())
-      return
+      if (store.allowed.size) {
+        store.setAllowed(new Set())
+        changed = true
+      }
+      return changed
     }
     const view = container.value?.getBoundingClientRect()
-    if (!view) return
+    if (!view) return changed
     const cx = view.left + view.width / 2
     const cy = view.top + view.height / 2
 
@@ -145,19 +158,24 @@ export function useTaskExpansion(container: Ref<HTMLElement | null>) {
       next.add(c.id)
       claimed.push(c.rect)
     }
-    if (!sameSet(next, store.allowed)) store.setAllowed(next)
+    if (!sameSet(next, store.allowed)) {
+      store.setAllowed(next)
+      changed = true
+    }
+    return changed
   }
 
-  const { pause, resume } = useRafFn(recompute, { immediate: false })
+  const { poke } = useSettlingRaf(recompute)
+  // The pointer listeners below only record where the pointer IS; the pulse (which watches the
+  // same gestures) is what schedules the frame that acts on it.
+  onBoardActivity(activity, poke)
   onMounted(() => {
     store.setDriverActive(true)
     const el = container.value
     el?.addEventListener('pointermove', onPointerMove)
     el?.addEventListener('pointerleave', onPointerLeave)
-    resume()
   })
   onBeforeUnmount(() => {
-    pause()
     const el = container.value
     el?.removeEventListener('pointermove', onPointerMove)
     el?.removeEventListener('pointerleave', onPointerLeave)

package/app/pages/mcp-authorize.vue

@@ -0,0 +1,7 @@
+<script setup lang="ts">
+import McpAuthorizeScreen from '~/components/settings/McpAuthorizeScreen.vue'
+</script>
+
+<template>
+  <McpAuthorizeScreen />
+</template>

package/app/stores/auth/session.ts

@@ -1,5 +1,6 @@
 import type { Ref } from 'vue'
 import type { AuthUser } from '~/types/domain'
+import { postSignInUrl } from '~/utils/postSignIn'
 
 /**
  * Shared reactive state + injected dependencies the auth-store sign-in factory closes over.
@@ -24,9 +25,20 @@ export interface AuthSessionContext {
 export function createAuthSessionActions(ctx: AuthSessionContext) {
   const { api, apiBase, token, user, autoLoginProvider } = ctx
 
-  /** Build a post-login redirect back to the current page, with an optional invite. */
+  /**
+   * Build a post-login redirect back to the current page, with an optional invite.
+   *
+   * "The current page" includes its QUERY STRING, through the same `postSignInUrl` the credential
+   * forms reload to, so the round-trip through an identity provider lands where the person started
+   * rather than one level up. A flow that carries its whole subject there (`/mcp-authorize?request=`)
+   * otherwise comes back from the IdP to a page that no longer knows what it was asked, and this is
+   * the path an SSO deployment takes for EVERY sign-in, not an unusual one.
+   *
+   * The `invite` is dropped from the returned-to URL by that helper and named as its own parameter
+   * here, which is the same token travelling as itself rather than twice.
+   */
   function redirectTarget(invite?: string): string {
-    const here = window.location.origin + window.location.pathname
+    const here = window.location.origin + postSignInUrl(window.location)
     const params = new URLSearchParams({ redirect: here })
     if (invite) params.set('invite', invite)
     return params.toString()

package/app/stores/board/placement.ts

@@ -207,10 +207,17 @@ export function createBoardPlacement(ctx: BoardWriteContext) {
     }
   }
 
-  /** Patch the user-editable fields of a block (title, features, threshold…). */
-  async function updateBlock(id: string, patch: UpdateBlockInput) {
+  /**
+   * Patch the user-editable fields of a block (title, features, threshold…).
+   *
+   * Returns whether the patch was PERSISTED. Both failure modes are already reported here (an
+   * unknown block is a no-op, a rejected write rolls back and toasts), so an inspector control
+   * firing and forgetting stays correct. A caller that goes on to ASSERT what the patch achieved
+   * must read it, or it announces links the rollback has just undone.
+   */
+  async function updateBlock(id: string, patch: UpdateBlockInput): Promise<boolean> {
     const b = getBlock(id)
-    if (!b) return
+    if (!b) return false
     // Snapshot ONLY the fields this patch touches so a rejected write restores them exactly
     // (a patch may set several at once) rather than leaving a stale optimistic value stuck on
     // screen with no feedback — the same rollback contract the other mutations here follow.
@@ -224,6 +231,7 @@ export function createBoardPlacement(ctx: BoardWriteContext) {
     Object.assign(b, patch) // optimistic
     try {
       upsert(await api.updateBlock(useWorkspaceStore().requireId(), id, patch))
+      return true
     } catch (e) {
       // Re-resolve the block: a live event may have replaced its object reference (`upsert`
       // swaps in a fresh one) while the write was in flight, so `b` can be stale. Only revert
@@ -242,6 +250,7 @@ export function createBoardPlacement(ctx: BoardWriteContext) {
         icon: 'i-lucide-triangle-alert',
         color: 'error',
       })
+      return false
     }
   }
 

package/app/stores/board.spec.ts

@@ -256,12 +256,22 @@ describe('board store read getters', () => {
     s.hydrate([frame('f1', { title: 'Original', description: 'orig' })])
     // With no active workspace, `requireId()` throws inside updateBlock's try — the same catch
     // that a rejected API write hits — so this exercises the optimistic-rollback + toast path.
-    await s.updateBlock('f1', { title: 'Edited', description: 'changed' })
+    // The outcome is REPORTED to the caller, not only toasted: a caller that goes on to announce
+    // what the patch achieved (the monorepo import's frontend wiring) has to see the rollback.
+    await expect(s.updateBlock('f1', { title: 'Edited', description: 'changed' })).resolves.toBe(
+      false,
+    )
     expect(s.getBlock('f1')?.title).toBe('Original')
     expect(s.getBlock('f1')?.description).toBe('orig')
     expect(addSpy).toHaveBeenCalledWith(expect.objectContaining({ color: 'error' }))
   })
 
+  it('updateBlock reports a no-op for a block that is not on the board', async () => {
+    // Nothing is patched and nothing is toasted, so the return value is the ONLY signal that the
+    // write did not happen.
+    await expect(store.updateBlock('missing', { title: 'Edited' })).resolves.toBe(false)
+  })
+
   it('hydrate replaces and upsert inserts/updates cached blocks', () => {
     store.hydrate([frame('f1')])
     store.upsert(task('t1', 'f1', { title: 'first' }))
@@ -305,11 +315,21 @@ describe('board store optimistic rollback', () => {
     }))
     const store = useBoardStore()
     store.hydrate([frame('f1'), task('t1', 'f1', { title: 'orig', description: 'keep' })])
-    await store.updateBlock('t1', { title: 'renamed' })
+    await expect(store.updateBlock('t1', { title: 'renamed' })).resolves.toBe(false)
     expect(store.getBlock('t1')?.title).toBe('orig')
     expect(store.getBlock('t1')?.description).toBe('keep')
   })
 
+  it('updateBlock reports the patch persisted when the API accepts it', async () => {
+    vi.stubGlobal('useApi', () => ({
+      updateBlock: async () => task('t1', 'f1', { title: 'renamed' }),
+    }))
+    const store = useBoardStore()
+    store.hydrate([frame('f1'), task('t1', 'f1', { title: 'orig' })])
+    await expect(store.updateBlock('t1', { title: 'renamed' })).resolves.toBe(true)
+    expect(store.getBlock('t1')?.title).toBe('renamed')
+  })
+
   it('previewResize translates the children when the drag moves the content origin', () => {
     // A child's position is relative to its container's content origin, so growing the frame
     // 40px west (origin -40) has to move every direct child +40 or the whole content slides with