Feature/post media translations (#42)

* chore: updated todo with translation ideas

* feat: first take at the implementation of translations

* fix: small addition for the translation feature

* feat: support language switching in the editor and preview

* feat: better handling of long bodies by not running them through a json envelope

* fix: unknown macros have better fallback

* feat: api for python to get translations

* fix: strip dumb prefix of content in translation

* feat: extend meta diff for translations

* feat: hook up translations to rebuild-from-disk

* feat: generation of the website prefers project language, falling back to canonical language

* fix: crashes during rendering

* feat: translation validation report

* fix: made the translation validation actually work

* chore: reorganization of menu

* fix: some topics cleanup

* chore: updated doc

* feat: translations for media

* feat: more aligned in UI/UX

* feat: edit translations possible

* chore: added full multi-language todo

* chore: updated todo for clarity

* feat: implementation of full multi-linguality

* fix: page creation creates pages

* fix: flags on every page

* fix: better prompt

* feat: made MCP server aware of language content

* feat: python tools for translations

* fix: better fill-in-translations

* fix: better prompt for translation. maybe.

* fix: losing posts from search due to translation process

* fix: translation validation handles in-db content and fill-in of missing translations fixed to flush

* fix: faster scanning for infilling of missing translations

* chore: updated agent instructions

* feat: calendar and tag cloud respect current language now

* fix: retries going up

* fix: got metadata-diff and rebuild into sync

* fix: extended meta-diff for timestamps

* fix: made website validation look at translated content, too

* fix: multi-lingual search

* chore: refactor Editor.tsx into two separate editors

* feat: do language detection when no explicit language given

---------

Co-authored-by: hugo <hugoms@me.com>
This commit is contained in:
Georg Bauer
2026-03-09 14:43:18 +01:00
committed by GitHub
parent f1c9038803
commit b855d61524
116 changed files with 19954 additions and 2094 deletions

View File

@@ -124,7 +124,7 @@ vi.mock('../../../src/renderer/components/Toast', () => ({
},
}));
import { PostEditor } from '../../../src/renderer/components/Editor/Editor';
import { PostEditor } from '../../../src/renderer/components/Editor/PostEditor';
import { useAppStore } from '../../../src/renderer/store';
const INITIAL_CONTENT = '# Hello World\n\nThis is the original content.';

View File

