A guided explanation is only useful in a language the reader reads, so the panel header gets a language picker alongside the model one, defaulting to the interface language. Like the model, it is request state rather than a setting: the language travels with the read and the generation, and the one a walkthrough was written in is stored with it, so reopening a review describes what is there instead of what a fresh one would be. Only prose is translated. Hunk aliases resolve back to hunk ids and icon/importance are validated against fixed English values, so a translated one would be dropped by the normalizer — silently losing an anchor or a style. Identifiers and paths stay as they appear in the code. The language is part of the cache key, and a read now asks the cache for the exact request it was given before falling back to the pointer. Without that the panel answered a request to switch languages with the text it already had, leaving the other language unused in the cache. Alongside it: - The answer budget is derived from the resolved model instead of a flat 24k. That number was the same for a 64k-context model and for one that admits to 384k output tokens, and on the latter it was the only reason generation failed: the model spent the whole allowance reasoning and returned nothing. It is now min(96k, max(24k, a quarter of the context)) capped by the catalog's output limit, decided once so the input reserve and the request cannot drift apart. - A read no longer offers Cancel. It is a few hundred milliseconds of git with nothing to cancel, and the button flickered on every model or language change. When the panel is showing a fallback, a banner names what is on screen versus what was asked for — only once the read has settled. - The header keeps one 32px control height and drops its labels below 680px instead of squeezing them to two letters and an ellipsis. Docs and module documentation updated in every locale.
226 lines
7.7 KiB
TypeScript
226 lines
7.7 KiB
TypeScript
import { afterEach, beforeEach, describe, expect, mock, test } from 'bun:test';
|
|
import type { WalkthroughResult, WalkthroughSource } from '@/lib/walkthrough/types';
|
|
|
|
const SOURCE: WalkthroughSource = { kind: 'working-tree', scope: 'all' };
|
|
|
|
const result = (overrides: Partial<WalkthroughResult> = {}): WalkthroughResult => ({
|
|
source: SOURCE,
|
|
walkthrough: null,
|
|
hunks: [],
|
|
hunkCount: 0,
|
|
...overrides,
|
|
});
|
|
|
|
const finished = result({
|
|
walkthrough: {
|
|
title: 'Change',
|
|
focus: '',
|
|
chapters: [{
|
|
id: 'chapter-1',
|
|
title: 'Data',
|
|
icon: 'doc',
|
|
blurb: '',
|
|
stops: [{ id: 'stop-1-1', title: 'A', hunkIds: ['h'], importance: 'normal', prose: 'p' }],
|
|
}],
|
|
},
|
|
generatedAt: '2026-08-02T00:00:00.000Z',
|
|
});
|
|
|
|
// Plain closures rather than mock helpers: bun's `mock()` is not typed with
|
|
// vitest's `mockResolvedValue` family, and the repo already prefers this style.
|
|
let readResult: WalkthroughResult = result();
|
|
let generateCalls = 0;
|
|
let releaseGeneration: (() => void) | undefined;
|
|
let lastReadModel: string | undefined;
|
|
let lastGenerateModel: string | undefined;
|
|
let lastReadLanguage: string | undefined;
|
|
let lastGenerateLanguage: string | undefined;
|
|
|
|
mock.module('@/lib/walkthrough/api', () => ({
|
|
fetchWalkthrough: async (
|
|
_directory: string,
|
|
_source: WalkthroughSource,
|
|
options: { model?: string; language?: string } = {},
|
|
) => {
|
|
lastReadModel = options.model;
|
|
lastReadLanguage = options.language;
|
|
return readResult;
|
|
},
|
|
generateWalkthrough: async (
|
|
_directory: string,
|
|
_source: WalkthroughSource,
|
|
options: { model?: string; language?: string } = {},
|
|
) => {
|
|
generateCalls += 1;
|
|
lastGenerateModel = options.model;
|
|
lastGenerateLanguage = options.language;
|
|
return new Promise<WalkthroughResult>((resolve) => {
|
|
releaseGeneration = () => resolve(finished);
|
|
});
|
|
},
|
|
cancelWalkthroughGeneration: async () => {},
|
|
// The store imports this for its progress poller. Leaving it out of the mock
|
|
// makes the whole module fail to load, which reads as an unrelated crash.
|
|
fetchWalkthroughStage: async () => null,
|
|
}));
|
|
mock.module('@/lib/runtime-switch', () => ({ getRuntimeKey: () => 'local' }));
|
|
|
|
const { useWalkthroughStore } = await import('./useWalkthroughStore');
|
|
|
|
const flush = () => new Promise((resolve) => setTimeout(resolve, 0));
|
|
|
|
describe('useWalkthroughStore — reattaching to a running generation', () => {
|
|
beforeEach(() => {
|
|
useWalkthroughStore.getState().reset();
|
|
readResult = result();
|
|
generateCalls = 0;
|
|
releaseGeneration = undefined;
|
|
});
|
|
|
|
afterEach(() => {
|
|
useWalkthroughStore.getState().reset();
|
|
});
|
|
|
|
test('a reload that finds work in progress ends up showing the finished result', async () => {
|
|
// What a refresh looks like: the read says a job is running, and the
|
|
// generation the client re-attaches to finishes a moment later.
|
|
readResult = result({ generating: true });
|
|
|
|
await useWalkthroughStore.getState().load('/repo', SOURCE);
|
|
await flush();
|
|
|
|
expect(generateCalls).toBe(1);
|
|
expect(useWalkthroughStore.getState().getEntry('/repo', SOURCE).status).toBe('generating');
|
|
|
|
releaseGeneration?.();
|
|
await flush();
|
|
|
|
const entry = useWalkthroughStore.getState().getEntry('/repo', SOURCE);
|
|
expect(entry.status).toBe('ready');
|
|
expect(entry.result?.walkthrough?.title).toBe('Change');
|
|
});
|
|
|
|
test('does not re-attach when nothing is running', async () => {
|
|
readResult = result({ generating: false });
|
|
|
|
await useWalkthroughStore.getState().load('/repo', SOURCE);
|
|
await flush();
|
|
|
|
expect(generateCalls).toBe(0);
|
|
expect(useWalkthroughStore.getState().getEntry('/repo', SOURCE).status).toBe('ready');
|
|
});
|
|
|
|
test('a load while generating does not overwrite the pending state', async () => {
|
|
readResult = result({ generating: true });
|
|
await useWalkthroughStore.getState().load('/repo', SOURCE);
|
|
await flush();
|
|
|
|
await useWalkthroughStore.getState().load('/repo', SOURCE);
|
|
await flush();
|
|
|
|
expect(generateCalls).toBe(1);
|
|
expect(useWalkthroughStore.getState().getEntry('/repo', SOURCE).status).toBe('generating');
|
|
});
|
|
});
|
|
|
|
describe('useWalkthroughStore — model selection', () => {
|
|
beforeEach(() => {
|
|
useWalkthroughStore.getState().reset();
|
|
readResult = result();
|
|
generateCalls = 0;
|
|
lastReadModel = undefined;
|
|
lastGenerateModel = undefined;
|
|
});
|
|
|
|
afterEach(() => {
|
|
useWalkthroughStore.getState().reset();
|
|
});
|
|
|
|
test('sends the chosen model with both the read and the generation', async () => {
|
|
useWalkthroughStore.getState().selectModel('/repo', SOURCE, 'anthropic/claude-haiku-4-5');
|
|
|
|
await useWalkthroughStore.getState().load('/repo', SOURCE);
|
|
await flush();
|
|
expect(lastReadModel).toBe('anthropic/claude-haiku-4-5');
|
|
|
|
void useWalkthroughStore.getState().generate('/repo', SOURCE);
|
|
await flush();
|
|
expect(lastGenerateModel).toBe('anthropic/claude-haiku-4-5');
|
|
releaseGeneration?.();
|
|
await flush();
|
|
});
|
|
|
|
test('clearing the choice falls back to whatever the server resolves', async () => {
|
|
useWalkthroughStore.getState().selectModel('/repo', SOURCE, 'anthropic/claude-haiku-4-5');
|
|
useWalkthroughStore.getState().selectModel('/repo', SOURCE, null);
|
|
|
|
await useWalkthroughStore.getState().load('/repo', SOURCE);
|
|
await flush();
|
|
|
|
expect(lastReadModel).toBe(undefined);
|
|
});
|
|
|
|
test('keeps choices apart per source', async () => {
|
|
const branch: WalkthroughSource = { kind: 'branch', baseRef: 'main', headRef: 'feature' };
|
|
useWalkthroughStore.getState().selectModel('/repo', SOURCE, 'anthropic/claude-haiku-4-5');
|
|
|
|
expect(useWalkthroughStore.getState().getSelectedModel("/repo", branch)).toBe(undefined);
|
|
expect(useWalkthroughStore.getState().getSelectedModel('/repo', SOURCE))
|
|
.toBe('anthropic/claude-haiku-4-5');
|
|
});
|
|
});
|
|
|
|
describe('useWalkthroughStore — walkthrough language', () => {
|
|
beforeEach(() => {
|
|
useWalkthroughStore.getState().reset();
|
|
readResult = result();
|
|
generateCalls = 0;
|
|
lastReadLanguage = undefined;
|
|
lastGenerateLanguage = undefined;
|
|
});
|
|
|
|
afterEach(() => {
|
|
useWalkthroughStore.getState().reset();
|
|
});
|
|
|
|
// The read carries it too: readiness is an answer about a specific request,
|
|
// and the language instruction is part of that request.
|
|
test('sends the resolved language with both the read and the generation', async () => {
|
|
await useWalkthroughStore.getState().load('/repo', SOURCE, { language: 'uk' });
|
|
await flush();
|
|
expect(lastReadLanguage).toBe('uk');
|
|
|
|
void useWalkthroughStore.getState().generate('/repo', SOURCE, { language: 'uk' });
|
|
await flush();
|
|
expect(lastGenerateLanguage).toBe('uk');
|
|
releaseGeneration?.();
|
|
await flush();
|
|
});
|
|
|
|
test('keeps an explicit choice apart per source', () => {
|
|
const branch: WalkthroughSource = { kind: 'branch', baseRef: 'main', headRef: 'feature' };
|
|
useWalkthroughStore.getState().selectLanguage('/repo', SOURCE, 'ja');
|
|
|
|
expect(useWalkthroughStore.getState().getSelectedLanguage('/repo', branch)).toBe(undefined);
|
|
expect(useWalkthroughStore.getState().getSelectedLanguage('/repo', SOURCE)).toBe('ja');
|
|
});
|
|
|
|
test('clearing the choice returns to no explicit language', () => {
|
|
useWalkthroughStore.getState().selectLanguage('/repo', SOURCE, 'ja');
|
|
useWalkthroughStore.getState().selectLanguage('/repo', SOURCE, null);
|
|
|
|
expect(useWalkthroughStore.getState().getSelectedLanguage('/repo', SOURCE)).toBe(undefined);
|
|
});
|
|
|
|
test('a re-attach after a reload still names the language it would ask for', async () => {
|
|
readResult = result({ generating: true });
|
|
|
|
await useWalkthroughStore.getState().load('/repo', SOURCE, { language: 'pl' });
|
|
await flush();
|
|
|
|
expect(lastGenerateLanguage).toBe('pl');
|
|
releaseGeneration?.();
|
|
await flush();
|
|
});
|
|
});
|