changes-pane

1import { atom, read, update } from 'claude-code'
2import type { Register } from 'claude-code'
3
4import type { Change } from '../types'
5
6const PANE = 'changes'
7const files = atom({ plugin: 'changes-pane', key: 'files' } as const, [])
8
9const lineCount = (text: string) => (text === '' ? 0 : text.split('\n').length)
10
11// Newest change first; a file edited again moves to the top with its counts summed.
12export function record(list: readonly Change[], path: string, added: number, removed: number): Change[] {
13  const before = list.find(one => one.path === path)
14  const merged: Change = {
15    path,
16    added: (before?.added ?? 0) + added,
17    removed: (before?.removed ?? 0) + removed,
18    edits: (before?.edits ?? 0) + 1,
19  }
20  return [merged, ...list.filter(one => one.path !== path)].slice(0, 500)
21}
22
23export const register: Register = (on, options) => {
24  on('session.start', async ($, e, next) => {
25    await $.command.register({ name: 'changes', description: 'Show the files Claude changed this session' })
26    return next(e)
27  })
28
29  on('command.run', { command: 'changes' }, async $ => {
30    await $.ui.open({ id: PANE, title: 'Changed files' })
31    const list = await read($, files)
32    return { text: `${list.length} file(s) changed this session.` }
33  })
34
35  // Each file tool: run the call, record it only if it went through.
36  on('tool.call', { tool: 'Edit' }, async ($, e, next) => {
37    const ran = await next(e)
38    if (ran.deny !== undefined || ran.isError === true) return ran
39    const isFirst = (await read($, files)).length === 0
40    await update($, files, list => record(list, e.file_path, lineCount(e.new_string), lineCount(e.old_string)))
41    if (isFirst && options.autoOpen !== false) $.ui.open({ id: PANE, title: 'Changed files' }).catch(() => undefined)
42    return ran
43  })
44
45  on('tool.call', { tool: 'Write' }, async ($, e, next) => {
46    const ran = await next(e)
47    if (ran.deny !== undefined || ran.isError === true) return ran
48    const isFirst = (await read($, files)).length === 0
49    await update($, files, list => record(list, e.file_path, lineCount(e.content), 0))
50    if (isFirst && options.autoOpen !== false) $.ui.open({ id: PANE, title: 'Changed files' }).catch(() => undefined)
51    return ran
52  })
53
54  on('tool.call', { tool: 'NotebookEdit' }, async ($, e, next) => {
55    const ran = await next(e)
56    if (ran.deny !== undefined || ran.isError === true) return ran
57    await update($, files, list => record(list, e.notebook_path, lineCount(e.new_source), 0))
58    return ran
59  })
60
61  on('ui.render', { component: 'Pane', requestId: PANE }, async ($, e) => {
62    const { Box, Text, Button } = $.ui.resolve(e)
63    const list = await read($, files)
64    const cwd = await $.session.cwd()
65    const room = Math.max(1, (e.viewport?.rows ?? 24) - 6)
66    const added = list.reduce((sum, one) => sum + one.added, 0)
67    const removed = list.reduce((sum, one) => sum + one.removed, 0)
68
69    if (list.length === 0) return <Text dimColor>No files changed yet this session.</Text>
70
71    return (
72      <Box flexDirection="column">
73        <Box gap={1}>
74          <Text bold>{list.length} files</Text>
75          <Text color="diffAdded">+{added}</Text>
76          <Text color="diffRemoved">-{removed}</Text>
77        </Box>
78        {list.slice(0, room).map(one => (
79          <Box gap={1}>
80            <Text color="diffAdded">+{one.added}</Text>
81            <Text color="diffRemoved">-{one.removed}</Text>
82            <Text wrap="truncate-start">{one.path.startsWith(cwd + '/') ? one.path.slice(cwd.length + 1) : one.path}</Text>
83          </Box>
84        ))}
85        {list.length > room && <Text dimColor>…and {list.length - room} more</Text>}
86        <Button key="clear" label="Clear" onPress={() => update($, files, () => [])} />
87      </Box>
88    )
89  })
90}
91

1export type Change = { path: string; added: number; removed: number; edits: number }
2
3declare module 'claude-code' {
4  interface PluginState {
5    'changes-pane': { files: Change[] }
6  }
7}
8