@cat-factory/app 0.303.4 → 0.305.0

package/app/components/guidedReview/GuidedReviewPicker.vue

@@ -0,0 +1,95 @@
+<script setup lang="ts">
+// Pick a linked repository and one of its pull requests (an open one from the synced list, or any
+// number typed in) to open a guided review on.
+import type { OpenGuidedReviewInput } from '~/types/domain'
+
+defineProps<{ opening: boolean; loading: boolean }>()
+const emit = defineEmits<{ open: [target: OpenGuidedReviewInput] }>()
+const { t } = useI18n()
+const github = useGitHubStore()
+
+const repoId = ref<number | undefined>(undefined)
+const prNumber = ref<number | undefined>(undefined)
+
+const repoItems = computed(() =>
+  github.repos.map((r) => ({ label: `${r.owner}/${r.name}`, value: r.githubId })),
+)
+const repo = computed(() => github.repos.find((r) => r.githubId === repoId.value))
+const openPulls = computed(() =>
+  repo.value ? github.pullsForRepo(repo.value.githubId).filter((p) => p.state === 'open') : [],
+)
+
+function submit(number = prNumber.value): void {
+  const r = repo.value
+  if (!r || !number) return
+  emit('open', {
+    owner: r.owner,
+    repo: r.name,
+    prNumber: number,
+    ...(r.provider ? { provider: r.provider } : {}),
+  })
+}
+</script>
+
+<template>
+  <div class="mx-auto max-w-xl space-y-4" data-testid="guided-review-picker">
+    <p class="text-sm text-muted">{{ t('guidedReview.picker.intro') }}</p>
+    <p v-if="loading" class="flex items-center gap-2 text-sm text-muted">
+      <UIcon name="i-lucide-loader-circle" class="h-4 w-4 animate-spin" />
+      {{ t('guidedReview.picker.loading') }}
+    </p>
+    <p v-else-if="!github.repos.length" class="text-sm text-toned">
+      {{ t('guidedReview.picker.noRepos') }}
+    </p>
+    <template v-else>
+      <UFormField :label="t('guidedReview.picker.repo')">
+        <USelectMenu
+          v-model="repoId"
+          :items="repoItems"
+          value-key="value"
+          class="w-full"
+          data-testid="guided-review-picker-repo"
+        />
+      </UFormField>
+      <div v-if="openPulls.length" class="space-y-1">
+        <p class="text-xs font-semibold uppercase text-dimmed">
+          {{ t('guidedReview.picker.openPulls') }}
+        </p>
+        <UButton
+          v-for="pr in openPulls"
+          :key="pr.number"
+          block
+          size="sm"
+          variant="ghost"
+          color="neutral"
+          class="justify-start"
+          :disabled="opening"
+          :data-testid="`guided-review-picker-pr-${pr.number}`"
+          @click="submit(pr.number)"
+        >
+          <span class="truncate">#{{ pr.number }} {{ pr.title }}</span>
+        </UButton>
+      </div>
+      <div class="flex items-end gap-2">
+        <UFormField :label="t('guidedReview.picker.number')" class="flex-1">
+          <UInputNumber
+            v-model="prNumber"
+            :min="1"
+            class="w-full"
+            data-testid="guided-review-picker-number"
+          />
+        </UFormField>
+        <UButton
+          color="primary"
+          icon="i-lucide-scan-search"
+          :loading="opening"
+          :disabled="!repo || !prNumber"
+          data-testid="guided-review-picker-open"
+          @click="submit()"
+        >
+          {{ t('guidedReview.picker.open') }}
+        </UButton>
+      </div>
+    </template>
+  </div>
+</template>

package/app/components/guidedReview/GuidedReviewThread.vue