@@ -26,6 +26,7 @@ vi.mock('../../../src/renderer/components/MetadataDiffPanel', () => ({ MetadataD
vi.mock('../../../src/renderer/components/GitDiffView/GitDiffView', () => ({ GitDiffView: () => null }));
vi.mock('../../../src/renderer/components/DocumentationView/DocumentationView', () => ({ DocumentationView: () => null }));
vi.mock('../../../src/renderer/components/SiteValidationView', () => ({ SiteValidationView: () => null }));
vi.mock('../../../src/renderer/components/TranslationValidationView', () => ({ TranslationValidationView: () => null }));
vi.mock('../../../src/renderer/components/InsertModal', () => ({ InsertModal: () => null }));
vi.mock('../../../src/renderer/components/AISuggestionsModal/AISuggestionsModal', () => ({
AISuggestionsModal: () => null,

View File

@@ -0,0 +1,402 @@
import React from 'react';
import { describe, it, expect, beforeEach, vi } from 'vitest';
import { render, act, fireEvent, within } from '@testing-library/react';
vi.mock('@monaco-editor/react', () => ({
default: () => <div data-testid="monaco-editor" />,
}));
vi.mock('@milkdown/kit/core', () => {
const makeChain = () => {
const chain = {
config: (callback: (ctx: { set: () => void; get: () => { markdownUpdated: () => void } }) => void) => {
callback({ set: () => {}, get: () => ({ markdownUpdated: () => {} }) });
return chain;
},
use: () => chain,
};
return chain;
};
return {
Editor: { make: makeChain },
defaultValueCtx: Symbol('defaultValueCtx'),
editorViewCtx: Symbol('editorViewCtx'),
rootCtx: Symbol('rootCtx'),
remarkStringifyOptionsCtx: Symbol('remarkStringifyOptionsCtx'),
remarkPluginsCtx: Symbol('remarkPluginsCtx'),
};
});
vi.mock('@milkdown/kit/preset/commonmark', () => ({
commonmark: {},
toggleStrongCommand: { key: 'toggleStrong' },
toggleEmphasisCommand: { key: 'toggleEmphasis' },
wrapInBlockquoteCommand: { key: 'wrapInBlockquote' },
wrapInBulletListCommand: { key: 'wrapInBulletList' },
wrapInOrderedListCommand: { key: 'wrapInOrderedList' },
insertHrCommand: { key: 'insertHr' },
toggleInlineCodeCommand: { key: 'toggleInlineCode' },
insertImageCommand: { key: 'insertImage' },
toggleLinkCommand: { key: 'toggleLink' },
}));
vi.mock('@milkdown/kit/preset/gfm', () => ({
gfm: {},
toggleStrikethroughCommand: { key: 'toggleStrike' },
}));
vi.mock('@milkdown/kit/plugin/history', () => ({
history: {},
undoCommand: { key: 'undo' },
redoCommand: { key: 'redo' },
}));
vi.mock('@milkdown/kit/plugin/listener', () => ({
listener: {},
listenerCtx: Symbol('listenerCtx'),
}));
vi.mock('@milkdown/kit/plugin/clipboard', () => ({ clipboard: {} }));
vi.mock('@milkdown/kit/plugin/trailing', () => ({ trailing: {} }));
vi.mock('@milkdown/kit/plugin/indent', () => ({ indent: {} }));
vi.mock('@milkdown/kit/plugin/cursor', () => ({ cursor: {} }));
vi.mock('@milkdown/kit/utils', () => ({
$node: () => ({}),
$inputRule: () => ({}),
$remark: () => ({}),
$prose: () => ({}),
replaceAll: () => () => {},
callCommand: () => () => {},
}));
vi.mock('@milkdown/react', () => ({
Milkdown: () => <div data-testid="milkdown" />,
MilkdownProvider: ({ children }: { children: React.ReactNode }) => <>{children}</>,
useInstance: () => [false, () => ({ action: (action: unknown) => {
if (typeof action === 'function') {
action({ get: () => ({}) });
}
} })] as const,
useEditor: (factory: (root: Node) => unknown) => {
factory(document.createElement('div'));
},
}));
vi.mock('../../../src/renderer/components/Lightbox', () => ({
Lightbox: () => null,
useMarkdownImages: () => [],
}));
vi.mock('../../../src/renderer/components/MilkdownEditor', () => ({
MilkdownEditor: ({ content, onChange }: { content: string; onChange: (value: string) => void }) => (
<textarea data-testid="milkdown-editor" value={content} onChange={(event) => onChange(event.target.value)} />
),
}));
vi.mock('../../../src/renderer/components/PostLinks', () => ({ PostLinks: () => null }));
vi.mock('../../../src/renderer/components/LinkedMediaPanel', () => ({ LinkedMediaPanel: () => null }));
vi.mock('../../../src/renderer/components/ErrorModal', () => ({ ErrorModal: () => null }));
vi.mock('../../../src/renderer/components/ConfirmDeleteModal', () => ({ ConfirmDeleteModal: () => null }));
vi.mock('../../../src/renderer/components/SettingsView', () => ({ SettingsView: () => null }));
vi.mock('../../../src/renderer/components/TagsView', () => ({ TagsView: () => null }));
vi.mock('../../../src/renderer/components/TagInput', () => ({ TagInput: () => null }));
vi.mock('../../../src/renderer/components/ChatPanel', () => ({ ChatPanel: () => null }));
vi.mock('../../../src/renderer/components/ImportAnalysisView', () => ({ ImportAnalysisView: () => null }));
vi.mock('../../../src/renderer/components/MetadataDiffPanel', () => ({ MetadataDiffPanel: () => null }));
vi.mock('../../../src/renderer/components/GitDiffView/GitDiffView', () => ({ GitDiffView: () => null }));
vi.mock('../../../src/renderer/components/InsertModal', () => ({ InsertModal: () => null }));
vi.mock('../../../src/renderer/components/AISuggestionsModal/AISuggestionsModal', () => ({
AISuggestionsModal: () => null,
}));
vi.mock('../../../src/renderer/components/Toast', () => ({
showToast: {
success: vi.fn(),
error: vi.fn(),
},
}));
import { MediaEditor } from '../../../src/renderer/components/Editor/MediaEditor';
import { useAppStore } from '../../../src/renderer/store';
const createMedia = (overrides: Record<string, unknown> = {}) => ({
id: 'media-1',
title: 'Test Image',
alt: 'A test image',
caption: 'Photo caption',
originalName: 'test.jpg',
mimeType: 'image/jpeg',
size: 1024,
width: 800,
height: 600,
tags: [],
author: '',
language: 'en',
availableLanguages: [],
projectId: 'project-1',
filePath: 'media/test.jpg',
createdAt: new Date('2026-02-16T12:00:00.000Z'),
updatedAt: new Date('2026-02-16T12:00:00.000Z'),
...overrides,
});
describe('Media editor quick-actions', () => {
beforeEach(() => {
vi.clearAllMocks();
const neverSettles = new Promise<never>(() => {});
(window as any).electronAPI ??= {};
(window as any).electronAPI.media ??= {};
(window as any).electronAPI.meta ??= {};
(window as any).electronAPI.chat ??= {};
(window as any).electronAPI.postMedia ??= {};
(window as any).addEventListener = vi.fn();
(window as any).removeEventListener = vi.fn();
(window as any).dispatchEvent = vi.fn();
(window as any).electronAPI.on = vi.fn(() => () => {});
(window as any).electronAPI.media.getTranslations = vi.fn().mockResolvedValue([]);
(window as any).electronAPI.media.getTranslation = vi.fn().mockResolvedValue(null);
(window as any).electronAPI.media.deleteTranslation = vi.fn().mockResolvedValue(undefined);
(window as any).electronAPI.media.upsertTranslation = vi.fn().mockImplementation(async (_id: string, lang: string, data: Record<string, unknown>) => ({
id: 'trans-1', projectId: 'project-1', translationFor: _id, language: lang, ...data,
createdAt: new Date(), updatedAt: new Date(),
}));
(window as any).electronAPI.media.update = vi.fn().mockImplementation(async (_id: string, payload: Record<string, unknown>) => ({
...createMedia(),
...payload,
}));
(window as any).electronAPI.media.replaceFileDialog = vi.fn().mockReturnValue(neverSettles);
(window as any).electronAPI.meta.getProjectMetadata = vi.fn().mockResolvedValue({ mainLanguage: 'en' });
(window as any).electronAPI.postMedia.getForMedia = vi.fn().mockResolvedValue([]);
(window as any).electronAPI.chat.analyzeMediaImage = vi.fn().mockResolvedValue({ success: true, title: 'AI Title', alt: 'AI alt', caption: 'AI caption' });
(window as any).electronAPI.chat.detectMediaLanguage = vi.fn().mockResolvedValue({ success: true, language: 'de' });
(window as any).electronAPI.chat.translateMediaMetadata = vi.fn().mockResolvedValue({ success: true });
useAppStore.setState({
activeProject: { id: 'project-1', name: 'Test', path: '/tmp/test' } as any,
media: [createMedia()],
posts: [],
dirtyPosts: new Set<string>(),
isLoading: false,
});
});
it('shows quick-actions button for image media', async () => {
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
expect(ui.getByRole('button', { name: /Quick Actions/i })).toBeInTheDocument();
});
it('shows quick-actions button for non-image media', async () => {
useAppStore.setState({
media: [createMedia({ mimeType: 'application/pdf', width: undefined, height: undefined })],
});
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
expect(ui.getByRole('button', { name: /Quick Actions/i })).toBeInTheDocument();
});
it('shows AI analysis, detect language, and translate items in the quick-actions menu', async () => {
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Quick Actions/i }));
});
expect(ui.getByText('AI: Generate Title, Alt & Caption')).toBeInTheDocument();
expect(ui.getByText('Detect Language')).toBeInTheDocument();
expect(ui.getByText('Translate to...')).toBeInTheDocument();
});
it('hides AI analysis item for non-image media but shows detect + translate', async () => {
useAppStore.setState({
media: [createMedia({ mimeType: 'application/pdf', width: undefined, height: undefined })],
});
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Quick Actions/i }));
});
expect(ui.queryByText('AI: Generate Title, Alt & Caption')).toBeNull();
expect(ui.getByText('Detect Language')).toBeInTheDocument();
expect(ui.getByText('Translate to...')).toBeInTheDocument();
});
it('calls detectMediaLanguage and updates the language dropdown on detect', async () => {
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Quick Actions/i }));
});
await act(async () => {
fireEvent.click(ui.getByText('Detect Language'));
});
expect((window as any).electronAPI.chat.detectMediaLanguage).toHaveBeenCalledWith(
'Test Image', 'A test image', 'Photo caption'
);
});
it('opens a translation modal from quick-actions and translates on confirm', async () => {
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Quick Actions/i }));
});
await act(async () => {
fireEvent.click(ui.getByText('Translate to...'));
});
expect(ui.getByRole('heading', { name: 'Translations' })).toBeInTheDocument();
expect(ui.getByText('Select target language')).toBeInTheDocument();
expect(ui.getByText(/Current language/i)).toBeInTheDocument();
await act(async () => {
fireEvent.change(ui.getByLabelText('Select target language'), { target: { value: 'fr' } });
});
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: 'Translate to…' }));
});
expect((window as any).electronAPI.chat.translateMediaMetadata).toHaveBeenCalledWith('media-1', 'fr');
});
it('disables translate quick-action when no language is set', async () => {
useAppStore.setState({
media: [createMedia({ language: '' })],
});
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Quick Actions/i }));
});
const translateButton = ui.getByText('Translate to...').closest('button');
expect(translateButton).toBeDisabled();
});
describe('edit translation modal', () => {
const translationFixture = {
id: 'trans-1',
projectId: 'project-1',
translationFor: 'media-1',
language: 'fr',
title: 'Titre français',
alt: 'Alt français',
caption: 'Légende française',
createdAt: new Date(),
updatedAt: new Date(),
};
it('opens edit modal when clicking a translation title', async () => {
(window as any).electronAPI.media.getTranslations = vi.fn().mockResolvedValue([translationFixture]);
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
const translationTitle = ui.getByText(/Titre français/);
expect(translationTitle).toBeInTheDocument();
await act(async () => {
fireEvent.click(translationTitle);
});
expect(ui.getByRole('heading', { name: /Edit Translation/ })).toBeInTheDocument();
expect((ui.getByDisplayValue('Titre français') as HTMLInputElement)).toBeInTheDocument();
expect((ui.getByDisplayValue('Alt français') as HTMLInputElement)).toBeInTheDocument();
expect((ui.getByDisplayValue('Légende française') as HTMLTextAreaElement)).toBeInTheDocument();
});
it('closes edit modal on cancel', async () => {
(window as any).electronAPI.media.getTranslations = vi.fn().mockResolvedValue([translationFixture]);
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
await act(async () => { fireEvent.click(ui.getByText(/Titre français/)); });
expect(ui.getByRole('heading', { name: /Edit Translation/ })).toBeInTheDocument();
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Cancel/i }));
});
expect(ui.queryByRole('heading', { name: /Edit Translation/ })).toBeNull();
});
it('saves translation via upsertTranslation and shows success toast', async () => {
(window as any).electronAPI.media.getTranslations = vi.fn().mockResolvedValue([translationFixture]);
const { showToast } = await import('../../../src/renderer/components/Toast');
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
await act(async () => { fireEvent.click(ui.getByText(/Titre français/)); });
const modal = ui.getByText(/Edit Translation/).closest('.translation-modal')!;
const modalUi = within(modal as HTMLElement);
await act(async () => {
fireEvent.click(modalUi.getByRole('button', { name: /Save/i }));
});
expect((window as any).electronAPI.media.upsertTranslation).toHaveBeenCalledWith(
'media-1', 'fr', { title: 'Titre français', alt: 'Alt français', caption: 'Légende française' }
);
expect(showToast.success).toHaveBeenCalled();
});
it('shows error toast when save fails', async () => {
(window as any).electronAPI.media.getTranslations = vi.fn().mockResolvedValue([translationFixture]);
(window as any).electronAPI.media.upsertTranslation = vi.fn().mockRejectedValue(new Error('DB Error'));
const { showToast } = await import('../../../src/renderer/components/Toast');
const view = render(<MediaEditor mediaId="media-1" />);
const ui = within(view.container);
await act(async () => { await Promise.resolve(); await Promise.resolve(); });
await act(async () => { fireEvent.click(ui.getByText(/Titre français/)); });
const modal = ui.getByText(/Edit Translation/).closest('.translation-modal')!;
const modalUi = within(modal as HTMLElement);
await act(async () => {
fireEvent.click(modalUi.getByRole('button', { name: /Save/i }));
});
expect(showToast.error).toHaveBeenCalled();
});
});
});

