@cat-factory/app 0.304.0 → 0.306.0

package/app/components/guidedReview/GuidedReviewThread.vue

@@ -0,0 +1,254 @@
+<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 { isPostableDraft } from '@cat-factory/contracts'
+import type { GuidedReviewCommentDraft, GuidedReviewThreadView } from '~/types/domain'
+import MarkdownProse from '~/components/common/MarkdownProse.vue'
+import GuidedReviewFailure from '~/components/guidedReview/GuidedReviewFailure.vue'
+import GuidedReviewDraftCard from '~/components/guidedReview/GuidedReviewDraftCard.vue'
+import {
+  canAsk,
+  citationLabel,
+  droppedAnchor,
+  isLive,
+  keptDrafts,
+  postableSelection,
+} 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
+  }
+}
+
+const selected = ref(new Set<string>())
+const summary = ref('')
+const posting = ref(false)
+const postResult = ref<{
+  posted: number
+  failed: number
+  skipped: number
+  summaryError: string | null
+} | null>(null)
+// A `posting` draft becomes postable again once its claim outlives the lease, so the clock only
+// runs while one is on screen.
+const now = useNowTick(30_000, () => props.drafts.some((d) => d.status === 'posting'))
+const toPost = computed(() => postableSelection(props.drafts, selected.value, now.value))
+
+function setSelected(id: string, value: boolean): void {
+  const next = new Set(selected.value)
+  if (value) next.add(id)
+  else next.delete(id)
+  selected.value = next
+}
+
+async function post(): Promise<void> {
+  if (!toPost.value.length) return
+  posting.value = true
+  try {
+    const result = await store.postDrafts(props.sessionId, toPost.value, summary.value)
+    const summaryFailed = result.summary.posted === false
+    postResult.value = {
+      posted: result.posted,
+      failed: result.failed,
+      skipped: result.skipped.length,
+      summaryError: summaryFailed ? (result.summary.error ?? '') : null,
+    }
+    selected.value = new Set()
+    // A summary the host refused stays in the box, so the reviewer can post it with a retry.
+    if (!summaryFailed) summary.value = ''
+  } catch (error) {
+    present(error, 'guidedReview.errors.postDrafts')
+  } finally {
+    posting.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>
+        <GuidedReviewDraftCard
+          v-for="d in drafts"
+          :key="d.id"
+          :session-id="sessionId"
+          :draft="d"
+          :selected="selected.has(d.id)"
+          :postable="isPostableDraft(d, now)"
+          @update:selected="setSelected(d.id, $event)"
+        />
+        <div class="space-y-2 rounded-md bg-elevated p-2" data-testid="guided-review-post">
+          <UTextarea
+            v-model="summary"
+            :rows="2"
+            autoresize
+            class="w-full"
+            :placeholder="t('guidedReview.drafts.summaryPlaceholder')"
+          />
+          <div class="flex flex-wrap items-center gap-2">
+            <UButton
+              color="primary"
+              icon="i-lucide-upload"
+              :loading="posting"
+              :disabled="!toPost.length"
+              data-testid="guided-review-post-drafts"
+              @click="post"
+            >
+              {{ t('guidedReview.drafts.post', { count: toPost.length }) }}
+            </UButton>
+            <p v-if="postResult" class="text-xs text-muted" data-testid="guided-review-post-result">
+              {{ t('guidedReview.drafts.postResult', postResult) }}
+            </p>
+            <p
+              v-if="postResult && postResult.summaryError !== null"
+              class="text-xs text-error"
+              data-testid="guided-review-post-summary-error"
+            >
+              {{ t('guidedReview.drafts.summaryFailed') }}: {{ postResult.summaryError }}
+            </p>
+          </div>
+        </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

@@ -1,16 +1,20 @@
 import {
   askGuidedReviewContract,
   deleteGuidedReviewContract,
+  editGuidedReviewDraftContract,
   getGuidedReviewContract,
   getGuidedReviewThreadContract,
   listGuidedReviewsContract,
   openGuidedReviewContract,
   openGuidedReviewThreadContract,
+  postGuidedReviewDraftsContract,
   refreshGuidedReviewContract,
   requestGuidedReviewDraftsContract,
 } from '@cat-factory/contracts'
 import type {
   AskGuidedReviewInput,
+  EditGuidedReviewDraftInput,
+  PostGuidedReviewDraftsInput,
   OpenGuidedReviewInput,
   OpenGuidedReviewThreadInput,
 } from '~/types/domain'
@@ -76,5 +80,28 @@ export function guidedReviewApi({ send, ws }: ApiContext) {
         pathParams: { sessionId, threadId },
         body: { instructions },
       }),
+
+    editGuidedReviewDraft: (
+      workspaceId: string,
+      sessionId: string,
+      draftId: string,
+      body: EditGuidedReviewDraftInput,
+    ) =>
+      send(editGuidedReviewDraftContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { sessionId, draftId },
+        body,
+      }),
+
+    postGuidedReviewDrafts: (
+      workspaceId: string,
+      sessionId: string,
+      body: PostGuidedReviewDraftsInput,
+    ) =>
+      send(postGuidedReviewDraftsContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { sessionId },
+        body,
+      }),
   }
 }

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

@@ -175,6 +175,14 @@ const CONFLICT_INFO: Record<Exclude<ConflictReason, BespokeConflictReason>, Conf
     titleKey: 'errors.conflict.title.thread_busy',
     descriptionKey: 'errors.conflict.description.thread_busy',
   },