@@ -0,0 +1,177 @@
+<script setup lang="ts">
+// One exploration thread: its messages, the comment drafts it produced, and a composer. While its
+// own answer is pending the composer waits; other threads are unaffected.
+import type { GuidedReviewCommentDraft, GuidedReviewThreadView } from '~/types/domain'
+import MarkdownProse from '~/components/common/MarkdownProse.vue'
+import GuidedReviewFailure from '~/components/guidedReview/GuidedReviewFailure.vue'
+import {
+  canAsk,
+  citationLabel,
+  draftAnchor,
+  droppedAnchor,
+  isLive,
+  keptDrafts,
+} from '~/components/guidedReview/GuidedReview.logic'
+
+const props = defineProps<{
+  sessionId: string
+  /** Absent for the unsaved new-thread tab: its first question creates the thread. */
+  view: GuidedReviewThreadView | undefined
+  drafts: GuidedReviewCommentDraft[]
+}>()
+const emit = defineEmits<{ created: [threadId: string] }>()
+const { t } = useI18n()
+const store = useGuidedReviewStore()
+const { present } = usePipelineErrorToast()
+
+const prompt = ref('')
+const sending = ref(false)
+const messages = computed(() => props.view?.messages ?? [])
+const ready = computed(() => canAsk(messages.value) && !sending.value)
+const canSend = computed(() => ready.value && prompt.value.trim().length > 0)
+
+async function send(): Promise<void> {
+  if (!canSend.value) return
+  const content = prompt.value.trim()
+  sending.value = true
+  try {
+    if (props.view) {
+      await store.ask(props.sessionId, props.view.thread.id, { content })
+    } else {
+      const created = await store.openThread(props.sessionId, { question: { content } })
+      emit('created', created.thread.id)
+    }
+    prompt.value = ''
+  } catch (error) {
+    present(error, 'guidedReview.errors.ask')
+  } finally {
+    sending.value = false
+  }
+}
+
+async function draftComments(): Promise<void> {
+  if (!props.view || !ready.value) return
+  sending.value = true
+  try {
+    await store.requestDrafts(props.sessionId, props.view.thread.id)
+  } catch (error) {
+    present(error, 'guidedReview.errors.drafts')
+  } finally {
+    sending.value = false
+  }
+}
+</script>
+
+<template>
+  <div class="flex h-full min-h-0 flex-col gap-3" data-testid="guided-review-thread">
+    <div class="min-h-0 flex-1 space-y-3 overflow-y-auto pr-1">
+      <p v-if="!messages.length" class="text-sm text-muted">
+        {{ t('guidedReview.thread.empty') }}
+      </p>
+      <div
+        v-for="m in messages"
+        :key="m.id"
+        :class="m.role === 'user' ? 'ms-8 bg-elevated' : 'me-8 border border-default'"
+        class="rounded-lg p-3 text-sm"
+        :data-testid="`guided-review-message-${m.role}`"
+      >
+        <template v-if="m.role === 'user'">
+          <p v-if="m.kind === 'comment-drafts'" class="text-xs text-dimmed">
+            {{ t('guidedReview.thread.draftRequest') }}
+          </p>
+          <p class="whitespace-pre-wrap">{{ m.content }}</p>
+        </template>
+        <p v-else-if="isLive(m)" class="flex items-center gap-2 text-muted">
+          <UIcon name="i-lucide-loader-circle" class="h-4 w-4 animate-spin" />
+          {{ t('guidedReview.thread.waiting') }}
+        </p>
+        <GuidedReviewFailure v-else-if="m.status === 'failed' && m.failure" :failure="m.failure" />
+        <template v-else-if="m.kind === 'answer'">
+          <MarkdownProse :text="m.content" />
+          <div v-if="m.citations.length" class="mt-2 flex flex-wrap gap-1">
+            <UBadge
+              v-for="(c, i) in m.citations"
+              :key="i"
+              size="sm"
+              variant="outline"
+              color="neutral"
+            >
+              {{ citationLabel(c) }}
+            </UBadge>
+          </div>
+        </template>
+        <template v-else>
+          <p>
+            {{
+              t('guidedReview.drafts.summary', {
+                kept: keptDrafts(drafts, m.id),
+                proposed: m.draftReport?.proposed ?? 0,
+              })
+            }}
+          </p>
+          <ul v-if="m.draftReport?.dropped.length" class="mt-1 space-y-0.5 text-xs text-muted">
+            <li
+              v-for="(d, i) in m.draftReport.dropped"
+              :key="i"
+              data-testid="guided-review-dropped"
+            >
+              {{ droppedAnchor(d) }}:
+              {{ t(`guidedReview.dropped.${d.reason}`) }}
+            </li>
+          </ul>
+        </template>
+      </div>
+
+      <div v-if="drafts.length" class="space-y-2" data-testid="guided-review-drafts">
+        <h4 class="text-xs font-semibold uppercase text-dimmed">
+          {{ t('guidedReview.drafts.title') }}
+        </h4>
+        <div v-for="d in drafts" :key="d.id" class="rounded-md border border-default p-2 text-sm">
+          <p class="text-xs text-dimmed">
+            {{ draftAnchor(d) }}
+            ({{ t(`guidedReview.drafts.side.${d.side}`) }})
+          </p>
+          <MarkdownProse :text="d.body" />
+          <p v-if="d.rationale" class="mt-1 text-xs text-muted">{{ d.rationale }}</p>
+        </div>
+      </div>
+    </div>
+
+    <div class="space-y-2">
+      <UTextarea
+        v-model="prompt"
+        :rows="3"
+        autoresize
+        :maxrows="10"
+        class="w-full"
+        :disabled="!ready"
+        :placeholder="ready ? t('guidedReview.thread.placeholder') : t('guidedReview.thread.busy')"
+        data-testid="guided-review-composer"
+        @keydown.enter.meta.prevent="send"
+        @keydown.enter.ctrl.prevent="send"
+      />
+      <div class="flex flex-wrap items-center gap-2">
+        <UButton
+          color="primary"
+          icon="i-lucide-send"
+          :loading="sending"
+          :disabled="!canSend"
+          data-testid="guided-review-send"
+          @click="send"
+        >
+          {{ t('guidedReview.thread.send') }}
+        </UButton>
+        <UButton
+          v-if="view"
+          variant="soft"
+          icon="i-lucide-message-square-plus"
+          :disabled="!ready || !messages.length"
+          data-testid="guided-review-draft-comments"
+          @click="draftComments"
+        >
+          {{ t('guidedReview.drafts.request') }}
+        </UButton>
+      </div>
+    </div>
+  </div>
+</template>