View File

@@ -115,7 +115,7 @@ vi.mock('../../../src/renderer/components/Toast', () => ({
},
}));
import { PostEditor } from '../../../src/renderer/components/Editor/Editor';
import { PostEditor } from '../../../src/renderer/components/Editor/PostEditor';
import { useAppStore } from '../../../src/renderer/store';
const createPost = (overrides: Record<string, unknown> = {}) => ({
@@ -262,4 +262,26 @@ describe('Editor metadata collapse', () => {
expect(container.querySelector('.editor-excerpt-panel')).toBeNull();
});
it('shows translation flags in the metadata toggle header even when collapsed', async () => {
(window as any).electronAPI.posts.get = vi.fn().mockResolvedValue(createPost({ title: 'Existing Post' }));
const { container } = render(<PostEditor postId="post-1" />);
await act(async () => {
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
});
// Metadata is collapsed for existing posts
expect(container.querySelector('.editor-header-row')).toBeNull();
// Translation flags should be visible in the header line, not inside metadata
const toggleHeader = container.querySelector('.metadata-toggle-header');
expect(toggleHeader).not.toBeNull();
const flagsInHeader = toggleHeader!.querySelector('.editor-translations-flags');
expect(flagsInHeader).not.toBeNull();
});
});

View File

@@ -1,8 +1,9 @@
import React from 'react';
import { describe, it, expect, beforeEach, vi } from 'vitest';
import { render, act, fireEvent, screen } from '@testing-library/react';
import { render, act, fireEvent, within } from '@testing-library/react';
let lastSuggestionFields: Array<{ key: string; label: string; currentValue: string; suggestedValue?: string; disabled?: boolean; warning?: string }> = [];
const menuListeners = new Map<string, () => void | Promise<void>>();
vi.mock('@monaco-editor/react', () => ({
default: () => <div data-testid="monaco-editor" />,
@@ -93,6 +94,11 @@ vi.mock('../../../src/renderer/components/Lightbox', () => ({
Lightbox: () => null,
useMarkdownImages: () => [],
}));
vi.mock('../../../src/renderer/components/MilkdownEditor', () => ({
MilkdownEditor: ({ content, onChange }: { content: string; onChange: (value: string) => void }) => (
<textarea data-testid="milkdown-editor" value={content} onChange={(event) => onChange(event.target.value)} />
),
}));
vi.mock('../../../src/renderer/components/PostLinks', () => ({ PostLinks: () => null }));
vi.mock('../../../src/renderer/components/LinkedMediaPanel', () => ({ LinkedMediaPanel: () => null }));
vi.mock('../../../src/renderer/components/ErrorModal', () => ({ ErrorModal: () => null }));
@@ -128,7 +134,7 @@ vi.mock('../../../src/renderer/components/Toast', () => ({
},
}));
import { PostEditor } from '../../../src/renderer/components/Editor/Editor';
import { PostEditor } from '../../../src/renderer/components/Editor/PostEditor';
import { useAppStore } from '../../../src/renderer/store';
const createPost = (overrides: Record<string, unknown> = {}) => ({
@@ -154,10 +160,26 @@ const createPost = (overrides: Record<string, unknown> = {}) => ({
...overrides,
});
const createTranslation = (overrides: Record<string, unknown> = {}) => ({
id: 'translation-1',
translationFor: 'post-1',
language: 'fr',
title: 'Bonjour',
excerpt: 'Resume',
content: 'Contenu',
status: 'draft' as const,
createdAt: new Date('2026-02-16T12:00:00.000Z'),
updatedAt: new Date('2026-02-16T12:00:00.000Z'),
publishedAt: null,
filePath: 'posts/test-post.fr.md',
...overrides,
});
describe('Editor AI post suggestions', () => {
beforeEach(() => {
vi.clearAllMocks();
lastSuggestionFields = [];
menuListeners.clear();
const neverSettles = new Promise<never>(() => {});
(window as any).electronAPI ??= {};
@@ -168,9 +190,23 @@ describe('Editor AI post suggestions', () => {
(window as any).addEventListener = vi.fn();
(window as any).removeEventListener = vi.fn();
(window as any).dispatchEvent = vi.fn();
(window as any).electronAPI.on = vi.fn((event: string, handler: () => void | Promise<void>) => {
menuListeners.set(event, handler);
return () => {
menuListeners.delete(event);
};
});
(window as any).electronAPI.posts.hasPublishedVersion = vi.fn().mockReturnValue(neverSettles);
(window as any).electronAPI.posts.getTranslations = vi.fn().mockResolvedValue([]);
(window as any).electronAPI.posts.getTranslation = vi.fn().mockResolvedValue(null);
(window as any).electronAPI.posts.publishTranslation = vi.fn().mockResolvedValue(createPost());
(window as any).electronAPI.posts.upsertTranslation = vi.fn().mockImplementation(async (postId: string, language: string, data: Record<string, string>) =>
createTranslation({ translationFor: postId, language, ...data, status: 'draft' })
);
(window as any).electronAPI.posts.getPreviewUrl = vi.fn().mockResolvedValue('http://127.0.0.1:4123/preview');
(window as any).electronAPI.posts.publish = vi.fn().mockResolvedValue(createPost({ status: 'published' }));
(window as any).electronAPI.posts.update = vi.fn().mockImplementation(async (_postId: string, payload: Record<string, string>) => ({
...createPost(),
...payload,
@@ -184,6 +220,9 @@ describe('Editor AI post suggestions', () => {
excerpt: 'A concise summary.',
slug: 'better-title',
});
(window as any).electronAPI.chat.translatePost = vi.fn().mockResolvedValue({
success: true,
});
useAppStore.setState({
activeProject: { id: 'project-1', name: 'Test', path: '/tmp/test' } as any,
@@ -201,7 +240,8 @@ describe('Editor AI post suggestions', () => {
publishedAt: new Date('2026-02-16T12:00:00.000Z'),
}));
render(<PostEditor postId="post-1" />);
const view = render(<PostEditor postId="post-1" />);
const ui = within(view.container);
await act(async () => {
await Promise.resolve();
@@ -210,11 +250,11 @@ describe('Editor AI post suggestions', () => {
});
await act(async () => {
fireEvent.click(screen.getByRole('button', { name: '⚡ Quick Actions' }));
fireEvent.click(ui.getByRole('button', { name: '⚡ Quick Actions' }));
});
await act(async () => {
fireEvent.click(screen.getByRole('button', { name: /AI: Suggest Title, Summary & Slug/i }));
fireEvent.click(ui.getByRole('button', { name: /AI: Suggest Title, Summary & Slug/i }));
});
const slugField = lastSuggestionFields.find((field) => field.key === 'slug');
@@ -225,7 +265,8 @@ describe('Editor AI post suggestions', () => {
it('submits the AI slug for a never-published draft when applying suggestions', async () => {
(window as any).electronAPI.posts.get = vi.fn().mockResolvedValue(createPost());
render(<PostEditor postId="post-1" />);
const view = render(<PostEditor postId="post-1" />);
const ui = within(view.container);
await act(async () => {
await Promise.resolve();
@@ -234,15 +275,15 @@ describe('Editor AI post suggestions', () => {
});
await act(async () => {
fireEvent.click(screen.getByRole('button', { name: '⚡ Quick Actions' }));
fireEvent.click(ui.getByRole('button', { name: '⚡ Quick Actions' }));
});
await act(async () => {
fireEvent.click(screen.getByRole('button', { name: /AI: Suggest Title, Summary & Slug/i }));
fireEvent.click(ui.getByRole('button', { name: /AI: Suggest Title, Summary & Slug/i }));
});
await act(async () => {
fireEvent.click(screen.getByRole('button', { name: 'apply-suggestions' }));
fireEvent.click(ui.getByRole('button', { name: 'apply-suggestions' }));
});
expect((window as any).electronAPI.posts.update).toHaveBeenCalledWith(
@@ -250,4 +291,203 @@ describe('Editor AI post suggestions', () => {
expect.objectContaining({ title: 'Better Title', slug: 'better-title' })
);
});
it('opens a translation modal from quick actions and creates the translation on confirm', async () => {
(window as any).electronAPI.posts.get = vi.fn().mockResolvedValue(createPost({ title: '' }));
const view = render(<PostEditor postId="post-1" />);
const ui = within(view.container);
await act(async () => {
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
});
expect(ui.queryByRole('button', { name: 'Translate to...' })).toBeNull();
expect(ui.queryByText('Select target language')).toBeNull();
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: '⚡ Quick Actions' }));
});
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Translate to\.\.\./i }));
});
expect(ui.getByRole('heading', { name: 'Translations' })).toBeInTheDocument();
expect(ui.getByText('Select target language')).toBeInTheDocument();
await act(async () => {
fireEvent.change(ui.getByLabelText('Select target language'), { target: { value: 'fr' } });
});
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: 'Translate to...' }));
});
expect((window as any).electronAPI.chat.translatePost).toHaveBeenCalledWith('post-1', 'fr');
});
it('renders available translations as compact flag indicators in metadata', async () => {
(window as any).electronAPI.posts.get = vi.fn().mockResolvedValue(createPost({ title: '' }));
(window as any).electronAPI.posts.getTranslations = vi.fn().mockResolvedValue([
createTranslation(),
createTranslation({
id: 'translation-2',
language: 'de',
title: 'Hallo',
status: 'published',
filePath: 'posts/test-post.de.md',
}),
]);
const view = render(<PostEditor postId="post-1" />);
const ui = within(view.container);
const { container } = view;
await act(async () => {
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
});
expect(container.querySelector('.editor-translations-panel')).toBeNull();
expect(container.querySelector('.metadata-toggle-header .editor-translations-flags')).not.toBeNull();
expect(ui.getByLabelText('French (Draft)')).toBeInTheDocument();
expect(ui.getByLabelText('German (Published)')).toBeInTheDocument();
expect(container.querySelector('.editor-translations-flags')).not.toBeNull();
expect(container.querySelector('.editor-translation-actions')).toBeNull();
expect(container.querySelector('.editor-translation-language')).toBeNull();
});
it('switches the active editing language with flags and saves translated title excerpt and content to that language', async () => {
(window as any).electronAPI.posts.get = vi.fn().mockResolvedValue(createPost({
language: 'en',
title: 'Hello world',
excerpt: 'Canonical excerpt',
content: 'Canonical content',
}));
(window as any).electronAPI.posts.getTranslations = vi.fn().mockResolvedValue([
createTranslation({ language: 'fr', title: 'Bonjour', excerpt: 'Resume', content: 'Contenu' }),
]);
const view = render(<PostEditor postId="post-1" />);
const ui = within(view.container);
const { container } = view;
await act(async () => {
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
});
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Metadata/i }));
});
const flags = container.querySelectorAll('.metadata-toggle-header .editor-translation-flag');
expect(flags).toHaveLength(2);
expect(ui.getByDisplayValue('Hello world')).toBeInTheDocument();
await act(async () => {
fireEvent.click(ui.getByLabelText('French (Draft)'));
});
expect(ui.getByDisplayValue('Bonjour')).toBeInTheDocument();
expect((ui.getByLabelText('French (Draft)') as HTMLElement).className).toContain('active');
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Excerpt/i }));
});
expect(ui.getByDisplayValue('Resume')).toBeInTheDocument();
expect(ui.getByTestId('milkdown-editor')).toHaveValue('Contenu');
const titleInput = container.querySelector('#post-editor-post-1-title') as HTMLInputElement;
const excerptInput = container.querySelector('#post-editor-post-1-excerpt') as HTMLTextAreaElement;
const contentInput = ui.getByTestId('milkdown-editor') as HTMLTextAreaElement;
const setTextValue = (element: HTMLInputElement | HTMLTextAreaElement, value: string) => {
const prototype = Object.getPrototypeOf(element);
const valueSetter = Object.getOwnPropertyDescriptor(prototype, 'value')?.set;
fireEvent.focus(element);
valueSetter?.call(element, value);
fireEvent.input(element, { target: { value } });
fireEvent.change(element, { target: { value } });
fireEvent.blur(element);
};
await act(async () => {
setTextValue(titleInput, 'Salut modifie');
setTextValue(excerptInput, 'Resume modifie');
setTextValue(contentInput, 'Contenu modifie');
});
expect(ui.getByDisplayValue('Salut modifie')).toBeInTheDocument();
expect(ui.getByDisplayValue('Resume modifie')).toBeInTheDocument();
expect(ui.getByTestId('milkdown-editor')).toHaveValue('Contenu modifie');
await act(async () => {
await Promise.resolve();
await Promise.resolve();
});
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: 'Publish' }));
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
});
expect((window as any).electronAPI.posts.upsertTranslation).toHaveBeenCalledWith(
'post-1',
'fr',
expect.objectContaining({
title: 'Salut modifie',
excerpt: 'Resume modifie',
content: 'Contenu modifie',
})
);
});
it('requests preview URL with lang when a translation is the active editing language', async () => {
(window as any).electronAPI.posts.get = vi.fn().mockResolvedValue(createPost({
language: 'en',
title: 'Hello world',
content: 'Canonical content',
}));
(window as any).electronAPI.posts.getTranslations = vi.fn().mockResolvedValue([
createTranslation({ language: 'fr', title: 'Bonjour', content: 'Contenu' }),
]);
const view = render(<PostEditor postId="post-1" />);
const ui = within(view.container);
await act(async () => {
await Promise.resolve();
await Promise.resolve();
await Promise.resolve();
});
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: /Metadata/i }));
});
await act(async () => {
fireEvent.click(ui.getByLabelText('French (Draft)'));
});
await act(async () => {
fireEvent.click(ui.getByRole('button', { name: 'Preview (Read-only)' }));
await Promise.resolve();
await Promise.resolve();
});
expect((window as any).electronAPI.posts.getPreviewUrl).toHaveBeenLastCalledWith('post-1', {
draft: true,
lang: 'fr',
});
});
});

