feat(renderer): ModalLayer shell (dispatches to 7 modal types)

This commit is contained in:
2026-06-05 18:36:28 +05:30
parent 41942a1316
commit 2bdb380130
2 changed files with 65 additions and 0 deletions
@@ -0,0 +1,33 @@
import { useAppStore } from '@/stores/app-store';
import { AboutDialog } from './AboutDialog';
import { ConfirmDialog } from './ConfirmDialog';
import { ExportBatchDialog } from './ExportBatchDialog';
import { ExportDocxDialog } from './ExportDocxDialog';
import { ExportHtmlDialog } from './ExportHtmlDialog';
import { ExportPdfDialog } from './ExportPdfDialog';
import { SettingsSheet } from './SettingsSheet';
import { WelcomeDialog } from './WelcomeDialog';
export function ModalLayer() {
const modal = useAppStore((s) => s.modal);
switch (modal.kind) {
case null:
return null;
case 'export-pdf':
return <ExportPdfDialog sourcePath={modal.props.sourcePath} />;
case 'export-docx':
return <ExportDocxDialog sourcePath={modal.props.sourcePath} />;
case 'export-html':
return <ExportHtmlDialog sourcePath={modal.props.sourcePath} />;
case 'export-batch':
return <ExportBatchDialog sourcePaths={modal.props.sourcePaths} />;
case 'settings':
return <SettingsSheet />;
case 'about':
return <AboutDialog />;
case 'welcome':
return <WelcomeDialog />;
case 'confirm':
return <ConfirmDialog {...modal.props} />;
}
}
@@ -0,0 +1,32 @@
import { describe, it, expect, beforeEach } from 'vitest';
import { render, screen } from '@testing-library/react';
import { ModalLayer } from '@/components/modals/ModalLayer';
import { useAppStore } from '@/stores/app-store';
describe('ModalLayer', () => {
beforeEach(() => {
localStorage.clear();
useAppStore.setState({ modal: { kind: null } } as any);
});
it('renders nothing when modal is null', () => {
const { container } = render(<ModalLayer />);
expect(container.firstChild).toBeNull();
});
it('renders AboutDialog when kind is "about"', () => {
useAppStore.getState().openModal('about');
render(<ModalLayer />);
expect(screen.getByRole('dialog')).toBeInTheDocument();
});
it('switches from about to settings when modal kind changes', () => {
useAppStore.getState().openModal('about');
const { rerender } = render(<ModalLayer />);
expect(screen.getByText(/about markdownconverter/i)).toBeInTheDocument();
useAppStore.getState().openModal('settings');
rerender(<ModalLayer />);
expect(screen.queryByText(/about markdownconverter/i)).not.toBeInTheDocument();
expect(screen.getByText(/settings/i)).toBeInTheDocument();
});
});