PR Pane

1import { atom, read, update } from 'claude-code'
2import type { EngineInterface, PluginOptions, Register } from 'claude-code'
3
4import type { BranchState, PrRow } from '../types'
5import { codexState, isContained, summarizeChecks, type Check, type SearchItem } from '../src/github'
6import { binaryCandidates } from '../src/shared/bin'
7import { PrChip, prChip } from '../ui/chip'
8import { PrPane } from '../ui/pane'
9import { isOn, OFF_TEXT, parseState, statePath } from '../src/shared/toggle'
10import { barIsLive, sameChip, type Chip, type ChipPress } from '../src/shared/chip'
11
12const MOD = 'pr-pane'
13const CHECK_MS = 5000
14const active = atom({ plugin: 'pr-pane', key: 'active' } as const, false)
15let checkedAt = 0
16
17async function isActive($: EngineInterface) {
18  if (Date.now() - checkedAt > CHECK_MS) {
19    checkedAt = Date.now()
20    const home = await $.env.get('HOME').catch(() => undefined)
21    const text = await $.fs.read(statePath(home)).catch(() => '')
22    const on = isOn(parseState(text), MOD)
23    await update($, active, prev => (prev === on ? prev : on))
24  }
25  return read($, active)
26}
27
28const chip = atom({ plugin: 'pr-pane', key: 'chip' } as const, null)
29
30async function barOwnsChips($: EngineInterface) {
31  const { value } = await $.state.get({ plugin: 'mod-manager', key: 'bar' })
32  return barIsLive(value, Date.now())
33}
34
35async function setChip($: EngineInterface, next: Chip | null) {
36  await update($, chip, prev => (sameChip(prev, next) ? prev : next))
37}
38
39const PANE_ID = 'pr-pane'
40const CONCURRENCY = 4
41
42const rows = atom({ plugin: 'pr-pane', key: 'rows' } as const, [])
43const isOpen = atom({ plugin: 'pr-pane', key: 'isOpen' } as const, false)
44const isLoading = atom({ plugin: 'pr-pane', key: 'isLoading' } as const, false)
45const updatedAt = atom({ plugin: 'pr-pane', key: 'updatedAt' } as const, 0)
46const lastError = atom({ plugin: 'pr-pane', key: 'error' } as const, '')
47
48type Settings = { integrationBranch: string; codexBot: string; refreshMs: number; limit: number; ghPath: string }
49
50function readSettings(options: PluginOptions): Settings {
51  return {
52    integrationBranch: String(options.integrationBranch ?? 'staging').trim(),
53    codexBot: String(options.codexBotLogin ?? 'chatgpt-codex-connector[bot]'),
54    refreshMs: Math.max(1, Number(options.refreshMinutes ?? 5)) * 60_000,
55    limit: Math.max(1, Number(options.limit ?? 50)),
56    ghPath: String(options.ghPath ?? ''),
57  }
58}
59
60async function gh($: EngineInterface, settings: Settings, args: readonly string[]) {
61  for (const bin of binaryCandidates('gh', await $.env.get('HOME'), settings.ghPath)) {
62    try {
63      return await $.process.run([bin, ...args], { timeoutMs: 20_000 })
64    } catch {
65      continue
66    }
67  }
68  throw new Error('gh not found; install the GitHub CLI or set its path in /config')
69}
70
71async function ghJson<T>($: EngineInterface, settings: Settings, args: readonly string[]): Promise<T | undefined> {
72  const ran = await gh($, settings, args)
73  return ran.exitCode === 0 ? (JSON.parse(ran.stdout) as T) : undefined
74}
75
76async function integrationState($: EngineInterface, settings: Settings, repo: string, sha: string | undefined): Promise<BranchState> {
77  if (settings.integrationBranch === '' || !sha) return 'n/a'
78  const compared = await gh($, settings, ['api', `repos/${repo}/compare/${settings.integrationBranch}...${sha}`, '--jq', '.status'])
79  if (compared.exitCode !== 0) return 'n/a'
80  return isContained(compared.stdout) ? 'in' : 'out'
81}
82
83async function loadRow($: EngineInterface, settings: Settings, item: SearchItem): Promise<PrRow> {
84  const repo = item.repository.nameWithOwner
85  const n = String(item.number)
86  const bot = `select(.user.login == "${settings.codexBot}")`
87
88  const [view, reactions, reviews] = await Promise.all([
89    ghJson<{ headRefOid: string; statusCheckRollup: Check[] }>($, settings, ['pr', 'view', n, '-R', repo, '--json', 'headRefOid,statusCheckRollup']),
90    ghJson<string[]>($, settings, ['api', `repos/${repo}/issues/${n}/reactions`, '--jq', `[.[] | ${bot} | .content]`]),
91    ghJson<number>($, settings, ['api', `repos/${repo}/pulls/${n}/reviews`, '--jq', `[.[] | ${bot}] | length`]),
92  ])
93
94  return {
95    repo,
96    number: item.number,
97    title: item.title,
98    url: item.url,
99    isDraft: item.isDraft,
100    checks: summarizeChecks(view?.statusCheckRollup ?? []),
101    codex: codexState(reactions ?? [], reviews ?? 0),
102    codexReviews: reviews ?? 0,
103    integration: await integrationState($, settings, repo, view?.headRefOid),
104  }
105}
106
107async function refresh($: EngineInterface, settings: Settings) {
108  if (await read($, isLoading)) return
109  await update($, isLoading, () => true)
110  try {
111    const found = await ghJson<SearchItem[]>($, settings, [
112      'search', 'prs', '--author', '@me', '--state', 'open', '--limit', String(settings.limit),
113      '--json', 'number,title,url,isDraft,repository',
114    ])
115    if (found === undefined) throw new Error('gh search prs failed; run `gh auth status`')
116
117    const loaded: PrRow[] = []
118    for (let i = 0; i < found.length; i += CONCURRENCY) {
119      loaded.push(...(await Promise.all(found.slice(i, i + CONCURRENCY).map(item => loadRow($, settings, item)))))
120    }
121    await update($, rows, () => loaded)
122    await update($, lastError, () => '')
123    await update($, updatedAt, () => Date.now())
124  } catch (err) {
125    await update($, lastError, () => (err instanceof Error ? err.message : String(err)))
126  } finally {
127    await update($, isLoading, () => false)
128  }
129}
130
131async function openPane($: EngineInterface, settings: Settings) {
132  const opened = await $.ui.open({ id: PANE_ID, title: 'PRs' })
133  if (opened.isPlaced) await update($, isOpen, () => true)
134  void refresh($, settings)
135}
136
137async function publishChip($: EngineInterface) {
138  await setChip($, (await read($, active)) ? prChip(await read($, rows)) : null)
139}
140
141export const register: Register = (on, options) => {
142  const settings = readSettings(options)
143
144  on('state.set', async ($, e, next) => {
145    const ran = await next(e)
146    if (e.plugin === 'mod-manager' && e.key === 'press') {
147      const pressed = e.value as ChipPress | null
148      if (pressed?.plugin === MOD && (await isActive($))) await openPane($, settings)
149    }
150    return ran
151  })
152
153  on('session.start', async ($, e, next) => {
154    void isActive($)
155    $.clock.every(CHECK_MS, () => void isActive($))
156    await $.command.register({ name: 'prs', description: 'Open the pull requests pane' })
157    void isActive($).then(enabled => (enabled ? refresh($, settings) : undefined))
158    $.clock.every(settings.refreshMs, () => void isActive($).then(enabled => (enabled ? refresh($, settings) : undefined)))
159
160    $.clock.every(CHECK_MS, () => void publishChip($).catch(() => undefined))
161    return next(e)
162  })
163
164  on('command.run', { command: 'prs' }, async $ => {
165    if (!(await isActive($))) return { text: OFF_TEXT }
166    await openPane($, settings)
167    return { text: 'PRs pane opened.' }
168  })
169
170  on('ui.close', async ($, e, next) => {
171    if (!(await isActive($))) return next(e)
172    if (e.id === PANE_ID) await update($, isOpen, () => false)
173    return next(e)
174  })
175
176  on('ui.render', { component: 'AbovePrompt' }, async ($, e, next) => {
177    if (!(await read($, active)) || (await barOwnsChips($))) return next(e)
178    const rest = await next(e)
179    const list = await read($, rows)
180    if (e.props.hasSurvey || (await read($, isOpen))) return rest
181
182    const ui = $.ui.resolve(e)
183    return (
184      <ui.Box flexDirection="column">
185        <PrChip ui={ui} rows={list} onOpen={() => openPane($, settings)} />
186        {rest}
187      </ui.Box>
188    )
189  })
190
191  on('ui.render', { component: 'Pane', requestId: PANE_ID }, async ($, e) => {
192    const ui = $.ui.resolve(e)
193    if (!(await read($, active))) {
194      return <ui.Box padding={1}><ui.Text color="#6272a4">{OFF_TEXT}</ui.Text></ui.Box>
195    }
196    return <PrPane
197      ui={ui}
198      rows={await read($, rows)}
199      isLoading={await read($, isLoading)}
200      error={await read($, lastError)}
201      updatedAt={await read($, updatedAt)}
202      integrationBranch={settings.integrationBranch}
203      onRefresh={() => refresh($, settings)}
204    />
205  })
206}
207

