toast-inbox

1import { atom, read, update } from 'claude-code'
2import type { EngineInterface, Register } from 'claude-code'
3
4import type { InboxItem } from '../types'
5import { KEEP, asItems, asReadAt, commandsByMod, countByMod, inboxSvg, merge, modLabel, toItem, unreadCount, when } from './inbox'
6import { followTheme, mayWrite, readTheme, rememberVersion } from './style'
7
8type $ = EngineInterface
9
10const PANE = 'toast-inbox'
11const TITLE = '通知の受け箱'
12const DESCRIPTION = 'ほかの mod が出したトーストとステータス行を見返す'
13/** 溜めてから store に書くまでの待ち */
14const FLUSH_MS = 1000
15const ALL = '*'
16
17const ITEMS = atom({ plugin: 'toast-inbox', key: 'items' } as const, [] as InboxItem[])
18const READ_AT = atom({ plugin: 'toast-inbox', key: 'readAt' } as const, 0)
19const FILTER = atom({ plugin: 'toast-inbox', key: 'filter' } as const, '')
20const CONFIRM = atom({ plugin: 'toast-inbox', key: 'confirmClear' } as const, false)
21const COMMANDS = atom({ plugin: 'toast-inbox', key: 'commands' } as const, {} as Record<string, string>)
22const NOTICE = atom({ plugin: 'toast-inbox', key: 'notice' } as const, '')
23
24// /inbox を自分で取れたか (取れなければ /toast-inbox にして、/inbox は横取りしない)
25let ownsMain = false
26
27// まだ store に書いていない通知。1 ターンで大量に来ても、1 秒ごとに 1 回まとめて書く
28let pending: InboxItem[] = []
29let isScheduled = false
30// mod ごとの直前のステータス行 (同じ文の連続は 1 件にまとめる。消されたら忘れる)
31const lastStatus = new Map<string, string>()
32
33// store への書き込みは 1 本ずつ
34let chain: Promise<unknown> = Promise.resolve()
35const serial = <T,>(f: () => Promise<T>) => {
36  const p = chain.then(f, f)
37  chain = p.catch(() => {})
38  return p
39}
40
41const BROKEN = '通知の記録を読めなかったので、保存していません(上書きしないよう止めています)'
42const STALE = '新しい版が入ったので保存していません。VS Code を開き直してください'
43const SET_FAILED = '通知を保存できませんでした。次の通知の時にもう一度書きます'
44const STORE_NOTES = [BROKEN, STALE, SET_FAILED]
45
46/** store の値を読む。キーが無ければ空 (readAt は 0)。読めない時 (例外・形が違う) は undefined */
47async function readKey<T>($: $, key: string, as: (v: unknown) => T | undefined, empty: T): Promise<T | undefined> {
48  try {
49    const raw = await $.store.get(key)
50    return raw === undefined ? empty : as(raw)
51  } catch {
52    return undefined
53  }
54}
55
56// 書く直前に読み直し、溜めた分だけを足す (他のセッションが足した分を消さない)。
57// 読めない・古い版のまま・書けない時は書かずに、溜めた分を戻して次の通知の時にもう一度
58const flush = ($: $) =>
59  serial(async () => {
60    if (pending.length === 0) return
61    const batch = pending
62    pending = []
63    const putBack = async (text: string) => {
64      pending = merge(batch, pending)
65      await update($, NOTICE, () => text)
66    }
67    const saved = await readKey($, 'items', asItems, [])
68    if (!saved) return putBack(BROKEN)
69    if (!(await mayWrite($, await $.clock.now()))) return putBack(STALE)
70    const next = merge(saved, batch)
71    if (!(await $.store.set('items', next).then(() => true, () => false))) return putBack(SET_FAILED)
72    await update($, ITEMS, () => next)
73    await update($, NOTICE, n => (STORE_NOTES.includes(n) ? '' : n))
74  })
75
76async function note($: $, plugin: string, text: string | undefined, kind: InboxItem['kind']) {
77  const item = toItem(plugin, text, await $.clock.now(), kind)
78  if (!item) return
79  pending = merge(pending, [item])
80  if (isScheduled) return
81  isScheduled = true
82  $.clock.after(FLUSH_MS, () => {
83    isScheduled = false
84    void flush($).catch(() => {})
85  })
86}
87
88async function markRead($: $) {
89  await update($, CONFIRM, () => false)
90  const now = await $.clock.now()
91  await serial(async () => {
92    const saved = await readKey($, 'readAt', asReadAt, 0)
93    // 読めない・古い版のまま動いている時は、このセッションの中だけ既読にする
94    if (saved === undefined) {
95      await update($, READ_AT, r => Math.max(r, now))
96      return void (await update($, NOTICE, () => BROKEN))
97    }
98    const next = Math.max(saved, now)
99    await update($, READ_AT, () => next)
100    if (!(await mayWrite($, now))) return void (await update($, NOTICE, () => STALE))
101    await $.store.set('readAt', next).catch(() => update($, NOTICE, () => '既読を保存できませんでした'))
102  })
103}
104
105// 1 回目は確かめ、2 回目で空にする (他のセッションの分も消える)
106async function pressClear($: $) {
107  if (!(await read($, CONFIRM))) {
108    await update($, CONFIRM, () => true)
109    return
110  }
111  await update($, CONFIRM, () => false)
112  await serial(async () => {
113    if (!(await mayWrite($, await $.clock.now()))) return void (await update($, NOTICE, () => STALE))
114    pending = []
115    await update($, ITEMS, () => [])
116    await update($, FILTER, () => '')
117    await $.store.set('items', []).catch(() => {})
118  })
119}
120
121// どの mod がどのコマンドか。起動直後はまだ登録していない mod があるので、ペインを開くたびに引き直す
122async function loadCommands($: $) {
123  const map = commandsByMod(await $.command.list())
124  await update($, COMMANDS, () => map)
125}
126
127// 行を押した時。送るだけで、開くのはセッションが空いた時(mod-hub と同じ)
128async function openMod($: $, command: string) {
129  await update($, NOTICE, () => `/${command} を送りました(セッションが空いたら開きます)`)
130  try {
131    await $.command.run({ command })
132  } catch {
133    await update($, NOTICE, () => `/${command} を送れませんでした`)
134  }
135}
136
137const openPane = async ($: $) => {
138  // 保存できていない知らせは残す (開き直しても消えない)
139  await update($, NOTICE, n => (STORE_NOTES.includes(n) ? n : ''))
140  await loadCommands($).catch(() => {})
141  await $.ui.open({ id: PANE, title: TITLE })
142  return { text: '通知の受け箱を開きました。' }
143}
144
145export const register: Register = (on, options) => {
146  // ステータス行も残すか (既定はオフ。live-commentary のように 1 ターンに何十回も出す mod で埋まるので、トーストだけ残す)
147  const keepStatus = options.keepStatus === true
148  followTheme(on)
149
150  on('session.start', async ($, e, next) => {
151    const started = await next(e)
152    await rememberVersion($).catch(() => {})
153    const got = await $.command.register({ name: 'inbox', description: DESCRIPTION }).catch(() => undefined)
154    ownsMain = got?.command === 'inbox'
155    if (!ownsMain) await $.command.register({ name: 'toast-inbox', description: DESCRIPTION }).catch(() => {})
156    await readTheme($)
157    const items = await readKey($, 'items', asItems, [])
158    if (items) await update($, ITEMS, () => items.slice(-KEEP))
159    else await update($, NOTICE, () => BROKEN)
160    const readAt = asReadAt(await $.store.get('readAt').catch(() => undefined))
161    if (readAt !== undefined) await update($, READ_AT, () => readAt)
162    await loadCommands($).catch(() => {})
163    return started
164  })
165
166  // 閉じる前に溜めた分を書く
167  on('session.end', async ($, e, next) => {
168    await flush($).catch(() => {})
169    return next(e)
170  })
171
172  // 見るだけ。呼び出し元 (next.origin) を記録し、トーストはそのまま通す (記録を待たせない)
173  on('ui.toast', ($, e, next) => {
174    const shown = next(e)
175    void note($, next.origin.plugin, e.text, 'toast').catch(() => {})
176    return shown
177  }).catch(($, e, next) => next(e))
178
179  on('ui.status', ($, e, next) => {
180    const shown = next(e)
181    if (!keepStatus) return shown
182    const name = next.origin.plugin
183    if (e.text === undefined) lastStatus.delete(name)
184    else if (lastStatus.get(name) !== e.text) {
185      lastStatus.set(name, e.text)
186      void note($, name, e.text, 'status').catch(() => {})
187    }
188    return shown
189  }).catch(($, e, next) => next(e))
190
191  on('command.run', { command: 'inbox' }, ($, e, next) => (ownsMain ? openPane($) : next(e))).catch(($, e, next) => next(e))
192  // /inbox を持てた時は /toast-inbox を登録していないので、その名前の持ち主に回す
193  on('command.run', { command: 'toast-inbox' }, ($, e, next) => (ownsMain ? next(e) : openPane($))).catch(($, e, next) => next(e))
194
195  on('ui.render', { component: 'Pane', requestId: PANE }, async ($, e) => {
196    const t = $.ui.resolve(e)
197    const { Box, Text, Button } = t
198    const Svg = e.surface !== 'terminal' && 'Svg' in t ? t.Svg : undefined
199    const now = await $.clock.now()
200    const items = await read($, ITEMS)
201    const readAt = await read($, READ_AT)
202    const filter = await read($, FILTER)
203    const confirm = await read($, CONFIRM)
204    const commands = await read($, COMMANDS)
205    const notice = await read($, NOTICE)
206    const unread = unreadCount(items, readAt)
207    const mods = countByMod(items)
208    const isKnown = filter === '' || mods.some(m => m.name === filter)
209    const shown = items
210      .map((item, index) => ({ item, index }))
211      .filter(({ item }) => !isKnown || filter === '' || item.plugin === filter)
212      .reverse()
213    const line = `未読 ${unread} 件 / 全 ${items.length} 件`
214
215    return (
216      <Box flexDirection="column" gap={1}>
217        {Svg ? (
218          <Svg source={inboxSvg(items, readAt)} alt={`通知の受け箱 ${line}`} />
219        ) : (
220          <Box flexDirection="column">
221            <Text bold>{`通知の受け箱 ${line}`}</Text>
222            {mods.map(m => (
223              <Text key={`count:${m.name}`} dimColor>{`${modLabel(m.name)} ${m.count} 件`}</Text>
224            ))}
225          </Box>
226        )}
227        {items.length > 0 && 'Select' in t && (
228          <t.Select
229            key="filter"
230            label="mod で絞る"
231            value={isKnown && filter !== '' ? filter : ALL}
232            options={[{ value: ALL, label: `すべて (${items.length})` }, ...mods.map(m => ({ value: m.name, label: `${modLabel(m.name)} (${m.count})` }))]}
233            onSelect={v => update($, FILTER, () => (v === ALL ? '' : v))}
234          />
235        )}
236        {items.length > 0 && (
237          <Box flexDirection="row" flexWrap="wrap" columnGap={1}>
238            <Button key="mark-read" dimColor={unread === 0} label="全部既読にする" variant={unread > 0 ? 'primary' : undefined} onPress={() => markRead($)} />
239            <Button key="clear" dimColor={!confirm} label={confirm ? 'もう一度押すと空にします' : '空にする'} onPress={() => pressClear($)} />
240          </Box>
241        )}
242        {items.length === 0 && <Text dimColor>{`まだ通知はありません。ほかの mod が${keepStatus ? 'トーストやステータス行' : 'トースト'}を出すと、ここに残ります`}</Text>}
243        {notice !== '' && (
244          <Text key="notice" dimColor>
245            {notice}
246          </Text>
247        )}
248        {shown.map(({ item, index }) => {
249          const isUnread = item.at > readAt
250          const lead = `${isUnread ? '未読 ' : ''}${when(item.at, now)} ${modLabel(item.plugin)}`
251          const tail = item.kind === 'status' ? ' (ステータス)' : ''
252          // 出した mod のコマンドが分かる行だけ押せる。本体と、今は入っていない mod の行は文字のまま
253          const command = Object.hasOwn(commands, item.plugin) ? commands[item.plugin] : undefined
254          return (
255            <Box key={`item:${index}:${item.at}`} flexDirection="column">
256              {command === undefined ? (
257                <Text key={`head:${index}`} color={isUnread ? 'warning' : undefined} dimColor={!isUnread}>
258                  {`${lead}${tail}`}
259                </Text>
260              ) : (
261                <Button key={`open:${index}`} label={`${lead} を開く${tail}`} onPress={() => openMod($, command)} />
262              )}
263              <Text>{item.text}</Text>
264            </Box>
265          )
266        })}
267      </Box>
268    )
269  })
270}
271

