pr-comments

import type { Register } from 'claude-code'

// Drawn like pr-comments by aguiddir (pane, band, toast), as modscode read it from the mod's code:
// https://modscode.com/gallery/aguiddir-pr-comments/
// Written by modscode from that reading, not copied from the mod: use it as you like.
// Each value below stands for one the mod works out at run time; put in your own.
export const register: Register = on => {
  // the band above the prompt; what else goes there is drawn under it
  on('ui.render', { component: 'AbovePrompt' }, async ($, e, next) => {
    const { Box, Text, Button } = $.ui.resolve(e)
    const count = '…'
    const count2 = '…'
    const count3 = '…'
    const count4 = '…'
    const count5 = '…'
    const count6 = '…'
    return (
      <Box flexDirection="column">
        <Box>
          <Text wrap="truncate-end">
            <Text color="yellow">
              {"💬 "}
            </Text>
            <Text>
              <Text dimColor>
                à traiter
                {" "}
              </Text>
              <Text color="yellow">
                {" "}
                ▸
                {count}
              </Text>
              <Text color="yellow">
                {" "}
                ▸
                {count2}
              </Text>
              <Text color="yellow">
                {" "}
                ▸
                {count3}
              </Text>
              <Text dimColor>
                {" · "}
              </Text>
              <Text dimColor>
                en relecture
                {" "}
              </Text>
              <Text color="cyan">
                {" "}
                ▸
                {count4}
              </Text>
              <Text color="cyan">
                {" "}
                ▸
                {count5}
              </Text>
              <Text color="cyan">
                {" "}
                ▸
                {count6}
              </Text>
            </Text>
            {"  "}
          </Text>
          <Button label="ouvrir" hotkey="c" plain />
          <Text dimColor>
            {" ou /pr-review"}
          </Text>
        </Box>
        {await next(e)}
      </Box>
    )
  })

  // the pane: open it with $.ui.open({ id: 'my-pane', title: "Review" })
  on('ui.render', { component: 'Pane', requestId: 'my-pane' }, async ($, e) => {
    const { Box, Text, Link, Code, Markdown, Input, Button } = $.ui.resolve(e)
    const number = '…'
    const cleanTitle = '…'
    const count = '…'
    const count2 = '…'
    const count3 = '…'
    const count4 = '…'
    const count5 = '…'
    const count6 = '…'
    const n = '…'
    const shortWhere = '…'
    const excerpt = '…'
    const n2 = '…'
    const shortWhere2 = '…'
    const excerpt2 = '…'
    const n3 = '…'
    const shortWhere3 = '…'
    const excerpt3 = '…'
    const i = '…'
    const length = '…'
    const where = '…'
    const url = '…'
    const hunk = '…'
    const author = '…'
    const body = '…'
    const author2 = '…'
    const author3 = '…'
    const replyText = '…'
    const running = '…'
    return (
      <Box flexDirection="column">
        <Text wrap="truncate-end">
          <Text bold>
            PR #
            {number}
          </Text>
          {" "}
          {cleanTitle}
        </Text>
        <Text wrap="truncate-end" dimColor>
          branche courante
        </Text>
        <Text wrap="truncate-end">
          <Text>
            <Text dimColor>
              à traiter
              {" "}
            </Text>
            <Text color="yellow">
              {" "}
              ▸
              {count}
            </Text>
            <Text color="yellow">
              {" "}
              ▸
              {count2}
            </Text>
            <Text color="yellow">
              {" "}
              ▸
              {count3}
            </Text>
            <Text dimColor>
              {" · "}
            </Text>
            <Text dimColor>
              en relecture
              {" "}
            </Text>
            <Text color="cyan">
              {" "}
              ▸
              {count4}
            </Text>
            <Text color="cyan">
              {" "}
              ▸
              {count5}
            </Text>
            <Text color="cyan">
              {" "}
              ▸
              {count6}
            </Text>
          </Text>
        </Text>
        <Box marginTop={1} flexDirection="column">
          <Text wrap="truncate-end">
            <Text color="cyan">
              ▸
              ◉
              {n}
              {" "}
              {shortWhere}
            </Text>
            <Text color="green">
              {" ↩ répondu"}
            </Text>
            <Text color="yellow" dimColor>
              {" obsolète"}
            </Text>
            <Text color="magenta">
              {" → Claude"}
            </Text>
            <Text dimColor>
              {"  "}
              {excerpt}
            </Text>
          </Text>
          <Text wrap="truncate-end">
            <Text color="cyan">
              ▸
              ◉
              {n2}
              {" "}
              {shortWhere2}
            </Text>
            <Text color="green">
              {" ↩ répondu"}
            </Text>
            <Text color="yellow" dimColor>
              {" obsolète"}
            </Text>
            <Text color="magenta">
              {" → Claude"}
            </Text>
            <Text dimColor>
              {"  "}
              {excerpt2}
            </Text>
          </Text>
          <Text wrap="truncate-end">
            <Text color="cyan">
              ▸
              ◉
              {n3}
              {" "}
              {shortWhere3}
            </Text>
            <Text color="green">
              {" ↩ répondu"}
            </Text>
            <Text color="yellow" dimColor>
              {" obsolète"}
            </Text>
            <Text color="magenta">
              {" → Claude"}
            </Text>
            <Text dimColor>
              {"  "}
              {excerpt3}
            </Text>
          </Text>
        </Box>
        <Text dimColor>
          ────────
        </Text>
        <Box>
          <Text bold>
            {"fil "}
            {`${i}1`}
            /
            {length}
          </Text>
          <Text dimColor wrap="truncate-start">
            {" "}
            {where}
            {" "}
          </Text>
          <Link href={`${url}`} label="↗ GitHub" />
        </Box>
        <Code format="diff" source={`${hunk}`} />
        <Box flexDirection="column" marginTop={1}>
          <Text color="yellow">
            @
            {author}
          </Text>
          <Markdown text={`${body}`} />
        </Box>
        <Box flexDirection="column" marginTop={1}>
          <Text color="yellow">
            @
            {author2}
          </Text>
          <Markdown text={`${body}`} />
        </Box>
        <Box flexDirection="column" marginTop={1}>
          <Text color="yellow">
            @
            {author3}
          </Text>
          <Markdown text={`${body}`} />
        </Box>
        <Box marginTop={1}>
          <Input label="Réponse : " value={`${replyText}`} submitLabel="publier" autoFocus />
        </Box>
        <Text dimColor>
          Entrée publie · Esc annule la réponse · les touches n, p… tapent dans le champ
        </Text>
        <Text color="cyan">
          {"… "}
          {running}
        </Text>
        <Text color="yellow">
          Le panneau n'a pas le clavier : ctrl+x tab ou un clic, et les touches marchent.
        </Text>
        <Box marginTop={1} flexWrap="wrap">
          <Button label="préc." hotkey="p" plain />
          <Text>
            {" "}
          </Text>
          <Button label="suiv." hotkey="n" plain />
          <Text>
            {" "}
          </Text>
          <Button label="PR suiv." hotkey="t" plain />
          <Text>
            {" "}
          </Text>
          <Button label="démarquer" hotkey="x" plain />
          <Text>
            {" "}
          </Text>
          <Button label="tout démarquer" hotkey="a" plain />
          <Text>
            {" "}
          </Text>
          <Button label={`corriger (${length})`} hotkey="f" plain />
          <Text>
            {" "}
          </Text>
          <Button label="répondre" hotkey="r" plain />
          <Text>
            {" "}
          </Text>
          <Button label="résoudre" hotkey="v" plain />
          <Text>
            {" "}
          </Text>
          <Button label="web" hotkey="o" plain />
          <Text>
            {" "}
          </Text>
          <Button label="fermer" hotkey="q" plain role="dismiss" />
        </Box>
      </Box>
    )
  })

  on('session.start', async ($, e, next) => {
    const label = '…'
    await $.ui.toast(`✗ ${label} : échec (gh)`)
    await $.ui.toast(`pr-comments : /pr-review indisponible, utilise c`)
    return next(e)
  })
}