1import type { CheckState, CodexState } from '../types'
2
3export type Check = { status: string | null; conclusion: string | null; state: string | null }
4export type SearchItem = { number: number; title: string; url: string; isDraft: boolean; repository: { nameWithOwner: string } }
5
6const FAILED = ['FAILURE', 'ERROR', 'CANCELLED', 'TIMED_OUT', 'ACTION_REQUIRED']
7const WAITING = ['PENDING', 'EXPECTED', '']
8
9export function summarizeChecks(checks: readonly Check[]): CheckState {
10  if (checks.length === 0) return 'none'
11  const outcome = (c: Check) => (c.conclusion ?? c.state ?? '').toUpperCase()
12  if (checks.some(c => FAILED.includes(outcome(c)))) return 'fail'
13  if (checks.some(c => (c.status !== null && c.status !== 'COMPLETED') || WAITING.includes(outcome(c)))) return 'pending'
14  return 'pass'
15}
16
17export function codexState(reactions: readonly string[], reviews: number): CodexState {
18  if (reactions.includes('+1')) return 'clean'
19  if (reviews > 0) return 'findings'
20  if (reactions.includes('eyes')) return 'reviewing'
21  return 'none'
22}
23
24export function isContained(compareStatus: string) {
25  return ['behind', 'identical'].includes(compareStatus.trim())
26}
27