package/app/components/panels/inspector/TaskReviewTarget.vue

@@ -23,9 +23,13 @@ import {
   reviewQueueDirty,
   reviewSkillQueuePatch,
 } from '~/components/panels/inspector/TaskReviewTarget.logic'
+import { reviewTaskTarget } from '~/components/guidedReview/GuidedReview.logic'
 
 const props = defineProps<{ block: Block }>()
 const board = useBoardStore()
+const github = useGitHubStore()
+const ui = useUiStore()
+const access = useWorkspaceAccess()
 const { t } = useI18n()
 
 const isReview = computed(() => props.block.taskType === 'review')
@@ -33,6 +37,26 @@ const fields = computed(() => props.block.taskTypeFields ?? null)
 const url = computed(() => fields.value?.prUrl?.trim() || '')
 const focus = computed(() => fields.value?.reviewFocus?.trim() || '')
 
+// Opening a guided review is a member-tier write, gated like the sidebar entry that opens one.
+const canGuide = computed(() => isReview.value && access.canWriteBoard.value)
+
+// Nothing loads the repository projection on board open, and the guided-review button below
+// resolves the task's repository from it.
+watch(
+  canGuide,
+  (can) => {
+    if (can) void github.ensureLoaded().catch(() => {})
+  },
+  { immediate: true },
+)
+
+/** The PR as a guided review opens it, when the task's service has a linked repository. */
+const guidedTarget = computed(() => {
+  if (!canGuide.value) return null
+  const frame = board.serviceOf(props.block)
+  return reviewTaskTarget(fields.value, frame ? github.repoForBlock(frame.id) : undefined)
+})
+
 /** `#123` when the number is known, else the raw link — never an empty affordance. */
 const label = computed(() => {
   const number = fields.value?.prNumber
@@ -107,6 +131,18 @@ function revert() {
     >
       {{ label }}
     </p>
+    <UButton
+      v-if="guidedTarget"
+      color="primary"
+      variant="soft"
+      size="sm"
+      icon="i-lucide-scan-search"
+      block
+      data-testid="inspector-review-target-guided"
+      @click="ui.openGuidedReview({ sessionId: null, target: guidedTarget })"
+    >
+      {{ t('guidedReview.openFromTask') }}
+    </UButton>
     <p v-if="focus" class="text-xs leading-relaxed text-dimmed">
       {{ t('inspector.reviewTarget.focus', { focus }) }}
     </p>

package/app/composables/api/guidedReview.ts

@@ -0,0 +1,80 @@
+import {
+  askGuidedReviewContract,
+  deleteGuidedReviewContract,
+  getGuidedReviewContract,
+  getGuidedReviewThreadContract,
+  listGuidedReviewsContract,
+  openGuidedReviewContract,
+  openGuidedReviewThreadContract,
+  refreshGuidedReviewContract,
+  requestGuidedReviewDraftsContract,
+} from '@cat-factory/contracts'
+import type {
+  AskGuidedReviewInput,
+  OpenGuidedReviewInput,
+  OpenGuidedReviewThreadInput,
+} from '~/types/domain'
+import type { ApiContext } from './context'
+
+/** Guided PR review: sessions, their threads, questions and comment-draft requests. */
+export function guidedReviewApi({ send, ws }: ApiContext) {
+  return {
+    openGuidedReview: (workspaceId: string, body: OpenGuidedReviewInput) =>
+      send(openGuidedReviewContract, { pathPrefix: ws(workspaceId), body }),
+
+    listGuidedReviews: (
+      workspaceId: string,
+      query: { repoId?: string; prNumber?: string; mine?: 'true' | 'false' } = {},
+    ) => send(listGuidedReviewsContract, { pathPrefix: ws(workspaceId), queryParams: query }),
+
+    getGuidedReview: (workspaceId: string, sessionId: string) =>
+      send(getGuidedReviewContract, { pathPrefix: ws(workspaceId), pathParams: { sessionId } }),
+
+    deleteGuidedReview: (workspaceId: string, sessionId: string) =>
+      send(deleteGuidedReviewContract, { pathPrefix: ws(workspaceId), pathParams: { sessionId } }),
+
+    refreshGuidedReview: (workspaceId: string, sessionId: string) =>
+      send(refreshGuidedReviewContract, { pathPrefix: ws(workspaceId), pathParams: { sessionId } }),
+
+    openGuidedReviewThread: (
+      workspaceId: string,
+      sessionId: string,
+      body: OpenGuidedReviewThreadInput,
+    ) =>
+      send(openGuidedReviewThreadContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { sessionId },
+        body,
+      }),
+
+    getGuidedReviewThread: (workspaceId: string, sessionId: string, threadId: string) =>
+      send(getGuidedReviewThreadContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { sessionId, threadId },
+      }),
+
+    askGuidedReview: (
+      workspaceId: string,
+      sessionId: string,
+      threadId: string,
+      body: AskGuidedReviewInput,
+    ) =>
+      send(askGuidedReviewContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { sessionId, threadId },
+        body,
+      }),
+
+    requestGuidedReviewDrafts: (
+      workspaceId: string,
+      sessionId: string,
+      threadId: string,
+      instructions = '',
+    ) =>
+      send(requestGuidedReviewDraftsContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { sessionId, threadId },
+        body: { instructions },
+      }),
+  }
+}