1// 通知の受け箱の純関数(記録の形・まとめ方・時刻・SVG)
2import type { InboxItem } from '../types'
3import { C, HEADER_H, W, clean, esc, frame, growBar, header, short } from './style'
4
5export const SELF = 'toast-inbox'
6/** 残す件数 */
7export const KEEP = 100
8/** 本文の長さの上限 */
9const MAX_TEXT = 300
10
11/** mod の名前。マーケットプレイスから入れた物の `@<market>` は落とす */
12export const modName = (plugin: string) => clean(plugin.split('@')[0] ?? '') || '不明'
13
14/** 画面に出す名前。本体の通知は「本体」 */
15export const modLabel = (name: string) => (name === 'engine' ? '本体' : name)
16
17/** 拾った通知を記録 1 件にする。自分の物と空の文は記録しない */
18export function toItem(plugin: string, text: string | undefined, at: number, kind: InboxItem['kind']): InboxItem | undefined {
19  const name = modName(plugin)
20  const body = short(clean(text ?? ''), MAX_TEXT)
21  if (name === SELF || body === '') return undefined
22  return { plugin: name, text: body, at, kind }
23}
24
25/** store から読んだ値を確かめる(形の合わない物は捨てる)。配列でなければ undefined */
26export function asItems(v: unknown): InboxItem[] | undefined {
27  if (!Array.isArray(v)) return undefined
28  return v
29    .filter(
30      (i): i is InboxItem =>
31        typeof i === 'object' &&
32        i !== null &&
33        typeof i.plugin === 'string' &&
34        typeof i.text === 'string' &&
35        typeof i.at === 'number' &&
36        (i.kind === 'toast' || i.kind === 'status'),
37    )
38    // 知らない欄 (新しい版が足した欄) は残す。件数で切るのは足す時 (merge) と画面に出す時だけ
39    .map(i => ({ ...i, plugin: modName(i.plugin), text: clean(i.text), at: i.at, kind: i.kind }))
40}
41
42export const asReadAt = (v: unknown) => (typeof v === 'number' && Number.isFinite(v) ? v : undefined)
43
44/** 保存済みの物に、このセッションで溜めた分を足す(古い順、最新 KEEP 件) */
45export const merge = (saved: readonly InboxItem[], pending: readonly InboxItem[]) => [...saved, ...pending].slice(-KEEP)
46
47/**
48 * mod ごとに、行を押した時に開くコマンドを決める($.command.list() の plugin 欄で引く)。
49 * 1 つの mod に複数あれば、mod と同じ名前の物(予備の名前。どの mod でもペインを開く)、無ければ一覧で先に出る物。
50 * 本体と自分は入れない
51 */
52export function commandsByMod(list: readonly { name: string; source: string; plugin?: string }[]): Record<string, string> {
53  const out: Record<string, string> = {}
54  for (const c of list) {
55    if (c.source !== 'plugin' || c.plugin === undefined) continue
56    const mod = modName(c.plugin)
57    if (mod === SELF || mod === 'engine') continue
58    const name = clean(c.name)
59    if (name !== '' && (out[mod] === undefined || name === mod)) out[mod] = name
60  }
61  return out
62}
63
64export const unreadCount =(items: readonly InboxItem[], readAt: number) => items.filter(i => i.at > readAt).length
65
66/** mod ごとの件数(多い順、同じなら名前順) */
67export function countByMod(items: readonly InboxItem[]) {
68  const m = new Map<string, number>()
69  for (const i of items) m.set(i.plugin, (m.get(i.plugin) ?? 0) + 1)
70  return [...m].map(([name, count]) => ({ name, count })).sort((a, b) => b.count - a.count || a.name.localeCompare(b.name))
71}
72
73const jst = (ms: number) => new Date(ms + 9 * 3600_000)
74const pad = (n: number) => String(n).padStart(2, '0')
75
76/** 日本時間の HH:MM。今日でなければ M/D を前に付ける */
77export function when(at: number, now: number) {
78  const d = jst(at)
79  const hm = `${pad(d.getUTCHours())}:${pad(d.getUTCMinutes())}`
80  return d.toISOString().slice(0, 10) === jst(now).toISOString().slice(0, 10) ? hm : `${d.getUTCMonth() + 1}/${d.getUTCDate()} ${hm}`
81}
82
83const ROW = 24
84const MAX_ROWS = 8
85
86/** 見出し(未読の数)と mod ごとの件数の小さな横棒 */
87export function inboxSvg(items: readonly InboxItem[], readAt: number) {
88  const unread = unreadCount(items, readAt)
89  const mods = countByMod(items).slice(0, MAX_ROWS)
90  const max = Math.max(1, ...mods.map(m => m.count))
91  const top = HEADER_H + 12
92  const barX = 130
93  const barW = W - barX - 50
94  const rows = mods.map((m, k) => {
95    const y = top + k * ROW
96    const fresh = unreadCount(
97      items.filter(i => i.plugin === m.name),
98      readAt,
99    )
100    return [
101      `<text x="14" y="${y + 13}" font-size="12" fill="${C.text}">${esc(short(modLabel(m.name), 16))}</text>`,
102      `<rect x="${barX}" y="${y + 3}" width="${barW}" height="12" rx="3" fill="${C.face}"/>`,
103      growBar(barX, y + 3, (barW * m.count) / max, 12, C.blue, k * 0.05),
104      fresh > 0 ? growBar(barX, y + 3, (barW * fresh) / max, 12, C.yellow, 0.3 + k * 0.05) : '',
105      `<text x="${W - 14}" y="${y + 13}" font-size="12" fill="${C.dim}" text-anchor="end">${m.count}</text>`,
106    ].join('')
107  })
108  const body =
109    mods.length === 0
110      ? `<text x="14" y="${top + 14}" font-size="12" fill="${C.dim}">まだ通知はありません</text>`
111      : rows.join('') +
112        `<text x="14" y="${top + mods.length * ROW + 12}" font-size="12" fill="${C.dim}">黄色は未読、青は既読も含めた件数</text>`
113  const h = top + Math.max(1, mods.length) * ROW + (mods.length === 0 ? 8 : 22)
114  return frame(h, header('通知の受け箱', `未読 ${unread} 件 / 全 ${items.length} 件`, C.yellow) + body)
115}
116