1const COMMON_DIRS = ['/opt/homebrew/bin', '/usr/local/bin', '/usr/bin']
2
3export function binaryCandidates(name: string, home: string | undefined, override?: string): string[] {
4  const homeDirs = home ? [`${home}/bin`, `${home}/.local/bin`] : []
5  return [override, name, ...[...COMMON_DIRS, ...homeDirs].map(dir => `${dir}/${name}`)].filter(
6    (bin): bin is string => typeof bin === 'string' && bin !== '',
7  )
8}
9

1import type { Elements, RenderSurface } from 'claude-code'
2
3import type { PrRow } from '../types'
4import type { Chip } from '../src/shared/chip'
5import { DRACULA } from '../src/shared/theme'
6
7type Ui = Elements[RenderSurface]
8
9export function PrChip({ ui, rows, onOpen }: { ui: Ui; rows: PrRow[]; onOpen: () => unknown }) {
10  const { Box, Text, Button } = ui
11  const failing = rows.filter(r => r.checks === 'fail').length
12  const findings = rows.filter(r => r.codex === 'findings').length
13
14  return (
15    <Box flexDirection="row" gap={1} alignItems="center" marginBottom={1}>
16      <Text color={DRACULA.purple} bold>⑂</Text>
17      <Button key="open-prs" label={rows.length === 0 ? 'PRs' : `PRs · ${rows.length}`} dimColor onPress={onOpen} />
18      {failing > 0 && <Text color={DRACULA.red}>✗ {failing} CI</Text>}
19      {findings > 0 && <Text color={DRACULA.orange}>⚠ {findings} Codex</Text>}
20    </Box>
21  )
22}
23
24export function prChip(rows: PrRow[]): Chip {
25  const failing = rows.filter(r => r.checks === 'fail').length
26  const findings = rows.filter(r => r.codex === 'findings').length
27  return {
28    icon: '⑂',
29    label: 'prs',
30    tone: 'accent',
31    parts: [
32      { text: rows.length === 0 ? 'open' : `${rows.length} open`, tone: 'text', action: 'open' },
33      ...(failing > 0 ? [{ text: `✗ ${failing} CI`, tone: 'bad' as const }] : []),
34      ...(findings > 0 ? [{ text: `⚠ ${findings} Codex`, tone: 'warn' as const }] : []),
35    ],
36  }
37}
38