+  draft_conflict: {
+    titleKey: 'errors.conflict.title.draft_conflict',
+    descriptionKey: 'errors.conflict.description.draft_conflict',
+  },
+  session_stale: {
+    titleKey: 'errors.conflict.title.session_stale',
+    descriptionKey: 'errors.conflict.description.session_stale',
+  },
   task_limit_reached: {
     titleKey: 'errors.conflict.title.task_limit_reached',
     descriptionKey: 'errors.conflict.description.task_limit_reached',

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" />

package/app/stores/guidedReview.ts

@@ -2,6 +2,9 @@ import { defineStore } from 'pinia'
 import { ref } from 'vue'
 import type {
   AskGuidedReviewInput,
+  EditGuidedReviewDraftInput,
+  GuidedReviewCommentDraft,
+  GuidedReviewPostResult,
   GuidedReviewChange,
   GuidedReviewSessionView,
   GuidedReviewThreadView,
@@ -112,6 +115,29 @@ export const useGuidedReviewStore = defineStore('guidedReview', () => {
     await Promise.all([loadThread(sessionId, threadId), loadSession(sessionId)])
   }
 
+  async function editDraft(
+    sessionId: string,
+    draftId: string,
+    input: EditGuidedReviewDraftInput,
+  ): Promise<GuidedReviewCommentDraft> {
+    const draft = await api.editGuidedReviewDraft(workspace.requireId(), sessionId, draftId, input)
+    await loadSession(sessionId)
+    return draft
+  }
+
+  async function postDrafts(
+    sessionId: string,
+    draftIds: string[],
+    summary?: string,
+  ): Promise<GuidedReviewPostResult> {
+    const result = await api.postGuidedReviewDrafts(workspace.requireId(), sessionId, {
+      draftIds,
+      ...(summary?.trim() ? { summary } : {}),
+    })
+    await loadSession(sessionId)
+    return result
+  }
+
   function forget(sessionId: string) {
     delete sessions.value[sessionId]
     delete refetchFailures.value[sessionId]
@@ -193,6 +219,8 @@ export const useGuidedReviewStore = defineStore('guidedReview', () => {
     openThread,
     ask,
     requestDrafts,
+    editDraft,
+    postDrafts,
     applyChange,
     resync,
     reset,

package/app/stores/ui/modals.ts

@@ -1,5 +1,10 @@
 import { ref } from 'vue'
-import type { DocumentSourceKind, InfraSetupArea, TaskSourceKind } from '~/types/domain'
+import type {
+  DocumentSourceKind,
+  InfraSetupArea,
+  OpenGuidedReviewInput,
+  TaskSourceKind,
+} from '~/types/domain'
 import type {
   InfrastructureScrollTarget,
   InfrastructureTab,
@@ -185,6 +190,12 @@ function createMiscModals() {
   return { builderOpen, decisionContext, openBuilder, openDecision, closeDecision }
 }
 
+/** What the guided review window opens on: a session, a pull request, or neither (the picker). */
+export interface GuidedReviewOpen {
+  sessionId: string | null
+  target: OpenGuidedReviewInput | null
+}
+
 /**
  * Document- and task-source integration modals (keyed by source), plus the add-task /
  * add-recurring / create-initiative surfaces. The `open*` connect/import handlers reset the hub
@@ -220,6 +231,9 @@ function createDocumentTaskModals(resetHubReturn: ResetHubReturn) {
   // subject (a turn resolves every name it needs from the board itself), so a plain flag says
   // everything the host needs to know.
   const assistantOpen = ref(false)
+  // Guided PR review: either an existing session to show, or a PR to open one for. Both null
+  // opens the PR picker.
+  const guidedReview = ref<GuidedReviewOpen | null>(null)
 
   // Bug hunt: pick a tracker + one of its boards, rank its open unassigned bugs, adopt one.
   // `containerId` (a service frame or module) preselects where an adopted bug lands; null →
@@ -305,6 +319,13 @@ function createDocumentTaskModals(resetHubReturn: ResetHubReturn) {
   function closeAssistant() {
     assistantOpen.value = false
   }
+  function openGuidedReview(open: GuidedReviewOpen = { sessionId: null, target: null }) {
+    resetHubReturn()
+    guidedReview.value = open
+  }
+  function closeGuidedReview() {
+    guidedReview.value = null
+  }
   function openBugHunt(source: TaskSourceKind | null = null, containerId: string | null = null) {
     resetHubReturn()
     bugHunt.value = { source, containerId }
@@ -354,6 +375,7 @@ function createDocumentTaskModals(resetHubReturn: ResetHubReturn) {
     taskConnect,
     taskImport,
     assistantOpen,
+    guidedReview,
     bugHunt,
     startFromDesign,
     addTaskContainerId,
@@ -375,6 +397,8 @@ function createDocumentTaskModals(resetHubReturn: ResetHubReturn) {
     closeTaskImport,
     openAssistant,
     closeAssistant,
+    openGuidedReview,
+    closeGuidedReview,
     openBugHunt,
     closeBugHunt,
     openStartFromDesign,

package/app/types/guided-review.ts

@@ -2,8 +2,13 @@
 // these through `~/types/domain` like every other domain type.
 export type {
   AskGuidedReviewInput,
+  EditGuidedReviewDraftInput,
+  GuidedReviewPostResult,
+  PostGuidedReviewDraftsInput,
   GuidedReviewChange,
   GuidedReviewCommentDraft,
+  GuidedReviewDraftReport,
+  GuidedReviewFailure,
   GuidedReviewExchange,
   GuidedReviewMessage,
   GuidedReviewSession,