task-eta

  on('ui.render', { component: 'AbovePrompt' }, async ($, e, next) => {
    const below = await next(e)
    const now = Date.now()
    const t = task
    if (!t || e.props.hasSurvey) return below
    const isRunning = t.ending === 'running'
    if (isRunning ? !isRunningVisible(t, now) : now >= bandUntil) return below
    const { Box, Text } = $.ui.resolve(e)
    const at = active(t)
    const cur = t.items[at]
    const doneCount = finishedCount(t)

    const hint: Part = { text: `${TOGGLE_KEY} 看步骤`, rank: 2, isDim: true }
    let parts: Part[]
    if (!isRunning) {
      const total = t.items.length
      const skipped = t.items.filter(i => i.status === 'skipped').length
      const word: Part = { text: endingLabel(t.ending, t.isFinalChecking), rank: 0 }
      parts = t.isFinalChecking
        ? [word, { text: 'Claude 在确认哪些步骤真的做完了', rank: 3, isDim: true }, { text: `已打勾 ${doneCount}/${total}`, rank: 1, isDim: true }, hint]
        : t.ending === 'done'
          ? [word, { text: `用时 ${spent(elapsed(t, now))}`, rank: 1, isDim: true }, ...(skipped > 0 ? [{ text: `${skipped} 步后来不需要了`, rank: 3, isDim: true }] : []), hint]
          : t.ending === 'unchecked'
            ? [word, { text: `完成 ${doneCount}/${total} 步（未经 Claude 确认）`, rank: 1, isDim: true }, { text: '面板里按 c 重试', rank: 3, isDim: true }, hint]
            : [word, { text: `完成 ${doneCount}/${total} 步`, rank: 1, isDim: true }, { text: '下一条消息接着这份清单', rank: 4, isDim: true }, hint]
    } else if (!cur) {
      parts = [
        { text: t.isBusy ? '正在估算步骤…' : t.isWaitingFirstReply ? '等 Claude 第一次回复后估算' : '还没有步骤估算', rank: 0 },
        { text: `已 ${spent(elapsed(t, now))}`, rank: 3, isDim: true },
        { text: `${t.tools} 次工具调用`, rank: 4, isDim: true },
        { ...hint, rank: 1 },
      ]
    } else {
      const remain = left(t, now)
      const nextItem = t.items[at + 1]
      parts = [
        { text: `${at + 1}/${t.items.length} ${cur.title}`, rank: 0 },
        { text: bar(doneCount, t.items.length), rank: 2, color: 'autoAccept' },
        { text: `已 ${spent(elapsed(t, now))}`, rank: 4, isDim: true },
        { text: remain > 0 ? `约剩 ${duration(remain)}` : '已超出预估', rank: 1, isDim: true },
        ...(nextItem ? [{ text: `下一步 ${nextItem.title}`, rank: 5, isDim: true }] : []),
        { ...hint, rank: 3 },
      ]
    }
    const runs: Part[] = []
    // 右端 4 格是 Claude Code 自己画的折叠按钮「 [-]」，bodyColumns 里含着它
    for (const p of fitBand(parts, e.props.bodyColumns - 4)) {
      const last = runs.at(-1)
      if (last?.isDim && p.isDim) last.text += ` · ${p.text}`
      else runs.push({ ...p })
    }
    return (
      <Box flexDirection="column">
        <Box flexDirection="row" gap={1}>
          <Box flexShrink={0}>
            <Text color="autoAccept" bold>
              {BAND_LABEL}
            </Text>
          </Box>
          {runs.map((r, i) => (
            <Text key={String(i)} color={r.color} dimColor={r.isDim} wrap="truncate-end">
              {r.text}
            </Text>
          ))}
        </Box>
        {below}
      </Box>
    )
  })

  on('ui.render', { component: 'Pane', requestId: PANE }, async ($, e) => {
    const { Box, Text, Button } = $.ui.resolve(e)
    const now = Date.now()
    const t = task
    const width = Math.max(40, e.props.bodyColumns - 2)
    const titleWidth = Math.min(30, Math.max(14, Math.floor(width * 0.4)))

    const footer = (
      <Box flexDirection="column" marginTop={1}>
        <Text dimColor>✓ 只在下一步真正开始、或 Claude 核对确认后才打勾；中断后发下一条消息，接着这份清单，不重新估算。</Text>
        <Text dimColor>Esc 或 {TOGGLE_KEY} 关闭（面板开着时 Esc 只关面板，不会中断 Claude）</Text>
      </Box>
    )
    if (!t) {
      return (
        <Box flexDirection="column" paddingX={1}>
          <Text>还没有任务记录。Claude 开始干活后，这里会显示步骤。</Text>
          {footer}
        </Box>
      )
    }

    const at = active(t)
    const doneCount = finishedCount(t)
    const parts = [`已 ${spent(elapsed(t, now))}`]
    if (t.ending === 'running') {
      if (at >= 0) parts.push(left(t, now) > 0 ? `约剩 ${duration(left(t, now))}` : '已超出预估', `第 ${at + 1}/${t.items.length} 步`)
      else parts.push(`${t.tools} 次工具调用`)
      if (t.isBusy && t.items.length > 0) parts.push('Claude 正在核对进度…')
    } else {
      parts.unshift(endingLabel(t.ending, t.isFinalChecking))
      parts.push(`完成 ${doneCount}/${t.items.length} 步`)
      if (t.ending === 'unchecked') parts.push('没能让 Claude 确认，按 c 重试')
      else if (t.ending !== 'done' && !t.isFinalChecking) parts.push('下一条消息接着这份清单')
    }

    const stepRow = (it: Item, n: number) => {
      const isNow = it.status === 'active'
      const isLive = isNow && t.ending === 'running'
      const mark = it.status === 'done' ? '✓' : it.status === 'skipped' ? '–' : isNow ? '▶' : '○'
      const markColor = it.status === 'done' ? 'success' : isNow ? 'autoAccept' : undefined
      const inStep = (t.ending === 'running' ? now : t.pausedAt) - it.startedAt
      const calls = it.tools > 0 ? ` · ${it.tools} 次调用` : ''
      let note
      if (it.status === 'done') note = it.isUntimed ? '已完成（核对确认）' : `${spent(it.endedAt - it.startedAt)}（预计 ${duration(it.minutes)}）${calls}`
      else if (it.status === 'skipped') note = '后来不需要了（核对确认）'
      else if (isNow) note = `${spent(inStep)} / 预计 ${duration(it.minutes)}${calls}${isLive ? '' : ' · 已暂停'}`
      else note = `预计 ${duration(it.minutes)}`
      return (
        <Box flexDirection="column" key={`step-${n}`}>
          <Box flexDirection="row" gap={1}>
            <Text color={markColor} bold={isNow}>
              {mark}
            </Text>
            <Box width={2}>
              <Text dimColor={!isNow}>{String(n + 1)}</Text>
            </Box>
            <Box width={titleWidth}>
              <Text bold={isNow} dimColor={it.status === 'done' || it.status === 'skipped'} strikethrough={it.status === 'skipped'}>
                {it.title}
              </Text>
            </Box>
            {isNow && <Text color="autoAccept">{bar(inStep, it.minutes * MINUTE, 5)}</Text>}
            <Text dimColor>{note}</Text>
          </Box>
          {isLive && t.activity !== '' && (
            <Box paddingLeft={5}>
              <Text color="ide">└ {t.activity}</Text>
            </Box>
          )}
        </Box>
      )
    }

    return (
      <Box flexDirection="column" paddingX={1}>
        <Box flexDirection="row" gap={1}>
          <Text color="autoAccept" bold>
            任务
          </Text>
          <Text>{taskTitle(t.text)}</Text>
        </Box>
        <Box flexDirection="row" gap={1} marginBottom={1}>
          <Text dimColor>{parts.join(' · ')}</Text>
          {t.items.length > 0 && <Text color="autoAccept">{bar(doneCount, t.items.length)}</Text>}
        </Box>
        {t.items.map(stepRow)}
        {t.items.length === 0 && (
          <Box flexDirection="column">
            <Text dimColor>
              {t.isBusy
                ? '正在估算步骤，几秒后出现清单…'
                : t.isWaitingFirstReply
                  ? '等 Claude 第一次回复后估算'
                  : '还没有步骤估算（跑满 3 分钟或按 ctrl+x p 时估算）'}
            </Text>
            {t.ending === 'running' && t.activity !== '' && <Text color="ide">└ {t.activity}</Text>}
          </Box>
        )}
        {t.items.length > 0 && (
          <Box flexDirection="row" gap={2} marginTop={1}>
            <Button key="recheck" plain hotkey="c" onPress={() => void recheck($, t)}>
              让 Claude 重新核对
            </Button>
            {t.ending !== 'running' && t.ending !== 'done' && (
              <Button key="finish" plain hotkey="d" onPress={() => finishByHand($, t)}>
                整份标为完成
              </Button>
            )}
          </Box>
        )}
        {footer}
      </Box>
    )
  })