pr-pane

1import { atom, read, update } from 'claude-code'
2import type { EngineInterface, Register } from 'claude-code'
3
4import type { SortBy, View } from '../types'
5import { COLOR, GLYPH, QUERY, SHORT, THREADS_QUERY, counts, parse, row, sorted } from './prs'
6import type { PullRequestNode, ThreadPage } from './prs'
7
8const REFRESH_MS = 60_000
9const view = atom({ plugin: 'pr-pane', key: 'view' } as const, { prs: [], total: 0 } as View)
10const visible = atom({ plugin: 'pr-pane', key: 'visible' } as const, false)
11const sort = atom({ plugin: 'pr-pane', key: 'sort' } as const, 'status' as SortBy)
12const page = atom({ plugin: 'pr-pane', key: 'page' } as const, 0)
13
14const gh = async ($: EngineInterface, args: string[], failure: string): Promise<string> => {
15  const ran = await $.process
16    .run(['gh', ...args], { timeoutMs: 20_000 })
17    .catch(() => undefined)
18  if (!ran) throw new Error('gh could not run (not installed, or no answer in 20s): install the GitHub CLI, then run `gh auth login`')
19  if (ran.exitCode !== 0) throw new Error(`${failure}: ${ran.stderr.trim().split('\n')[0]}`)
20  return ran.stdout
21}
22
23let isBusy = false
24
25const refresh = async ($: EngineInterface): Promise<void> => {
26  if (isBusy) return
27  isBusy = true
28  try {
29    const login = (
30      await gh($, ['api', 'user', '--jq', '.login'], 'gh is not authenticated, run `gh auth login`')
31    ).trim()
32    const out = await gh($, ['api', 'graphql', '-f', `query=${QUERY}`], 'gh could not list PRs')
33    const response = JSON.parse(out)
34    for (const n of response.data.search.nodes as (PullRequestNode | null)[]) {
35      if (!n || n.isDraft || n.reviewDecision === 'CHANGES_REQUESTED') continue
36      let threads = n.reviewThreads
37      while (!threads.nodes.some(t => t?.isResolved === false) && threads.pageInfo.hasNextPage) {
38        const after = threads.pageInfo.endCursor
39        if (!after) throw new Error('GitHub returned an incomplete review thread page')
40        const more = await gh($, ['api', 'graphql', '-f', `query=${THREADS_QUERY}`, '-f', `id=${n.id}`, '-f', `after=${after}`], 'gh could not list review threads')
41        const next = JSON.parse(more).data?.node?.reviewThreads as ThreadPage | undefined
42        if (!next || (next.pageInfo.hasNextPage && next.pageInfo.endCursor === after)) {
43          throw new Error('GitHub returned an incomplete review thread page')
44        }
45        threads = next
46      }
47      n.reviewThreads = threads
48    }
49    const prs = parse(JSON.stringify(response))
50    const count = response.data.search.issueCount as number
51    const updatedAt = await $.clock.now()
52    await update($, view, () => ({ login, prs, total: count, updatedAt }))
53  } catch (err) {
54    const error = err instanceof Error ? err.message : String(err)
55    await update($, view, v => ({ ...v, error }))
56  } finally {
57    isBusy = false
58  }
59}
60
61// ponytail: macOS `open`, then Linux `xdg-open`; no Windows.
62const openUrl = async ($: EngineInterface, url: string): Promise<void> => {
63  if (!url.startsWith('https://')) return
64  for (const bin of ['open', 'xdg-open']) {
65    const ran = await $.process.run([bin, url]).catch(() => undefined)
66    if (ran?.exitCode === 0) return
67  }
68  $.ui.toast(`Could not open ${url}`)
69}
70
71export const register: Register = on => {
72  on('session.start', async ($, e, next) => {
73    const marker = await $.env.get('MOD_FORGE_MARKER')
74    if (marker) await $.fs.write(marker, 'loaded')
75    await $.command.register({ name: 'prs', description: 'Toggle open pull requests above the prompt' })
76    $.ui.status(undefined)
77    const started = await next(e)
78    void refresh($)
79    $.clock.every(REFRESH_MS, () => void refresh($))
80    return started
81  })
82
83  on('command.run', { command: 'prs' }, async $ => {
84    const isVisible = !(await read($, visible))
85    await update($, visible, () => isVisible)
86    if (isVisible) void refresh($)
87    return { text: isVisible ? 'PR list shown above the prompt.' : 'PR list hidden.' }
88  })
89
90  on('ui.render', { component: 'AbovePrompt' }, async ($, e, next) => {
91    if (e.props.hasSurvey || !(await read($, visible))) return next(e)
92    const theirs = await next(e)
93    const t = $.ui.resolve(e)
94    const { Box, Text, Button } = t
95    const v = await read($, view)
96    const by = await read($, sort)
97    const prs = sorted(v.prs, by)
98    const size = Math.max(1, Math.min(8, e.props.maxRows - 7 - (v.error ? 1 : 0)))
99    const pages = Math.max(1, Math.ceil(prs.length / size))
100    const current = Math.min(await read($, page), pages - 1)
101    const shown = prs.slice(current * size, (current + 1) * size)
102    const movePage = async (to: number) => {
103      await update($, page, () => to)
104      const first = prs[to * size]
105      if (first) void $.ui.focus({ requestId: e.requestId, key: `pr:${first.url}` }).catch(() => undefined)
106    }
107    const changeSort = async (to: SortBy) => {
108      await update($, page, () => 0)
109      await update($, sort, () => to)
110    }
111    const at = v.updatedAt ? new Date(v.updatedAt).toTimeString().slice(0, 5) : undefined
112    const rule = '─'.repeat(Math.max(0, e.props.bodyColumns))
113    return (
114      <Box flexDirection="column">
115        <Text dimColor wrap="truncate-end">{rule}</Text>
116        <Text bold>
117          {v.login ? `@${v.login}` : 'GitHub'} · {v.total} open
118          {v.total > v.prs.length ? ` (showing ${v.prs.length})` : ''}
119          {at ? ` · updated ${at}` : ''}
120        </Text>
121        <Box>
122          {counts(v.prs).map(c => (
123            <Text color={COLOR[c.state]} dimColor={c.state === 'draft'}>
124              {GLYPH[c.state]} {c.n} {SHORT[c.state]}{'   '}
125            </Text>
126          ))}
127        </Box>
128        {v.error && <Text color="red">{v.error}</Text>}
129        {v.prs.length === 0 && !v.error && (
130          <Text dimColor>{v.updatedAt ? 'No open PRs.' : 'Loading...'}</Text>
131        )}
132        <Box columnGap={2}>
133          <Text dimColor>Sort:</Text>
134          {(['repo', 'status', 'date'] as const).map(mode => (
135            <Button key={`sort:${mode}`} plain hotkey={mode[0]} label={by === mode ? `[${mode}]` : mode} onPress={() => changeSort(mode)} />
136          ))}
137          <Text dimColor>{by === 'date' ? 'updated ↓' : 'updated ↓ within groups'}</Text>
138        </Box>
139        {shown.map((p, i) => (
140          <Box columnGap={1}>
141            <Button key={`pr:${p.url}`} plain label="›" autoFocus={i === 0 ? true : undefined} onPress={() => openUrl($, p.url)} />
142            <Text color={COLOR[p.state]} dimColor={p.state === 'draft'} wrap="truncate-end">{row(p, prs)}</Text>
143          </Box>
144        ))}
145        {prs.length > 0 && (
146          <Box columnGap={2}>
147            {current > 0 && <Button key="previous" plain hotkey="p" label="Previous" onPress={() => movePage(current - 1)} />}
148            <Text dimColor>Page {current + 1}/{pages}</Text>
149            {current + 1 < pages && <Button key="next" plain hotkey="n" label="Next" onPress={() => movePage(current + 1)} />}
150          </Box>
151        )}
152        <Text dimColor>Ctrl+X then Tab focuses · ↑/↓ or Tab move · Enter opens · r/s/d sort · p/n page · Esc prompt · /prs hides</Text>
153        <Text dimColor wrap="truncate-end">{rule}</Text>
154        {theirs}
155      </Box>
156    )
157  })
158}
159

