handoff-runner

  on('ui.render', { component: 'AbovePrompt' }, async ($, e, next) => {
    if ((e.props as any)?.hasSurvey) return next(e)
    const fail = await read($, failure)
    const text = bandText(await read($, tickets), fail)
    if (text === null) return next(e)
    const { Box, Text } = $.ui.resolve(e)
    const below = await next(e)
    return (
      <Box flexDirection="column">
        <Text color={fail !== null ? 'yellow' : 'cyan'} wrap="truncate-end">
          {text}
        </Text>
        {below}
      </Box>
    )
  })

  on('ui.render', { component: 'Pane', requestId: PANE }, async ($, e) => {
    const { Box, Text, Button } = $.ui.resolve(e)
    const rows = pending(await read($, tickets))
    const byId = await read($, rendered)
    const busy = await read($, running)
    const fail = await read($, failure)
    const cands = await read($, candidates)

    const out: any[] = []
    if (fail !== null) out.push(<Text color="yellow" wrap="truncate-end">無法讀取交接單：{fail}</Text>)
    if (rows.length === 0 && fail === null) out.push(<Text dimColor>沒有待辦的交接單。</Text>)

    for (const row of rows) {
      const r = byId[row.id]
      out.push(
        <Text key={`title:${row.id}`} bold wrap="truncate-end">
          {row.title}
        </Text>,
      )
      if (!r) {
        out.push(<Text dimColor>檢查中…</Text>)
        continue
      }
      for (const c of r.prechecks) {
        out.push(
          <Text color={c.ok ? undefined : 'yellow'} dimColor={c.ok || undefined} wrap="truncate-end">
            {checkLine(c)}
          </Text>,
        )
      }
      for (const s of r.steps) {
        out.push(
          <Box flexDirection="column">
            <Text dimColor={s.done_already || undefined} wrap="truncate-end">
              {stepLine(s)}
            </Text>
            <Text dimColor wrap="truncate-end">
              {'  '}
              {argvText(s)}
            </Text>
          </Box>,
        )
      }
      if (r.last_result?.summary) out.push(<Text dimColor wrap="truncate-end">上次：{r.last_result.summary}</Text>)
      const buttons: any[] = []
      if (busy[row.id]) {
        out.push(<Text color="cyan">執行中…</Text>)
      } else if (r.status === 'ready') {
        buttons.push(<Button key={`run:${row.id}`} variant="primary" label="執行" onPress={() => void runTicket($, row.id)} />)
      } else {
        out.push(
          <Text color="yellow" wrap="truncate-end">
            無法執行（{r.status}）：{r.reason || '事前檢查未通過'}
          </Text>,
        )
      }
      if (!busy[row.id]) {
        buttons.push(<Button key={`dismiss:${row.id}`} label="撤單" dimColor onPress={() => void dismissTicket($, row.id).catch(() => {})} />)
      }
      out.push(<Box key={`buttons:${row.id}`}>{buttons}</Box>)
    }

    if (cands.length > 0) {
      out.push(<Text key="cands" dimColor>可簽發（worktree 裡可快轉進 {defaultTarget} 的分支）：</Text>)
      for (const c of cands) {
        out.push(
          <Button
            key={`issue:${c.branch}`}
            label={`簽發 ${c.branch}（${short(c.sha)}）→ ${c.target}`}
            dimColor
            onPress={() => void issueFromPane($, c.branch, c.target).catch(() => {})}
          />,
        )
      }
    }

    return (
      <Box flexDirection="column">
        {out}
        <Box>
          <Button key="refresh" label="重新檢查" onPress={() => refresh($)} />
          <Button key="close" label="關閉" role="dismiss" onPress={() => $.ui.close({ id: PANE }).catch(() => {})} />
        </Box>
      </Box>
    )
  })