1import type { Elements, RenderSurface } from 'claude-code'
2
3import type { BranchState, CheckState, PrRow } from '../types'
4import { DRACULA } from '../src/shared/theme'
5
6type Ui = Elements[RenderSurface]
7
8export type PrPaneProps = {
9  ui: Ui
10  rows: PrRow[]
11  isLoading: boolean
12  error: string
13  updatedAt: number
14  integrationBranch: string
15  onRefresh: () => unknown
16}
17
18export function PrPane({ ui, rows, isLoading, error, updatedAt, integrationBranch, onRefresh }: PrPaneProps) {
19  const { Box, Text, Button } = ui
20  const repos = [...new Set(rows.map(r => r.repo))]
21
22  return (
23    <Box flexDirection="column" backgroundColor={DRACULA.background} paddingX={1} paddingY={1}>
24      <Box flexDirection="row" alignItems="center" gap={1}>
25        <Text color={DRACULA.purple} bold>⑂ Pull requests</Text>
26        <Text color={DRACULA.comment}>{rows.length} open</Text>
27        <Box flexGrow={1} />
28        <Text color={DRACULA.comment}>
29          {isLoading ? 'refreshing…' : updatedAt > 0 ? `updated ${new Date(updatedAt).toTimeString().slice(0, 5)}` : ''}
30        </Text>
31        <Button key="refresh" label="Refresh" dimColor onPress={onRefresh} />
32      </Box>
33      {error !== '' && <Text color={DRACULA.red}>{error}</Text>}
34      {rows.length === 0 && !isLoading && error === '' && <Text color={DRACULA.comment} italic>No open PRs.</Text>}
35
36      {repos.map(repo => (
37        <Box flexDirection="column" marginTop={1}>
38          <Box backgroundColor={DRACULA.currentLine} paddingX={1}>
39            <Text color={DRACULA.pink} bold>{repo}</Text>
40          </Box>
41          {rows.filter(r => r.repo === repo).map(row => <PrRowView ui={ui} row={row} integrationBranch={integrationBranch} />)}
42        </Box>
43      ))}
44    </Box>
45  )
46}
47
48function PrRowView({ ui, row, integrationBranch }: { ui: Ui; row: PrRow; integrationBranch: string }) {
49  const { Box, Text, Link } = ui
50
51  return (
52    <Box key={`pr-${row.repo}-${row.number}`} flexDirection="column" paddingX={1} marginTop={1}>
53      <Box flexDirection="row" gap={1}>
54        <Text color={DRACULA.comment}>#{row.number}</Text>
55        {row.isDraft && <Text color={DRACULA.comment} italic>draft</Text>}
56        <Link href={row.url} label={row.title} />
57      </Box>
58      <Box flexDirection="row" gap={2} paddingLeft={2}>
59        <ChecksBadge ui={ui} state={row.checks} />
60        <CodexBadge ui={ui} row={row} />
61        <BranchBadge ui={ui} state={row.integration} branch={integrationBranch} />
62      </Box>
63    </Box>
64  )
65}
66
67function ChecksBadge({ ui, state }: { ui: Ui; state: CheckState }) {
68  const { Text } = ui
69  if (state === 'pass') return <Text color={DRACULA.green}>✓ CI</Text>
70  if (state === 'fail') return <Text color={DRACULA.red} bold>✗ CI</Text>
71  if (state === 'pending') return <Text color={DRACULA.yellow}>● CI</Text>
72  return <Text color={DRACULA.comment}>– CI</Text>
73}
74
75function CodexBadge({ ui, row }: { ui: Ui; row: PrRow }) {
76  const { Text } = ui
77  if (row.codex === 'clean') return <Text color={DRACULA.green}>👍 Codex</Text>
78  if (row.codex === 'findings') return <Text color={DRACULA.orange}>⚠ Codex {row.codexReviews}</Text>
79  if (row.codex === 'reviewing') return <Text color={DRACULA.yellow}>👀 Codex</Text>
80  return <Text color={DRACULA.comment}>– Codex</Text>
81}
82
83function BranchBadge({ ui, state, branch }: { ui: Ui; state: BranchState; branch: string }) {
84  const { Text } = ui
85  if (state === 'in') return <Text color={DRACULA.cyan}>✓ {branch}</Text>
86  if (state === 'out') return <Text color={DRACULA.comment}>○ {branch}</Text>
87  return undefined
88}
89