1import type { Pr, PrState, SortBy } from '../types'
2
3export const LIMIT = 100  // GraphQL search page maximum
4
5// `gh search prs --json` has no review decision; GraphQL search does.
6export const QUERY = `query{search(query:"is:pr is:open author:@me archived:false sort:updated-desc",type:ISSUE,first:${LIMIT}){issueCount nodes{... on PullRequest{id number title url isDraft reviewDecision updatedAt repository{nameWithOwner} reviewThreads(first:${LIMIT}){nodes{isResolved} pageInfo{hasNextPage endCursor}}}}}}`
7
8export const THREADS_QUERY = `query($id:ID!,$after:String!){node(id:$id){... on PullRequest{reviewThreads(first:${LIMIT},after:$after){nodes{isResolved} pageInfo{hasNextPage endCursor}}}}}`
9
10export const stateOf = (isDraft: boolean, decision: string | null, hasFeedback = false): PrState =>
11  isDraft
12    ? 'draft'
13    : decision === 'CHANGES_REQUESTED' || hasFeedback
14      ? 'has feedback'
15      : decision === 'APPROVED'
16        ? 'approved'
17        : 'needs review'
18
19export type ThreadPage = {
20  nodes: ({ isResolved: boolean } | null)[]
21  pageInfo: { hasNextPage: boolean; endCursor: string | null }
22}
23
24export type PullRequestNode = {
25  id: string
26  number: number
27  title: string
28  url: string
29  isDraft: boolean
30  reviewDecision: string | null
31  updatedAt: string
32  repository: { nameWithOwner: string }
33  reviewThreads: ThreadPage
34}
35
36export const total = (stdout: string): number => JSON.parse(stdout).data.search.issueCount
37
38// Status sorting puts feedback first and drafts last.
39export const ORDER: readonly PrState[] = ['has feedback', 'approved', 'needs review', 'draft']
40
41export const parse = (stdout: string): Pr[] =>
42  (JSON.parse(stdout).data.search.nodes as (PullRequestNode | null)[])
43    .filter((n): n is PullRequestNode => n !== null && !!n.url)
44    .map(n => ({
45      repo: n.repository.nameWithOwner,
46      number: n.number,
47      title: n.title,
48      url: n.url,
49      state: stateOf(n.isDraft, n.reviewDecision, n.reviewThreads?.nodes?.some(t => t?.isResolved === false)),
50      updatedAt: n.updatedAt,
51    }))
52
53export const sorted = (prs: readonly Pr[], by: SortBy): Pr[] =>
54  [...prs].sort((a, b) =>
55    (by === 'repo' ? a.repo.localeCompare(b.repo) : by === 'status' ? ORDER.indexOf(a.state) - ORDER.indexOf(b.state) : 0)
56    || Date.parse(b.updatedAt) - Date.parse(a.updatedAt)
57    || a.repo.localeCompare(b.repo)
58    || a.number - b.number
59    || a.url.localeCompare(b.url),
60  )
61
62export const COLOR: Record<PrState, string | undefined> = {
63  'has feedback': 'red',
64  approved: 'blue',
65  'needs review': '#ffa500',
66  draft: undefined,
67}
68
69export const GLYPH: Record<PrState, string> = {
70  draft: '○',
71  'has feedback': '✗',
72  approved: '✓',
73  'needs review': '●',
74}
75
76export const SHORT: Record<PrState, string> = {
77  draft: 'draft',
78  'has feedback': 'comments/changes',
79  approved: 'approved',
80  'needs review': 'needs review',
81}
82
83export const counts = (prs: readonly Pr[]): { state: PrState; n: number }[] =>
84  ORDER.map(state => ({ state, n: prs.filter(p => p.state === state).length })).filter(c => c.n > 0)
85
86// The glyph carries the state (the header legend names it); the owner is dropped
87// unless two listed repos share a name.
88export const row = (p: Pr, all: readonly Pr[]): string => {
89  const name = p.repo.split('/')[1] ?? p.repo
90  const isAmbiguous = all.some(o => o.repo !== p.repo && o.repo.endsWith(`/${name}`))
91  return `${GLYPH[p.state]} ${isAmbiguous ? p.repo : name}#${p.number} ${p.title}`
92}
93

1export type PrState = 'draft' | 'has feedback' | 'approved' | 'needs review'
2
3export type SortBy = 'repo' | 'status' | 'date'
4
5export type Pr = { repo: string; number: number; title: string; url: string; state: PrState; updatedAt: string }
6
7export type View = {
8  login?: string
9  prs: Pr[]
10  total: number
11  updatedAt?: number
12  error?: string
13}
14
15declare module 'claude-code' {
16  interface PluginState {
17    'pr-pane': { view: View; visible: boolean; sort: SortBy; page: number }
18  }
19}
20