View File

@@ -124,7 +124,7 @@ vi.mock('../../../src/renderer/components/Toast', () => ({
},
}));
import { PostEditor } from '../../../src/renderer/components/Editor/Editor';
import { PostEditor } from '../../../src/renderer/components/Editor/PostEditor';
import { useAppStore } from '../../../src/renderer/store';
const createPost = () => ({

View File

@@ -63,6 +63,17 @@ describe('Help menu documentation entry', () => {
expect(APP_MENU_ACTION_EVENT_MAP.validateSite).toBe('menu:validateSite');
});
it('includes Validate Translations action in Blog menu', () => {
const blogGroup = APP_MENU_GROUPS.find((group) => group.label === 'Blog');
expect(blogGroup).toBeDefined();
expect(blogGroup?.items.some((item) => item.action === 'validateTranslations')).toBe(true);
});
it('maps Validate Translations to a renderer menu event', () => {
expect(APP_MENU_ACTION_EVENT_MAP.validateTranslations).toBe('menu:validateTranslations');
});
it('includes Regenerate Calendar action in Blog menu', () => {
const blogGroup = APP_MENU_GROUPS.find((group) => group.label === 'Blog');
@@ -96,4 +107,15 @@ describe('Help menu documentation entry', () => {
it('maps Edit Menu to a renderer menu event', () => {
expect(APP_MENU_ACTION_EVENT_MAP.editMenu).toBe('menu:editMenu');
});
it('includes Fill Missing Translations action in Blog menu', () => {
const blogGroup = APP_MENU_GROUPS.find((group) => group.label === 'Blog');
expect(blogGroup).toBeDefined();
expect(blogGroup?.items.some((item) => item.action === 'fillMissingTranslations')).toBe(true);
});
it('maps Fill Missing Translations to a renderer menu event', () => {
expect(APP_MENU_ACTION_EVENT_MAP.fillMissingTranslations).toBe('menu:fillMissingTranslations');
});
});

View File

@@ -21,6 +21,7 @@ describe('editorRouting', () => {
documentation: 'documentation',
'api-documentation': 'api-documentation',
'site-validation': 'site-validation',
'translation-validation': 'translation-validation',
scripts: 'scripts',
templates: 'templates',
'find-duplicates': 'find-duplicates',

View File

@@ -40,6 +40,24 @@ describe('postCreation', () => {
expect(result).toBeNull();
});
it('passes provided categories to createPost', async () => {
const createPost = vi.fn().mockResolvedValue({ id: 'page-1' });
const setSelectedPost = vi.fn();
await createAndFocusPost({
createPost,
setSelectedPost,
categories: ['page'],
});
expect(createPost).toHaveBeenCalledWith({
title: '',
content: '',
tags: [],
categories: ['page'],
});
});
it('returns null and reports errors', async () => {
const createPost = vi.fn().mockRejectedValue(new Error('fail'));
const setSelectedPost = vi.fn();

View File

@@ -29,6 +29,7 @@ describe('tabPolicy', () => {
expect(getSingletonToolTabSpec('documentation')).toEqual({ type: 'documentation', id: 'documentation', isTransient: false });
expect(getSingletonToolTabSpec('metadata-diff')).toEqual({ type: 'metadata-diff', id: 'metadata-diff', isTransient: false });
expect(getSingletonToolTabSpec('site-validation')).toEqual({ type: 'site-validation', id: 'site-validation', isTransient: false });
expect(getSingletonToolTabSpec('translation-validation')).toEqual({ type: 'translation-validation', id: 'translation-validation', isTransient: false });
});
it('opens singleton tool tabs using canonical tab spec', () => {

View File

@@ -0,0 +1,42 @@
import { describe, expect, it } from 'vitest';
import type { TranslationValidationReport } from '../../../src/main/shared/electronApi';
import {
getPersistedTranslationValidationReport,
persistTranslationValidationReport,
} from '../../../src/renderer/navigation/translationValidationPersistence';
const report: TranslationValidationReport = {
checkedDatabaseRowCount: 2,
checkedFilesystemFileCount: 3,
invalidDatabaseRows: [
{
issue: 'same-language-as-canonical',
translationId: 'translation-1',
translationFor: 'post-1',
canonicalLanguage: 'de',
translationLanguage: 'de',
title: 'Hallo Welt',
},
],
invalidFilesystemFiles: [
{
issue: 'missing-source-post',
translationFor: 'missing-post',
translationLanguage: 'it',
filePath: '/tmp/project/posts/orphan.it.md',
title: 'Ciao',
},
],
};
describe('translationValidationPersistence', () => {
it('persists and loads translation validation report by project', () => {
persistTranslationValidationReport('project-1', report);
expect(getPersistedTranslationValidationReport('project-1')).toEqual(report);
});
it('returns null when project has no persisted report', () => {
expect(getPersistedTranslationValidationReport('missing-project')).toBeNull();
});
});

View File

@@ -59,10 +59,10 @@ describe('pythonApiContractV1', () => {
});
});
it('exposes analyzeMediaImage and detectPostLanguage from chat namespace', () => {
it('exposes one-shot translation from chat namespace', () => {
const methodNames = listPythonApiMethodNames();
const chatMethods = methodNames.filter((m) => m.startsWith('chat.'));
expect(chatMethods).toEqual(['chat.analyzeMediaImage', 'chat.detectPostLanguage', 'chat.analyzePost']);
expect(chatMethods).toEqual(['chat.analyzeMediaImage', 'chat.detectPostLanguage', 'chat.analyzePost', 'chat.translatePost', 'chat.detectMediaLanguage', 'chat.translateMediaMetadata']);
});
it('documents chat.analyzeMediaImage contract with mediaId and language params', () => {
@@ -77,9 +77,21 @@ describe('pythonApiContractV1', () => {
});
});
it('documents chat.translatePost contract with postId and targetLanguage params', () => {
expect(getPythonApiMethodContract('chat.translatePost')).toEqual({
method: 'chat.translatePost',
description: 'Translate a post into a target language and save it as a translation draft.',
params: [
{ name: 'postId', type: 'string', required: true },
{ name: 'targetLanguage', type: 'string', required: true },
],
returns: 'PostTranslationResult',
});
});
it('contains semantic version metadata for compatibility checks', () => {
expect(BDS_PYTHON_API_CONTRACT_V1).toMatchObject({
version: '1.13.0',
version: '1.15.0',
generatedAt: expect.any(String),
});
});
@@ -116,6 +128,7 @@ describe('generatePythonApiModuleV1', () => {
expect(moduleCode).toContain('class ChatApi:');
expect(moduleCode).toContain('async def analyze_media_image(self, media_id, language=None):');
expect(moduleCode).toContain('async def detect_post_language(self, title, content):');
expect(moduleCode).toContain('async def translate_post(self, post_id, target_language):');
});
it('escapes python keyword method names to valid identifiers', () => {

View File

@@ -55,6 +55,27 @@ describe('invokePythonApiMethodV1', () => {
expect(getProjectMetadata).toHaveBeenCalledWith();
});
it('invokes chat.translatePost via electronAPI with validated args', async () => {
const translatePost = vi.fn().mockResolvedValue({
success: true,
translation: { id: 'tr-1', language: 'de' },
});
vi.stubGlobal('window', {
electronAPI: {
chat: {
translatePost,
},
},
});
await expect(invokePythonApiMethodV1('chat.translatePost', { postId: 'p1', targetLanguage: 'de' })).resolves.toEqual({
success: true,
translation: { id: 'tr-1', language: 'de' },
});
expect(translatePost).toHaveBeenCalledWith('p1', 'de');
});
it('rejects unknown methods and malformed args', async () => {
vi.stubGlobal('window', {
electronAPI: {