needs-you

  on('ui.render', { component: 'AbovePrompt' }, async ($, e, next) => {
    if (e.props.hasSurvey) return next(e)

    const open = await read($, items)
    const latest = e.props.isWorking ? null : await read($, reply)
    const asks = latest === null ? [] : open.filter(i => i.kind !== 'later')
    const later = open.filter(i => i.kind === 'later')
    const facts = await read($, git)
    const ran = await read($, checks)
    const current = await read($, now)
    const topic = await read($, tldr)
    if (open.length === 0 && latest === null && facts === null && topic === null) return next(e)

    const { Box, Button, Text } = $.ui.resolve(e)

    const fill = async (text: string) => {
      const box = await $.prompt.read()
      const isEmpty = box.text.trim() === ''
      await $.prompt.fill(
        isEmpty ? { text, mode: 'replace' } : { text: `\n${text}`, mode: 'append' },
      )
    }

    const start = async (command: string) => {
      const typed = (await $.prompt.read()).text.trim()
      const previous = COMMANDS.find(c => typed === c || typed.startsWith(`${c} `))
      const args = previous === undefined ? typed : typed.slice(previous.length).trim()
      await $.prompt.fill({ text: `${command} ${args}`, mode: 'replace' })
    }

    const dismiss = (item: Item) => (
      <Button
        key={`dismiss-${item.id}`}
        label="x"
        plain
        dimColor
        onPress={() => void update($, items, (list: Item[]) => list.filter(i => i.id !== item.id))}
      />
    )

    const replyButtons =
      latest === null
        ? []
        : [
            ...latest.options.map((o, i) => (
              <Button
                key={`opt-${i}`}
                label={o.label}
                hotkey={/^[1-9]$/.test(o.label) ? o.label : undefined}
                onPress={() => void fill(o.fill)}
              />
            )),
            ...(latest.draft === null
              ? []
              : [
                  <Button
                    key="copy"
                    label="Copy draft"
                    hotkey="c"
                    onPress={p => void $.ui.copy({ text: latest.draft!, surface: p.surface })}
                  />,
                ]),
          ]

    const gitParts: string[] = []
    if (facts !== null) {
      gitParts.push(facts.branch)
      if (facts.unpushed > 0) {
        gitParts.push(`${facts.unpushed} unpushed${facts.hasUpstream ? '' : ' (no upstream)'}`)
      }
      if (facts.uncommitted > 0) gitParts.push(`${facts.uncommitted} uncommitted`)
      if (facts.unpushed > 0) {
        gitParts.push(ran.audit ? 'audit ran' : 'audit not run')
        if (facts.needsSage) gitParts.push(ran.sage ? 'ohf-sage ran' : 'ohf-sage not run')
      }
    }

    return (
      <Box flexDirection="column">
        {topic !== null && (
          <Text dimColor wrap="truncate-end">
            TLDR: {topic}
          </Text>
        )}
        {asks.slice(-SHOWN).map(item => (
          <Box key={`ask-${item.id}`} flexDirection="row" gap={1}>
            <Text color="yellow" wrap="truncate-end">
              ● Needs you: {item.text}
              {minutesSince(item.at, current)}
            </Text>
            {dismiss(item)}
          </Box>
        ))}
        {asks.length > SHOWN && <Text dimColor>+{asks.length - SHOWN} older asks</Text>}
        {latest?.done != null && (
          <Text dimColor wrap="truncate-end">
            Done: {latest.done}
          </Text>
        )}
        {replyButtons.length > 0 && (
          <Box flexDirection="row" gap={1}>
            {replyButtons}
          </Box>
        )}
        {later.slice(-SHOWN).map(item => (
          <Box key={`later-${item.id}`} flexDirection="row" gap={1}>
            <Text color="magenta" wrap="truncate-end">
              ◆ Later: {item.text}
            </Text>
            {dismiss(item)}
          </Box>
        ))}
        {later.length > SHOWN && <Text dimColor>+{later.length - SHOWN} older later</Text>}
        {gitParts.length > 0 && (
          <Text dimColor wrap="truncate-end">
            {gitParts.join(' · ')}
          </Text>
        )}
        {!e.props.isWorking && (
          <Box flexDirection="row" gap={1}>
            {COMMANDS.map(command => (
              <Button
                key={`cmd-${command}`}
                label={command}
                dimColor
                onPress={() => void start(command)}
              />
            ))}
          </Box>
        )}
      </Box>
    )
  })