1// 全 mod で共通の見た目(色・見出し・動き)と小物。
2// 正本は shared/style.ts。各 mod の hooks/style.ts はその写しなので、直すのは正本だけにして
3// `node tools/copy_shared.mts` で写す(`--check` で写しのずれを見つける)。
4import type { EngineInterface, On } from 'claude-code'
5
6export type Palette = {
7  bg: string
8  face: string
9  line: string
10  text: string
11  dim: string
12  weak: string
13  blue: string
14  green: string
15  yellow: string
16  red: string
17  purple: string
18  orange: string
19}
20
21/** GitHub Dark 系(docs/mod-guide.md の 7 節) */
22export const DARK: Palette = {
23  bg: '#0d1117',
24  face: '#161b22',
25  line: '#30363d',
26  text: '#c9d1d9',
27  dim: '#8b949e',
28  weak: '#8b949e',
29  blue: '#58a6ff',
30  green: '#3fb950',
31  yellow: '#d29922',
32  red: '#f85149',
33  purple: '#bc8cff',
34  orange: '#f78166',
35}
36
37/** GitHub Light 系 */
38export const LIGHT: Palette = {
39  bg: '#ffffff',
40  face: '#f6f8fa',
41  line: '#d0d7de',
42  text: '#1f2328',
43  dim: '#656d76',
44  weak: '#656d76',
45  blue: '#0969da',
46  green: '#1a7f37',
47  yellow: '#9a6700',
48  red: '#cf222e',
49  purple: '#8250df',
50  orange: '#bc4c00',
51}
52
53// ponytail: 今の色はモジュールの変数 1 個(この mod の中だけ)。SVG を作る関数は C.bg などを呼ぶたびに読むので、
54// 引数を増やさずにテーマが変わる。描く途中で切り替わることは無い(JS は 1 本で走る)
55/** 今の色。setTheme で中身が入れ替わる(同じ物を指し続けるので、import した C のままでよい) */
56export const C: Palette = { ...DARK }
57let isLightNow = false
58
59export const isLight = () => isLightNow
60
61/** /config の theme の値が明るい系か('light'・'light-daltonized'・'light-ansi' など) */
62export const isLightTheme = (value: unknown) => typeof value === 'string' && value.startsWith('light')
63
64export function setTheme(light: boolean) {
65  isLightNow = light
66  Object.assign(C, light ? LIGHT : DARK)
67}
68
69/**
70 * 今の /config の theme を読んで色を合わせる。mod 自身の session.start の中で呼ぶ
71 * (同じイベントに matcher 無しのフックを 2 つ置くと読み込みを拒まれるので、ここでは on しない)。
72 * VS Code の配色は mod から読めないので、Claude Code の theme が light 系の時だけ明るくなる
73 */
74export async function readTheme($: EngineInterface) {
75  const rows = await $.config.list().catch(() => [])
76  setTheme(isLightTheme(rows.find(r => r.key === 'theme')?.value))
77}
78
79/** /config で theme が変わったら色を替えて描き直す。register の中で 1 回呼ぶ */
80export function followTheme(on: On) {
81  on('config.set', { key: 'theme' }, async ($, e, next) => {
82    const r = await next(e)
83    if (r.deny === undefined) {
84      setTheme(isLightTheme(r.value))
85      $.ui.invalidate('ui.render')
86    }
87    return r
88  })
89}
90
91// ---- 小物 ----
92
93/** 外から来る文字列の制御文字を落とす。エンジンは制御文字を含む Text の子や alt を拒み、ペインが閉じる */
94export const clean = (s: string) => s.replace(/[\t\n\r]+/g, ' ').replace(/[\x00-\x1f\x7f-\x9f]/g, '').trim()
95
96/** SVG の文字に入れる前のエスケープ(制御文字も落とす) */
97export const esc = (s: string) =>
98  clean(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;')
99
100// ---- 時間帯と季節 (日本時間 JST = UTC+9 固定。動いている環境のタイムゾーンには頼らない) ----
101
102export type DayPart = '朝' | '昼' | '夕' | '夜'
103export type Season = '春' | '夏' | '秋' | '冬'
104
105const jstDate = (now: number) => new Date(now + 9 * 3_600_000)
106
107/** 時間帯。朝 5-10 時 / 昼 10-16 時 / 夕 16-19 時 / 夜 19-5 時 */
108export const dayPart = (now: number): DayPart => {
109  const h = jstDate(now).getUTCHours()
110  return h >= 5 && h < 10 ? '朝' : h >= 10 && h < 16 ? '昼' : h >= 16 && h < 19 ? '夕' : '夜'
111}
112
113/** 季節。春 3-5 月 / 夏 6-8 月 / 秋 9-11 月 / 冬 12-2 月 */
114export const season = (now: number): Season => {
115  const m = jstDate(now).getUTCMonth() + 1
116  return m >= 3 && m <= 5 ? '春' : m >= 6 && m <= 8 ? '夏' : m >= 9 && m <= 11 ? '秋' : '冬'
117}
118
119/** n 文字を超えたら … で切る */
120export const short = (s: string, n: number) => (s.length > n ? `${s.slice(0, Math.max(0, n - 1))}…` : s)
121
122// ---- 記録を守る(docs/mod-guide.md の 9 節) ----
123
124/** JST の YYYY-MM-DD */
125export const jstDay = (now: number) => jstDate(now).toISOString().slice(0, 10)
126
127export type Backup = { day: string; value: unknown }
128
129// ponytail: $.fs に消す手が無いので、曜日ごとの 7 つの枠を上書きして 7 日分だけ残す。もっと残すなら枠を日付にして process で消す
130const backupPath = (dir: string, plugin: string, key: string, wd: number) => `${dir.replace(/[\\/]+$/, '')}/${plugin}/${key}-${wd}.json`
131
132/**
133 * $.store の key の値を、その日はじめて呼ばれた時だけ dir に控える(曜日ごとの枠で 7 日分)。
134 * dir が空なら何もしない(公開の既定は空。入れた人が backupDir を設定する)。書いたら true
135 */
136export async function backupDaily($: EngineInterface, dir: string, key: string, value: unknown, now: number): Promise<boolean> {
137  if (!dir.trim() || value === undefined) return false
138  const day = jstDay(now)
139  const path = backupPath(dir, $.plugin.name, key, jstDate(now).getUTCDay())
140  // 壊れた枠(途中まで・null)は無いのと同じに扱って上書きする
141  const old = await $.fs.read(path).then(t => parseBackup(t)?.day ?? '', () => '')
142  if (old === day) return false
143  await $.fs.write(path, JSON.stringify({ day, value } satisfies Backup))
144  return true
145}
146
147/** 控えの 1 枠を読む。壊れていれば undefined */
148export function parseBackup(text: string): Backup | undefined {
149  try {
150    const b = JSON.parse(text) as Partial<Backup> | null
151    return b && typeof b.day === 'string' && /^\d{4}-\d{2}-\d{2}$/.test(b.day) && b.value !== undefined ? (b as Backup) : undefined
152  } catch {
153    return undefined
154  }
155}
156
157/** 控えの一覧。新しい日から順。読めない枠・壊れた枠は飛ばす */
158export async function listBackups($: EngineInterface, dir: string, key: string): Promise<Backup[]> {
159  if (!dir.trim()) return []
160  const all = await Promise.all(
161    [0, 1, 2, 3, 4, 5, 6].map(wd =>
162      $.fs.read(backupPath(dir, $.plugin.name, key, wd)).then(parseBackup, () => undefined),
163    ),
164  )
165  return all.filter((b): b is Backup => b !== undefined).sort((a, b) => b.day.localeCompare(a.day))
166}
167
168let loadedPrint: string | undefined
169let staleAt = 0
170let isStaleNow = false
171let toldStale = false
172
173const normPath = (p: string) => p.replace(/[\\/]+/g, '/').replace(/\/$/, '').toLowerCase()
174
175/** FNV-1a 32bit。中身が変わったかを見るだけ */
176function fnv(s: string) {
177  let h = 0x811c9dc5
178  for (let i = 0; i < s.length; i++) h = Math.imul(h ^ s.charCodeAt(i), 0x01000193)
179  return (h >>> 0).toString(16)
180}
181
182/**
183 * 今ディスクにある、この mod の指紋。plugin.json と hooks の .ts / .tsx の中身から作る
184 * (版の数字を上げずに中身だけ変えた時も変わる)。plugin.json が読めなければ undefined
185 */
186async function diskPrint($: EngineInterface): Promise<string | undefined> {
187  const root = $.plugin.root
188  let manifest: string | undefined
189  for (const p of [`${root}/.claude-plugin/plugin.json`, `${root}/plugin.json`]) {
190    manifest = await $.fs.read(p).then(t => t, () => undefined)
191    if (manifest !== undefined) break
192  }
193  if (manifest === undefined) return undefined
194  const names = await $.fs.list(`${root}/hooks`).then(
195    es => es.filter(e => e.kind === 'file' && /\.tsx?$/.test(e.name)).map(e => e.name).sort(),
196    () => [] as string[],
197  )
198  const parts = await Promise.all(names.map(n => $.fs.read(`${root}/hooks/${n}`).then(t => `${n}\n${t}`, () => n)))
199  return fnv([manifest, ...parts].join('\0'))
200}
201
202/**
203 * マーケットプレイスから入れた形(<plugins>/cache/<market>/<name>/<版>)なら、installed_plugins.json に
204 * 今入っている場所が自分と違うか。違えば新しい版が入っている。分からなければ false
205 */
206async function replacedInCache($: EngineInterface): Promise<boolean> {
207  const root = normPath($.plugin.root)
208  const at = root.lastIndexOf('/plugins/cache/')
209  if (at < 0) return false
210  const raw = await $.fs.read(`${$.plugin.root.slice(0, at + '/plugins'.length)}/installed_plugins.json`).then(t => t, () => '')
211  try {
212    const plugins = (JSON.parse(raw) as { plugins?: Record<string, { installPath?: unknown }[]> }).plugins ?? {}
213    const mine = Object.entries(plugins)
214      .filter(([k]) => k.startsWith(`${$.plugin.name}@`))
215      .flatMap(([, v]) => (Array.isArray(v) ? v : []))
216      .map(e => (typeof e.installPath === 'string' ? normPath(e.installPath) : ''))
217    return mine.length > 0 && !mine.includes(root)
218  } catch {
219    return false
220  }
221}
222
223/** 読み込んだ時の指紋を覚える。mod の session.start で 1 回呼ぶ */
224export async function rememberVersion($: EngineInterface) {
225  loadedPrint ??= await diskPrint($)
226}
227
228/**
229 * 新しい版が入ったのに、このセッションはまだ古い版で動いているか。
230 * フォルダから読ませている時は中身の指紋が読み込んだ時と違えば、マーケットプレイスから入れた時は
231 * 入っている場所が自分でなくなれば true。読み直すのは 60 秒に 1 回まで。分からない時は false
232 */
233export async function isStale($: EngineInterface, now: number): Promise<boolean> {
234  if (isStaleNow || now - staleAt < 60_000) return isStaleNow
235  staleAt = now
236  if (await replacedInCache($)) return (isStaleNow = true)
237  if (loadedPrint === undefined) return false
238  const p = await diskPrint($)
239  isStaleNow = p !== undefined && p !== loadedPrint
240  return isStaleNow
241}
242
243/**
244 * $.store に書いてよいか。古い版のままなら書かず、1 回だけトーストで開き直しを頼む
245 * (古い版は新しい版の欄を知らないので、書くと消してしまう)
246 */
247export async function mayWrite($: EngineInterface, now: number): Promise<boolean> {
248  if (!(await isStale($, now))) return true
249  if (!toldStale) {
250    toldStale = true
251    $.ui.toast(`${$.plugin.name}: 新しい版が入りました。VS Code を開き直すまで記録は書きません`)
252  }
253  return false
254}
255
256// ---- SVG の部品 ----
257
258export const W = 380
259export const HEADER_H = 44
260
261/** SVG 全体の枠。地を塗って body を入れる。幅は W にそろえる */
262export const frame = (h: number, body: string, w = W) =>
263  `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${w} ${h}" font-family="sans-serif">` +
264  `<rect width="${w}" height="${h}" rx="10" fill="${C.bg}"/>${body}</svg>`
265
266/** 面(カード)。角丸 8、線 1 */
267export const panel = (x: number, y: number, w: number, h: number, fill = C.face) =>
268  `<rect x="${x}" y="${y}" width="${w}" height="${h}" rx="8" fill="${fill}" stroke="${C.line}"/>`
269
270/**
271 * 共通の見出し帯(高さ HEADER_H)。左に色の縦線、左に題、右に添え書き。
272 * 下の細い線が左から伸びる
273 */
274export function header(title: string, sub = '', accent = C.blue, y = 0, w = W) {
275  const pad = 14
276  return [
277    `<rect x="0" y="${y}" width="${w}" height="${HEADER_H}" rx="10" fill="${C.face}"/>`,
278    `<rect x="0" y="${y + 8}" width="4" height="${HEADER_H - 16}" rx="2" fill="${accent}"/>`,
279    `<text x="${pad}" y="${y + 28}" font-size="16" font-weight="bold" fill="${C.text}">${esc(title)}</text>`,
280    sub === '' ? '' : `<text x="${w - pad}" y="${y + 28}" font-size="12" fill="${C.dim}" text-anchor="end">${esc(sub)}</text>`,
281    growBar(pad, y + HEADER_H - 3, w - pad * 2, 2, accent, 0, 0.35),
282  ].join('')
283}
284
285/** 横に伸びる棒。幅 0 から w まで伸びて止まる(shots.mts は終わりの値で撮る) */
286export const growBar = (x: number, y: number, w: number, h: number, fill: string, delay = 0, opacity = 1) =>
287  `<rect x="${x}" y="${y}" width="${Math.max(0, w)}" height="${h}" rx="${Math.min(3, h / 2)}" fill="${fill}"${opacity === 1 ? '' : ` opacity="${opacity}"`}>` +
288  `<animate attributeName="width" from="0" to="${Math.max(0, w)}" begin="${delay}s" dur="0.6s" fill="freeze"/></rect>`
289
290/** 下から伸びる縦の棒(下端 bottom・高さ h) */
291export const growColumn = (x: number, bottom: number, w: number, h: number, fill: string, delay = 0) =>
292  `<rect x="${x}" y="${bottom - h}" width="${w}" height="${Math.max(0, h)}" rx="${Math.min(3, w / 2)}" fill="${fill}">` +
293  `<animate attributeName="y" from="${bottom}" to="${bottom - h}" begin="${delay}s" dur="0.6s" fill="freeze"/>` +
294  `<animate attributeName="height" from="0" to="${Math.max(0, h)}" begin="${delay}s" dur="0.6s" fill="freeze"/></rect>`
295
296/** ふわっと出る。中身は SVG の断片 */
297export const fadeIn = (body: string, delay = 0) =>
298  `<g opacity="1"><animate attributeName="opacity" from="0" to="1" begin="${delay}s" dur="0.4s" fill="freeze"/>${body}</g>`
299
300/**
301 * 0 から value まで数字が増えて止まる。コマ送りの文字を重ね、最後のコマだけが残る。
302 * attrs は <text> に付ける属性(x・y・font-size・fill など)。format で桁区切りや単位を付ける
303 */
304export function countUp(value: number, attrs: string, format: (n: number) => string = n => String(n), delay = 0) {
305  const STEPS = 8
306  const d = 0.08
307  const last = `<text ${attrs} opacity="0">${esc(format(value))}<animate attributeName="opacity" from="0" to="1" begin="${(delay + (STEPS - 1) * d).toFixed(2)}s" dur="0.01s" fill="freeze"/></text>`
308  if (!Number.isFinite(value) || value === 0) return `<text ${attrs}>${esc(format(value))}</text>`
309  const frames = Array.from({ length: STEPS - 1 }, (_, k) => {
310    const n = Number.isInteger(value) ? Math.round((value * k) / (STEPS - 1)) : (value * k) / (STEPS - 1)
311    return `<text ${attrs} opacity="0">${esc(format(n))}<animate attributeName="opacity" values="1;1" begin="${(delay + k * d).toFixed(2)}s" dur="${d}s"/></text>`
312  })
313  return frames.join('') + last
314}
315

1// toast-inbox の $.state の契約
2
3/** 拾った通知 1 件 */
4export type InboxItem = {
5  /** 出した mod の名前(@ より前)。本体なら 'engine' */
6  plugin: string
7  /** 制御文字を落とした本文 */
8  text: string
9  /** 拾った時刻($.clock.now() のミリ秒) */
10  at: number
11  kind: 'toast' | 'status'
12}
13
14declare module 'claude-code' {
15  interface PluginState {
16    'toast-inbox': {
17      /** 古い順、最大 100 件。$.store の 'items' にも残す */
18      items: InboxItem[]
19      /** この時刻より後の通知が未読。$.store の 'readAt' にも残す */
20      readAt: number
21      /** 絞り込む mod の名前(空ならすべて) */
22      filter: string
23      /** 「空にする」を 1 回押した後 */
24      confirmClear: boolean
25      /** mod の名前 → 行を押した時に開くコマンド(スラッシュ無し)。ペインを開く時に $.command.list() から引き直す */
26      commands: Record<string, string>
27      /** 行を押した結果の一言。空なら出さない */
28      notice: string
29    }
30  }
31}
32