@cccsaurora/howler-ui 3.1.0-dev.1656 → 3.1.0-dev.1657

package/components/routes/hits/search/shared/LayoutSettings.test.js

@@ -0,0 +1,84 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { fireEvent, render, screen } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+const recordSearchContextToken = vi.hoisted(() => ({ name: 'record-search' }));
+const mockSetDisplayType = vi.hoisted(() => vi.fn());
+const mockSetHitLayout = vi.hoisted(() => vi.fn());
+const mockSetTemplateFieldCount = vi.hoisted(() => vi.fn());
+let localStorageValues = {};
+let storageCall = 0;
+vi.mock('@mui/icons-material', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        ArrowDropDown: () => _jsx("div", { children: "arrow-icon" }),
+        InfoOutlined: () => _jsx("div", { children: "info-icon" }),
+        Settings: () => _jsx("div", { children: "settings-icon" }),
+        ViewComfy: () => _jsx("div", { children: "comfy-icon" }),
+        ViewCompact: () => _jsx("div", { children: "compact-icon" }),
+        ViewModule: () => _jsx("div", { children: "normal-icon" })
+    };
+});
+vi.mock('@mui/material', () => ({
+    Checkbox: ({ checked, onChange }) => (_jsx("input", { "aria-label": "field-toggle", type: "checkbox", checked: checked, onChange: e => onChange(null, e.target.checked) })),
+    Divider: () => _jsx("div", { children: "divider" }),
+    FormLabel: ({ children }) => _jsx("div", { children: children }),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    TextField: ({ value, onChange, disabled }) => (_jsx("input", { "aria-label": "field-count", disabled: disabled, value: value, onChange: onChange })),
+    ToggleButton: ({ children, value }) => _jsx("button", { "data-value": value, children: children }),
+    ToggleButtonGroup: ({ onChange, children }) => (_jsxs("div", { children: [_jsx("button", { onClick: () => onChange(null, 'dense'), children: "set-layout" }), children] })),
+    Tooltip: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/app/providers/RecordSearchProvider', () => ({
+    RecordSearchContext: recordSearchContextToken
+}));
+vi.mock('components/elements/display/ChipPopper', () => ({
+    default: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/hit/HitLayout', () => ({
+    HitLayout: { DENSE: 'dense', NORMAL: 'normal', COMFY: 'comfy' }
+}));
+vi.mock('components/elements/view/LayoutToggle', () => ({
+    __esModule: true,
+    default: ({ setDisplayType }) => _jsx("button", { onClick: () => setDisplayType('grid'), children: "layout-toggle" })
+}));
+vi.mock('components/hooks/useMyLocalStorage', () => ({
+    useMyLocalStorageItem: (_key) => {
+        storageCall += 1;
+        if (storageCall % 2 === 1)
+            return [localStorageValues.hitLayout, mockSetHitLayout];
+        return [localStorageValues.templateFieldCount, mockSetTemplateFieldCount];
+    }
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('use-context-selector', () => ({
+    useContextSelector: (_context, selector) => selector({ displayType: 'list', setDisplayType: mockSetDisplayType })
+}));
+import LayoutSettings from './LayoutSettings';
+describe('LayoutSettings', () => {
+    beforeEach(() => {
+        localStorageValues = { hitLayout: 'normal', templateFieldCount: null };
+        storageCall = 0;
+        mockSetDisplayType.mockReset();
+        mockSetHitLayout.mockReset();
+        mockSetTemplateFieldCount.mockReset();
+    });
+    it('updates display type, layout, and template field count settings', () => {
+        const { unmount } = render(_jsx(LayoutSettings, {}));
+        fireEvent.click(screen.getByText('layout-toggle'));
+        expect(mockSetDisplayType).toHaveBeenCalledWith('grid');
+        fireEvent.click(screen.getByText('set-layout'));
+        expect(mockSetHitLayout).toHaveBeenCalledWith('dense');
+        fireEvent.click(screen.getByLabelText('field-toggle'));
+        expect(mockSetTemplateFieldCount).toHaveBeenCalledWith(3);
+        localStorageValues.templateFieldCount = 3;
+        storageCall = 0;
+        unmount();
+        render(_jsx(LayoutSettings, {}));
+        fireEvent.change(screen.getByLabelText('field-count'), { target: { value: '20' } });
+        expect(mockSetTemplateFieldCount).toHaveBeenCalledWith(15);
+    });
+});

package/components/routes/hits/search/shared/SearchSpan.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/routes/hits/search/shared/SearchSpan.test.js

@@ -0,0 +1,84 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+const parameterContextToken = vi.hoisted(() => ({ name: 'parameter-context' }));
+const viewContextToken = vi.hoisted(() => ({ name: 'view-context' }));
+const mockSetSpan = vi.hoisted(() => vi.fn());
+const mockGetCurrentViews = vi.hoisted(() => vi.fn());
+let locationValue = { search: '' };
+let parameterValue = {
+    views: [],
+    span: 'date.range.1.day',
+    setSpan: mockSetSpan,
+    startDate: undefined,
+    endDate: undefined
+};
+vi.mock('@mui/icons-material', async (importOriginal) => {
+    const actual = await importOriginal();
+    return { ...actual, AvTimer: () => _jsx("div", { children: "timer-icon" }) };
+});
+vi.mock('@mui/material', () => ({
+    Autocomplete: ({ onChange, options }) => (_jsx("button", { onClick: () => onChange(null, options.at(-1)), children: "change-span" })),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    TextField: ({ label }) => _jsx("div", { children: label }),
+    Typography: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/app/providers/ParameterProvider', () => ({
+    ParameterContext: parameterContextToken
+}));
+vi.mock('components/app/providers/ViewProvider', () => ({
+    ViewContext: viewContextToken
+}));
+vi.mock('components/elements/display/ChipPopper', () => ({
+    default: ({ children, label }) => (_jsxs("div", { children: [_jsx("div", { children: label }), children] }))
+}));
+vi.mock('dayjs', () => ({
+    default: () => ({ subtract: () => ({ format: () => '2024-01-01 00:00' }) })
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('react-router', () => ({
+    useLocation: () => locationValue
+}));
+vi.mock('use-context-selector', () => ({
+    useContextSelector: (context, selector) => selector(context === parameterContextToken ? parameterValue : { getCurrentViews: mockGetCurrentViews })
+}));
+vi.mock('utils/utils', () => ({
+    convertLuceneToDate: (value) => `converted:${value}`
+}));
+vi.mock('./CustomSpan', () => ({
+    default: () => _jsx("div", { children: "custom-span" })
+}));
+import SearchSpan from './SearchSpan';
+describe('SearchSpan', () => {
+    beforeEach(() => {
+        locationValue = { search: '' };
+        parameterValue = {
+            views: [],
+            span: 'date.range.1.day',
+            setSpan: mockSetSpan,
+            startDate: undefined,
+            endDate: undefined
+        };
+        mockSetSpan.mockReset();
+        mockGetCurrentViews.mockReset();
+    });
+    it('loads the span from the current view and handles custom selection', async () => {
+        mockGetCurrentViews.mockResolvedValueOnce([{ span: 'date.range.1.week' }]);
+        render(_jsx(SearchSpan, {}));
+        await waitFor(() => expect(mockSetSpan).toHaveBeenCalledWith('date.range.1.week'));
+        fireEvent.click(screen.getByText('change-span'));
+        expect(mockSetSpan).toHaveBeenCalledWith('date.range.custom');
+        expect(screen.getByText('custom-span')).toBeInTheDocument();
+    });
+    it('converts lucene date spans and skips view lookup when span is already in the URL', async () => {
+        mockGetCurrentViews.mockResolvedValueOnce([{ span: '2024-01-01T00:00:00Z:2024-01-02T00:00:00Z' }]);
+        render(_jsx(SearchSpan, {}));
+        await waitFor(() => expect(mockSetSpan).toHaveBeenCalledWith('converted:2024-01-01T00:00:00Z:2024-01-02T00:00:00Z'));
+        locationValue = { search: '?span=date.range.1.month' };
+        render(_jsx(SearchSpan, { omitCustom: true }));
+        expect(mockGetCurrentViews).toHaveBeenCalledTimes(1);
+    });
+});

package/components/routes/home/AnalyticCard.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/routes/home/AnalyticCard.test.js

@@ -0,0 +1,87 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+const mockGetAnalyticFromId = vi.hoisted(() => vi.fn());
+const resetZoom = vi.fn();
+const analyticContextToken = vi.hoisted(() => ({ name: 'analytic-context' }));
+vi.mock('@mui/icons-material', () => ({
+    CenterFocusWeak: () => _jsx("div", { children: "reset-icon" }),
+    OpenInNew: () => _jsx("div", { children: "open-icon" })
+}));
+vi.mock('@mui/material', () => ({
+    Box: ({ children }) => _jsx("div", { children: children }),
+    Card: ({ children }) => _jsx("div", { children: children }),
+    CardContent: ({ children }) => _jsx("div", { children: children }),
+    IconButton: ({ children, onClick }) => _jsx("button", { onClick: onClick, children: children }),
+    Skeleton: () => _jsx("div", { children: "loading" }),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    Tooltip: ({ children }) => _jsx("div", { children: children }),
+    Typography: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/app/providers/AnalyticProvider', () => ({
+    AnalyticContext: analyticContextToken
+}));
+vi.mock('components/elements/addons/layout/FlexOne', () => ({
+    default: () => _jsx("div", { children: "flex" })
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context === analyticContextToken)
+                return { getAnalyticFromId: mockGetAnalyticFromId };
+            return actual.useContext(context);
+        }
+    };
+});
+vi.mock('react-router', () => ({
+    Link: ({ children, to }) => _jsx("a", { href: to, children: children })
+}));
+vi.mock('../analytics/widgets/Assessment', () => ({
+    default: () => _jsx("div", { children: "assessment-widget" })
+}));
+vi.mock('../analytics/widgets/Created', () => ({
+    default: (_props) => {
+        if (_props.ref)
+            _props.ref.current = { resetZoom };
+        return _jsx("div", { children: "created-widget" });
+    }
+}));
+vi.mock('../analytics/widgets/Detection', () => ({
+    default: () => _jsx("div", { children: "detection-widget" })
+}));
+vi.mock('../analytics/widgets/Escalation', () => ({
+    default: () => _jsx("div", { children: "escalation-widget" })
+}));
+vi.mock('../analytics/widgets/Status', () => ({
+    default: () => _jsx("div", { children: "status-widget" })
+}));
+import AnalyticCard from './AnalyticCard';
+describe('AnalyticCard', () => {
+    beforeEach(() => {
+        mockGetAnalyticFromId.mockReset();
+        resetZoom.mockReset();
+    });
+    it('loads analytic details and renders created charts with reset control', async () => {
+        mockGetAnalyticFromId.mockResolvedValue({ analytic_id: 'a1', name: 'Analytic One' });
+        render(_jsx(AnalyticCard, { analyticId: "a1", type: "created" }));
+        expect(screen.getByText('loading')).toBeInTheDocument();
+        await waitFor(() => expect(screen.getByText('Analytic One')).toBeInTheDocument());
+        expect(screen.getByText('created-widget')).toBeInTheDocument();
+        fireEvent.click(screen.getAllByRole('button')[1]);
+        expect(resetZoom).toHaveBeenCalled();
+    });
+    it('renders the assessment and escalation widget variants', async () => {
+        mockGetAnalyticFromId.mockResolvedValue({ analytic_id: 'a2', name: 'Analytic Two' });
+        const { rerender } = render(_jsx(AnalyticCard, { analyticId: "a2", type: "assessment" }));
+        await waitFor(() => expect(screen.getByText('assessment-widget')).toBeInTheDocument());
+        rerender(_jsx(AnalyticCard, { analyticId: "a2", type: "escalation" }));
+        await act(async () => { });
+        expect(screen.getByText('escalation-widget')).toBeInTheDocument();
+    });
+});

package/components/routes/home/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/routes/home/index.test.js

@@ -0,0 +1,190 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+const mockDispatchApi = vi.hoisted(() => vi.fn());
+const mockSetDashboard = vi.hoisted(() => vi.fn());
+const mockSetRefreshRateBackend = vi.hoisted(() => vi.fn());
+const mockSetLastViewed = vi.hoisted(() => vi.fn());
+const mockSetUser = vi.hoisted(() => vi.fn());
+const mockAddToAppBar = vi.hoisted(() => vi.fn());
+const mockRemoveFromAppBar = vi.hoisted(() => vi.fn());
+const appBarContextToken = vi.hoisted(() => ({ name: 'app-bar-context' }));
+let currentUser;
+let searchResult = { total: 0 };
+vi.mock('@dnd-kit/core', () => ({
+    DndContext: ({ children }) => _jsx("div", { children: children }),
+    KeyboardSensor: function KeyboardSensor() { },
+    PointerSensor: function PointerSensor() { },
+    closestCenter: {},
+    useSensor: vi.fn(() => ({})),
+    useSensors: vi.fn(() => [])
+}));
+vi.mock('@dnd-kit/sortable', () => ({
+    SortableContext: ({ children }) => _jsx("div", { children: children }),
+    arrayMove: (arr, oldIndex, newIndex) => {
+        const next = [...arr];
+        const [item] = next.splice(oldIndex, 1);
+        next.splice(newIndex, 0, item);
+        return next;
+    },
+    sortableKeyboardCoordinates: vi.fn()
+}));
+vi.mock('@mui/icons-material', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        Cancel: () => _jsx("div", { children: "cancel-icon" }),
+        Check: () => _jsx("div", { children: "check-icon" }),
+        Close: () => _jsx("div", { children: "close-icon" }),
+        OpenInNew: () => _jsx("div", { children: "open-icon" })
+    };
+});
+vi.mock('@mui/material', () => ({
+    Alert: ({ children, action }) => (_jsxs("div", { children: [children, action] })),
+    AlertTitle: ({ children }) => _jsx("div", { children: children }),
+    CircularProgress: () => _jsx("div", { children: "loading" }),
+    Grid: ({ children }) => _jsx("div", { children: children }),
+    IconButton: ({ children, onClick, component, to }) => (_jsx("button", { "data-component": String(!!component), "data-to": to, onClick: onClick, children: children })),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    Typography: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('@tui/core', () => ({
+    PageCenter: ({ children }) => _jsx("div", { children: children }),
+    useAppUser: () => ({ user: currentUser, setUser: mockSetUser })
+}));
+vi.mock('api', () => ({
+    default: {
+        search: {
+            hit: {
+                post: (payload) => payload
+            }
+        }
+    }
+}));
+vi.mock('branding/AppBrand', () => ({
+    AppBrand: () => _jsx("div", { children: "brand" })
+}));
+vi.mock('components/app/providers/AppBarProvider', () => ({
+    AppBarContext: appBarContextToken
+}));
+vi.mock('components/elements/addons/buttons/CustomButton', () => ({
+    default: ({ children, onClick, disabled }) => (_jsx("button", { disabled: disabled, onClick: onClick, children: children }))
+}));
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({ dispatchApi: mockDispatchApi })
+}));
+vi.mock('components/hooks/useMyLocalStorage', () => ({
+    useMyLocalStorageItem: () => ['2024-01-01T00:00:00', mockSetLastViewed]
+}));
+vi.mock('components/hooks/useMyUserFunctions', () => ({
+    default: () => ({
+        setDashboard: mockSetDashboard,
+        setRefreshRate: mockSetRefreshRateBackend
+    })
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({
+        t: (key, opts) => (opts?.count ? `${key}:${opts.count}` : key)
+    })
+}));
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context === appBarContextToken) {
+                return { addToAppBar: mockAddToAppBar, removeFromAppBar: mockRemoveFromAppBar };
+            }
+            return actual.useContext(context);
+        }
+    };
+});
+vi.mock('react-router', () => ({
+    Link: ({ children, to }) => _jsx("a", { href: to, children: children })
+}));
+vi.mock('../ErrorBoundary', () => ({
+    default: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('./AddNewCard', () => ({
+    default: ({ addCard }) => (_jsx("button", { onClick: () => addCard({
+            entry_id: 'new-entry',
+            type: 'view',
+            config: JSON.stringify({ viewId: 'new-view' })
+        }), children: "add-card" }))
+}));
+vi.mock('./AnalyticCard', () => ({
+    default: ({ analyticId, type }) => _jsx("div", { children: `analytic:${analyticId}:${type}` })
+}));
+vi.mock('./EntryWrapper', () => ({
+    default: ({ children, onDelete, id, editing }) => (_jsxs("div", { children: [_jsx("span", { children: `entry:${id}:${String(editing)}` }), _jsx("button", { onClick: onDelete, children: "delete-entry" }), children] }))
+}));
+vi.mock('./HomeSettings', () => ({
+    default: () => null
+}));
+vi.mock('./ViewCard', () => ({
+    default: ({ viewId }) => _jsx("div", { children: `view:${viewId}` })
+}));
+vi.mock('./ViewRefresh', () => ({
+    default: () => null
+}));
+import Home from './index';
+describe('Home', () => {
+    beforeEach(() => {
+        currentUser = {
+            username: 'alice',
+            dashboard: [],
+            refresh_rate: 15
+        };
+        searchResult = { total: 0 };
+        mockDispatchApi.mockReset();
+        mockDispatchApi.mockImplementation(async () => searchResult);
+        mockSetDashboard.mockReset().mockResolvedValue(undefined);
+        mockSetRefreshRateBackend.mockReset().mockResolvedValue(undefined);
+        mockSetLastViewed.mockReset();
+        mockSetUser.mockReset();
+        mockAddToAppBar.mockReset();
+        mockRemoveFromAppBar.mockReset();
+    });
+    it('renders the empty state and updated-hit alert actions', async () => {
+        searchResult = { total: 2 };
+        render(_jsx(Home, {}));
+        await waitFor(() => expect(screen.getByText('route.home.alert.updated.description:2')).toBeInTheDocument());
+        expect(screen.getByText('route.home.title')).toBeInTheDocument();
+        expect(screen.getByText('route.home.description')).toBeInTheDocument();
+        fireEvent.click(screen.getAllByRole('button')[1]);
+        expect(mockSetLastViewed).toHaveBeenCalled();
+        await waitFor(() => expect(screen.queryByText('route.home.alert.updated.description:2')).not.toBeInTheDocument());
+    });
+    it('registers app bar actions, debounces refresh-rate saves, and saves dashboard edits', async () => {
+        currentUser = {
+            username: 'alice',
+            refresh_rate: 15,
+            dashboard: [
+                { entry_id: 'view-entry', type: 'view', config: JSON.stringify({ viewId: 'view-1' }) },
+                { entry_id: 'analytic-entry', type: 'analytic', config: JSON.stringify({ analyticId: 'a1', type: 'created' }) }
+            ]
+        };
+        render(_jsx(Home, {}));
+        await waitFor(() => expect(screen.getByText('view:view-1')).toBeInTheDocument());
+        expect(screen.getByText('analytic:a1:created')).toBeInTheDocument();
+        expect(mockAddToAppBar).toHaveBeenCalledWith('left', 'view_refresh', expect.anything());
+        expect(mockAddToAppBar).toHaveBeenCalledWith('left', 'home_settings', expect.anything());
+        const homeSettings = mockAddToAppBar.mock.calls.find(([, key]) => key === 'home_settings')[2];
+        await act(async () => {
+            homeSettings.props.onEdit();
+        });
+        expect(screen.getByText('cancel')).toBeInTheDocument();
+        await act(async () => {
+            homeSettings.props.onRefreshRateChange(30);
+            await new Promise(resolve => setTimeout(resolve, 550));
+        });
+        expect(mockSetRefreshRateBackend).toHaveBeenCalledWith(30);
+        fireEvent.click(screen.getByText('add-card'));
+        const saveButton = screen.getByText('save');
+        expect(saveButton).not.toBeDisabled();
+        fireEvent.click(saveButton);
+        await waitFor(() => expect(mockSetDashboard).toHaveBeenCalled());
+        expect(mockSetUser).toHaveBeenCalled();
+    });
+});

package/components/routes/overviews/OverviewViewer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/routes/overviews/OverviewViewer.test.js

@@ -0,0 +1,151 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+const mockDispatchApi = vi.hoisted(() => vi.fn());
+const mockShowSuccessMessage = vi.hoisted(() => vi.fn());
+const mockSetSearchParams = vi.hoisted(() => vi.fn());
+const mockWithConfirmDeleteModal = vi.hoisted(() => vi.fn((cb) => cb()));
+const mockGetOverviews = vi.hoisted(() => vi.fn());
+const mockOverviewPut = vi.hoisted(() => vi.fn((id, content) => ({ id, content })));
+const mockOverviewDelete = vi.hoisted(() => vi.fn((id) => ({ id })));
+const modalContextToken = vi.hoisted(() => ({ name: 'modal-context' }));
+const overviewContextToken = vi.hoisted(() => ({ name: 'overview-context' }));
+let searchParamsValue = new URLSearchParams('analytic=Alpha');
+vi.mock('@mui/icons-material', () => ({
+    Check: () => _jsx("div", { children: "check-icon" }),
+    DarkMode: () => _jsx("div", { children: "dark-icon" }),
+    Delete: () => _jsx("div", { children: "delete-icon" }),
+    WbSunny: () => _jsx("div", { children: "light-icon" })
+}));
+vi.mock('@mui/material', () => ({
+    Autocomplete: ({ options, value, onChange, renderInput }) => (_jsxs("div", { children: [renderInput({}), _jsx("button", { onClick: () => onChange(null, options[0] ?? null), children: typeof value === 'object' ? value?.name : value || 'empty' })] })),
+    Box: ({ children, onMouseDown, onKeyDown }) => (_jsx("div", { onMouseDown: onMouseDown, onKeyDown: onKeyDown, children: children })),
+    Button: ({ children, onClick, disabled }) => (_jsx("button", { onClick: onClick, disabled: disabled, children: children })),
+    CircularProgress: () => _jsx("div", { children: "loading" }),
+    Divider: () => _jsx("div", { children: "divider" }),
+    FormControl: ({ children }) => _jsx("div", { children: children }),
+    LinearProgress: () => _jsx("div", { children: "progress" }),
+    Stack: ({ children, onKeyDown }) => _jsx("div", { onKeyDown: onKeyDown, children: children }),
+    TextField: ({ label, size }) => _jsx("div", { children: label ?? size }),
+    ThemeProvider: ({ children }) => _jsx("div", { children: children }),
+    ToggleButton: ({ children, value }) => _jsx("button", { "data-value": value, children: children }),
+    ToggleButtonGroup: ({ children, onChange }) => (_jsxs("div", { children: [_jsx("button", { onClick: () => onChange(null, 'dark'), children: "switch-dark" }), children] })),
+    Tooltip: ({ children }) => _jsx(_Fragment, { children: children }),
+    useTheme: () => ({ palette: { divider: '#ddd' }, shape: { borderRadius: 4 } })
+}));
+vi.mock('@tui/core', () => ({
+    AppInfoPanel: ({ i18nKey }) => _jsx("div", { children: i18nKey }),
+    PageCenter: ({ children }) => _jsx("div", { children: children }),
+    useAppTheme: () => ({ current: 'default', optionsOverride: {}, mode: 'light' }),
+    useAppThemeBuilder: () => () => ({
+        lightTheme: { palette: { background: { default: '#fff' }, text: { primary: '#111' } } },
+        darkTheme: { palette: { background: { default: '#000' }, text: { primary: '#eee' } } }
+    })
+}));
+vi.mock('api', () => ({
+    default: {
+        search: {
+            analytic: { post: (body) => body },
+            hit: { post: (body) => body }
+        },
+        overview: {
+            put: mockOverviewPut,
+            del: mockOverviewDelete
+        }
+    }
+}));
+vi.mock('components/app/providers/ModalProvider', () => ({
+    ModalContext: modalContextToken
+}));
+vi.mock('components/app/providers/OverviewProvider', () => ({
+    OverviewContext: overviewContextToken
+}));
+vi.mock('components/elements/hit/HitOverview', () => ({
+    default: ({ content, hit }) => _jsx("div", { children: `${content}|${hit?.howler?.analytic}|${hit?.howler?.detection ?? ''}` })
+}));
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({ dispatchApi: mockDispatchApi })
+}));
+vi.mock('components/hooks/useMySnackbar', () => ({
+    default: () => ({ showSuccessMessage: mockShowSuccessMessage })
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('react-router', () => ({
+    useSearchParams: () => [searchParamsValue, mockSetSearchParams]
+}));
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context === modalContextToken)
+                return { withConfirmDeleteModal: mockWithConfirmDeleteModal };
+            if (context === overviewContextToken)
+                return { getOverviews: mockGetOverviews };
+            return actual.useContext(context);
+        }
+    };
+});
+vi.mock('utils/exampleHit', () => ({
+    getExampleHit: () => ({ howler: { analytic: 'example', detection: 'fallback' } })
+}));
+vi.mock('utils/stringUtils', () => ({
+    sanitizeLuceneQuery: (value) => value
+}));
+vi.mock('./startingTemplate', () => ({
+    useStartingTemplate: () => 'starting-template'
+}));
+vi.mock('../../elements/MarkdownEditor', () => ({
+    default: ({ content, setContent }) => (_jsxs("div", { children: [_jsx("div", { children: content }), _jsx("button", { onClick: () => setContent('updated-content'), children: "edit-content" })] }))
+}));
+import OverviewViewer from './OverviewViewer';
+describe('OverviewViewer', () => {
+    beforeEach(() => {
+        searchParamsValue = new URLSearchParams('analytic=Alpha');
+        mockDispatchApi.mockReset();
+        mockDispatchApi.mockResolvedValue({ items: [] });
+        mockShowSuccessMessage.mockReset();
+        mockSetSearchParams.mockReset();
+        mockWithConfirmDeleteModal.mockClear();
+        mockGetOverviews.mockReset();
+        mockOverviewPut.mockClear();
+        mockOverviewDelete.mockClear();
+    });
+    it('loads an overview, saves edited content, and deletes it', async () => {
+        mockGetOverviews.mockResolvedValueOnce([{ overview_id: 'ov-1', analytic: 'Alpha', content: 'stored-content' }]);
+        mockDispatchApi.mockImplementation(async (request) => {
+            if (request?.query === 'analytic_id:*')
+                return { items: [{ name: 'Alpha', detections: ['det-1'] }] };
+            if (request?.fl === '*')
+                return { items: [] };
+            if (request?.content === 'updated-content')
+                return { overview_id: 'ov-1', analytic: 'Alpha', content: 'updated-content' };
+            return {};
+        });
+        render(_jsx(OverviewViewer, {}));
+        await waitFor(() => expect(screen.getByText('stored-content|Alpha|ANY')).toBeInTheDocument());
+        expect(mockSetSearchParams).toHaveBeenCalled();
+        fireEvent.click(screen.getByText('edit-content'));
+        fireEvent.click(screen.getByText('button.save'));
+        await waitFor(() => expect(mockOverviewPut).toHaveBeenCalledWith('ov-1', 'updated-content'));
+        fireEvent.click(screen.getByText('button.delete'));
+        await waitFor(() => expect(mockOverviewDelete).toHaveBeenCalledWith('ov-1'));
+        expect(mockShowSuccessMessage).toHaveBeenCalledWith('route.overviews.manager.delete.success');
+    });
+    it('renders the selection prompt when no analytic is selected', async () => {
+        searchParamsValue = new URLSearchParams();
+        mockGetOverviews.mockResolvedValueOnce([]);
+        mockDispatchApi.mockImplementation(async (request) => {
+            if (request?.query === 'analytic_id:*')
+                return { items: [] };
+            if (request?.fl === '*')
+                return { items: [] };
+            return {};
+        });
+        render(_jsx(OverviewViewer, {}));
+        await waitFor(() => expect(screen.getByText('route.overviews.select')).toBeInTheDocument());
+    });
+});

package/components/routes/overviews/Overviews.test.d.ts

@@ -0,0 +1 @@
+export {};