1export const MARKETPLACE = 'dracula-mods'
2export const STATE_FILE = '.claude/dracula-mods.json'
3export const OFF_TEXT = 'This mod is off. Turn it on in /mods.'
4
5export type ModsState = { enabled: Record<string, boolean> }
6
7export function statePath(home: string | undefined) {
8  return `${home ?? ''}/${STATE_FILE}`
9}
10
11export function parseState(text: string): ModsState {
12  try {
13    const parsed = JSON.parse(text) as Partial<ModsState>
14    return { enabled: typeof parsed.enabled === 'object' && parsed.enabled !== null ? parsed.enabled : {} }
15  } catch {
16    return { enabled: {} }
17  }
18}
19
20export function isOn(state: ModsState, name: string) {
21  return state.enabled[name] === true
22}
23
24export function withToggle(state: ModsState, name: string, on: boolean): ModsState {
25  return { enabled: { ...state.enabled, [name]: on } }
26}
27
28export function serializeState(state: ModsState) {
29  return `${JSON.stringify(state, null, 2)}\n`
30}
31

1import { DRACULA } from './theme'
2
3// The mod-manager draws every mod's chip in one bar; each mod publishes its chip as data
4export type ChipTone = 'text' | 'muted' | 'ok' | 'warn' | 'bad' | 'info' | 'accent'
5export type ChipPart = { text: string; tone: ChipTone; bold?: boolean; action?: string }
6export type Chip = { icon: string; label: string; tone: ChipTone; parts: ChipPart[] }
7export type ChipPress = { plugin: string; action: string; at: number }
8
9export const TONE_COLOR: Record<ChipTone, string> = {
10  text: DRACULA.foreground,
11  muted: DRACULA.comment,
12  ok: DRACULA.green,
13  warn: DRACULA.orange,
14  bad: DRACULA.red,
15  info: DRACULA.cyan,
16  accent: DRACULA.purple,
17}
18
19export function sameChip(a: Chip | null, b: Chip | null) {
20  return JSON.stringify(a) === JSON.stringify(b)
21}
22
23export const BAR_STALE_MS = 30_000
24
25export function barIsLive(beat: number | undefined, now: number) {
26  return typeof beat === 'number' && now - beat < BAR_STALE_MS
27}
28

1// Dracula palette: https://draculatheme.com/contribute#color-palette
2export const DRACULA = {
3  background: '#282a36',
4  currentLine: '#44475a',
5  foreground: '#f8f8f2',
6  comment: '#6272a4',
7  cyan: '#8be9fd',
8  green: '#50fa7b',
9  orange: '#ffb86c',
10  pink: '#ff79c6',
11  purple: '#bd93f9',
12  red: '#ff5555',
13  yellow: '#f1fa8c',
14} as const
15

1export type ChipTone = 'text' | 'muted' | 'ok' | 'warn' | 'bad' | 'info' | 'accent'
2export type ChipPart = { text: string; tone: ChipTone; bold?: boolean; action?: string }
3export type Chip = { icon: string; label: string; tone: ChipTone; parts: ChipPart[] }
4export type ChipPress = { plugin: string; action: string; at: number }
5
6export type CheckState = 'pass' | 'fail' | 'pending' | 'none'
7export type CodexState = 'clean' | 'findings' | 'reviewing' | 'none'
8export type BranchState = 'in' | 'out' | 'n/a'
9export type PrRow = {
10  repo: string
11  number: number
12  title: string
13  url: string
14  isDraft: boolean
15  checks: CheckState
16  codex: CodexState
17  codexReviews: number
18  integration: BranchState
19}
20
21declare module 'claude-code' {
22  interface PluginState {
23    'mod-manager': { bar: number; press: ChipPress | null }
24    'pr-pane': { active: boolean; rows: PrRow[]; isOpen: boolean; isLoading: boolean; updatedAt: number; error: string; chip: Chip | null }
25  }
26}
27