package/app/composables/useApi.ts

@@ -29,6 +29,7 @@ import { humanTestApi } from './api/humanTest'
 import { infraHandlersApi } from './api/infraHandlers'
 import { initiativeApi } from './api/initiative'
 import { docInterviewApi } from './api/docInterview'
+import { guidedReviewApi } from './api/guidedReview'
 import { visualConfirmApi } from './api/visualConfirm'
 import { kaizenApi } from './api/kaizen'
 import { localSettingsApi } from './api/localSettings'
@@ -160,6 +161,7 @@ export function useApi() {
     ...infraHandlersApi(ctx),
     ...initiativeApi(ctx),
     ...docInterviewApi(ctx),
+    ...guidedReviewApi(ctx),
     ...provisioningLogsApi(ctx),
     ...releaseHealthApi(ctx),
     ...validationChecksApi(ctx),

package/app/composables/useNavContributions.ts

@@ -41,6 +41,7 @@ export function useNavContributions() {
   // Consumer items bypass this map entirely via their own `run` closure.
   const actions: Record<NavActionId, () => void> = {
     assistant: () => ui.openAssistant(),
+    guidedReview: () => ui.openGuidedReview(),
     buildPipeline: () => ui.openBuilder(),
     addFromRepo: () => ui.openAddService(),
     bootstrapRepo: () => ui.openBootstrap(),

package/app/composables/usePipelineErrorToast.ts

@@ -171,6 +171,10 @@ const CONFLICT_INFO: Record<Exclude<ConflictReason, BespokeConflictReason>, Conf
     titleKey: 'errors.conflict.title.delegated_claim_missing',
     descriptionKey: 'errors.conflict.description.delegated_claim_missing',
   },
+  thread_busy: {
+    titleKey: 'errors.conflict.title.thread_busy',
+    descriptionKey: 'errors.conflict.description.thread_busy',
+  },
   task_limit_reached: {
     titleKey: 'errors.conflict.title.task_limit_reached',
     descriptionKey: 'errors.conflict.description.task_limit_reached',

package/app/composables/useWorkspaceStream.ts

@@ -34,6 +34,7 @@ export function useWorkspaceStream() {
   const kaizen = useKaizenStore()
   const initiatives = useInitiativesStore()
   const docInterview = useDocInterviewStore()
+  const guidedReview = useGuidedReviewStore()
   const api = useApi()
   const apiBase = useRuntimeConfig().public.apiBase
 
@@ -89,6 +90,7 @@ export function useWorkspaceStream() {
     upsertKaizen: (g) => kaizen.upsert(g),
     upsertInitiative: (i) => initiatives.upsert(i),
     upsertDocInterview: (s) => docInterview.upsert(s),
+    guidedReviewChanged: (change) => void guidedReview.applyChange(change),
     refreshBoard: () => coarse.schedule(),
   }
 
@@ -148,6 +150,8 @@ export function useWorkspaceStream() {
       // failure (`coarse.withRetry`) so a reconnect no longer presents as fully live while
       // silently missing everything from the outage; `connected` is still set even if every
       // retry fails (we ARE connected; a refresh error must not wedge the indicator/tests).
+      // A guided review is not in the snapshot, so whatever this tab has loaded refetches itself.
+      void guidedReview.resync()
       void coarse.withRetry(workspaceId).finally(() => {
         // A workspace switch (or stop()) may have happened while the refresh was in
         // flight — don't announce a connection for a socket we've since abandoned.

package/app/composables/workspaceStream/applyWorkspaceEvent.spec.ts

@@ -30,6 +30,7 @@ function targets(): WorkspaceEventTargets & { calls: string[] } {
     upsertKaizen: record('upsertKaizen'),
     upsertInitiative: record('upsertInitiative'),
     upsertDocInterview: record('upsertDocInterview'),
+    guidedReviewChanged: record('guidedReviewChanged'),
     refreshBoard: record('refreshBoard'),
   }
 }
@@ -129,6 +130,7 @@ describe('applyWorkspaceEvent: the other branches', () => {
       [{ type: 'kaizen', grading: {} as never, at: 1 }, 'upsertKaizen'],
       [{ type: 'initiative', initiative: {} as never, at: 1 }, 'upsertInitiative'],
       [{ type: 'docInterview', session: {} as never, at: 1 }, 'upsertDocInterview'],
+      [{ type: 'guidedReview', change: {} as never, at: 1 }, 'guidedReviewChanged'],
     ]
 
     for (const [event, expected] of cases) {

package/app/composables/workspaceStream/applyWorkspaceEvent.ts

@@ -16,6 +16,7 @@ import type { BrainstormSession } from '~/types/brainstorm'
 import type { ClarityReview } from '~/types/clarity'
 import type { ConsensusSession } from '~/types/consensus'
 import type { DocInterviewSession } from '~/types/doc-interview'
+import type { GuidedReviewChange } from '~/types/guided-review'
 import type { RequirementReview } from '~/types/requirements'
 
 /**
@@ -44,6 +45,8 @@ export interface WorkspaceEventTargets {
   upsertKaizen: (g: KaizenGrading) => void
   upsertInitiative: (i: Initiative) => void
   upsertDocInterview: (s: DocInterviewSession) => void
+  /** A guided review moved; the store refetches only what this client has loaded. */
+  guidedReviewChanged: (change: GuidedReviewChange) => void
   /** Debounced full `workspace.refresh()`: the fallback for a change no payload can state. */
   refreshBoard: () => void
 }
@@ -151,6 +154,9 @@ export function applyWorkspaceEvent(event: WorkspaceEvent, to: WorkspaceEventTar
       // convergence): patch the cache so an open interview window reflects it live.
       to.upsertDocInterview(event.session)
       return
+    case 'guidedReview':
+      to.guidedReviewChanged(event.change)
+      return
     default:
       return dropUnknownEvent(event)
   }

package/app/modular/nav-contributions.ts

@@ -197,6 +197,7 @@ export interface NavCommandSpec {
  */
 export const NAV_ACTIONS = [
   'assistant',
+  'guidedReview',
   'buildPipeline',
   'addFromRepo',
   'bootstrapRepo',
@@ -395,6 +396,25 @@ export const NAV_CONTRIBUTIONS: readonly NavContribution[] = [
       keywordsKey: 'layout.commandBar.keywords.addFromRepo',
     },
   },
+  {
+    // Guided PR review. Basic tier, because reviewing pull requests is part of the everyday
+    // delivery loop; not `intake`, because the intake role brings work in rather than reviewing
+    // the code that delivers it.
+    id: 'guided-review',
+    labelKey: 'nav.guidedReview',
+    icon: 'i-lucide-scan-search',
+    surfaces: S('sidebar', 'command'),
+    gate: (g) => g.githubAvailable && g.canWriteBoard,
+    action: 'guidedReview',
+    testId: 'nav-guided-review',
+    sidebar: { group: 'repositories', order: 15 },
+    command: {
+      group: 'repositories',
+      order: 15,
+      labelKey: 'layout.commandBar.cmd.guidedReview',
+      keywordsKey: 'layout.commandBar.keywords.guidedReview',
+    },
+  },
   {
     id: 'bootstrap-repo',
     labelKey: 'nav.bootstrapRepo',

package/app/pages/index.vue

@@ -49,6 +49,9 @@ const TaskSourceConnectModal = defineAsyncView(
 const TaskImportModal = defineAsyncView(() => import('~/components/tasks/TaskImportModal.vue'))
 const BugHuntModal = defineAsyncView(() => import('~/components/tasks/BugHuntModal.vue'))
 const AssistantModal = defineAsyncView(() => import('~/components/assistant/AssistantModal.vue'))
+const GuidedReviewModal = defineAsyncView(
+  () => import('~/components/guidedReview/GuidedReviewModal.vue'),
+)
 const RecurringPipelineModal = defineAsyncView(
   () => import('~/components/board/RecurringPipelineModal.vue'),
 )
@@ -503,6 +506,7 @@ watch(
         <TaskImportModal v-if="ui.taskImport" />
         <BugHuntModal v-if="ui.bugHunt" />
         <AssistantModal v-if="ui.assistantOpen" />
+        <GuidedReviewModal v-if="ui.guidedReview" />
         <RecurringPipelineModal v-if="ui.addRecurringFrameId" />
         <ObservabilityPanel v-if="ui.observabilityInstanceId" />
         <OperatorDashboardPanel v-if="ui.operatorDashboardOpen" />