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

package/components/routes/hits/search/RecordQuery.test.js

@@ -0,0 +1,117 @@
+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 mockTriggerSearch = vi.hoisted(() => vi.fn());
+const mockOnChange = vi.hoisted(() => vi.fn());
+const mockSetValue = vi.hoisted(() => vi.fn());
+const mockActionDispose = vi.hoisted(() => vi.fn());
+const mockKeybindingDispose = vi.hoisted(() => vi.fn());
+const parameterContextToken = vi.hoisted(() => ({ name: 'parameter-context' }));
+const recordSearchContextToken = vi.hoisted(() => ({ name: 'record-search-context' }));
+let parameterContextValue;
+let recordSearchContextValue;
+let locationValue = { search: '' };
+vi.mock('@monaco-editor/react', () => ({
+    useMonaco: () => ({
+        KeyMod: { CtrlCmd: 1 },
+        KeyCode: { Enter: 2 },
+        editor: {
+            addEditorAction: () => ({ dispose: mockActionDispose }),
+            addKeybindingRule: () => ({ dispose: mockKeybindingDispose })
+        }
+    })
+}));
+vi.mock('@mui/icons-material', () => ({
+    Clear: () => _jsx("div", { children: "clear-icon" }),
+    Height: () => _jsx("div", { children: "height-icon" }),
+    History: () => _jsx("div", { children: "history-icon" }),
+    Search: () => _jsx("div", { children: "search-icon" })
+}));
+vi.mock('@mui/material', () => ({
+    Badge: ({ children }) => _jsx("div", { children: children }),
+    Box: ({ children, onMouseDown }) => _jsx("div", { onMouseDown: onMouseDown, children: children }),
+    Card: ({ children, onKeyDown }) => _jsx("div", { onKeyDown: onKeyDown, children: children }),
+    Skeleton: () => _jsx("div", { children: "loading" }),
+    Tooltip: ({ children }) => _jsx(_Fragment, { children: children }),
+    alpha: () => 'rgba(0,0,0,0.5)',
+    useTheme: () => ({
+        spacing: (n) => `${n}px`,
+        palette: { text: { primary: '#111' }, divider: '#ddd', background: { paper: '#fff' } },
+        transitions: { create: () => 'transition' }
+    })
+}));
+vi.mock('components/app/providers/ParameterProvider', () => ({
+    ParameterContext: parameterContextToken
+}));
+vi.mock('components/app/providers/RecordSearchProvider', () => ({
+    RecordSearchContext: recordSearchContextToken
+}));
+vi.mock('components/elements/addons/buttons/CustomIconButton', () => ({
+    default: ({ children, onClick, disabled }) => (_jsx("button", { onClick: onClick, disabled: disabled, children: children }))
+}));
+vi.mock('components/routes/advanced/QueryEditor', () => ({
+    default: ({ query, setQuery, onMount }) => {
+        return (_jsxs("div", { children: [_jsx("div", { children: query }), _jsx("button", { onClick: () => setQuery('line1\nline2'), children: "set-multiline-query" }), _jsx("button", { onClick: () => onMount?.({ createContextKey: vi.fn() }), children: "mount-editor" })] }));
+    }
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('react-router', () => ({
+    useLocation: () => locationValue
+}));
+vi.mock('use-context-selector', () => ({
+    useContextSelector: (context, selector) => {
+        if (context === parameterContextToken)
+            return selector(parameterContextValue);
+        if (context === recordSearchContextToken)
+            return selector(recordSearchContextValue);
+        return undefined;
+    }
+}));
+vi.mock('utils/constants', () => ({
+    DEFAULT_QUERY: '*:*'
+}));
+vi.mock('utils/stringUtils', () => ({
+    sanitizeMultilineLucene: (value) => value.replace(/\n/g, ' ').trim()
+}));
+import RecordQuery from './RecordQuery';
+describe('RecordQuery', () => {
+    beforeEach(() => {
+        parameterContextValue = { query: 'status:open' };
+        recordSearchContextValue = { fzfSearch: true };
+        locationValue = { search: '?query=status:open' };
+        mockTriggerSearch.mockReset();
+        mockOnChange.mockReset();
+        mockSetValue.mockReset();
+        mockActionDispose.mockReset();
+        mockKeybindingDispose.mockReset();
+        window.history.replaceState({}, '', '/?query=status:open');
+    });
+    it('reports dirty state, toggles multiline, clears the query, and triggers searches', async () => {
+        render(_jsx(RecordQuery, { triggerSearch: mockTriggerSearch, onChange: mockOnChange }));
+        fireEvent.click(screen.getByText('mount-editor'));
+        await waitFor(() => expect(mockOnChange).toHaveBeenCalledWith('status:open', false));
+        expect(screen.getByText('history-icon')).toBeInTheDocument();
+        fireEvent.click(screen.getByText('height-icon'));
+        fireEvent.click(screen.getByText('set-multiline-query'));
+        await waitFor(() => expect(mockOnChange).toHaveBeenLastCalledWith('line1\nline2', true));
+        fireEvent.click(screen.getByText('search-icon'));
+        expect(mockTriggerSearch).toHaveBeenCalledWith('line1 line2');
+        fireEvent.click(screen.getByText('clear-icon'));
+        await waitFor(() => expect(mockOnChange).toHaveBeenLastCalledWith('*:*', true));
+    });
+    it('disables actions and updates when the saved query changes', async () => {
+        const { rerender, unmount } = render(_jsx(RecordQuery, { triggerSearch: mockTriggerSearch, onChange: mockOnChange, searching: true, disabled: true, compact: true }));
+        fireEvent.click(screen.getByText('mount-editor'));
+        expect(screen.getAllByRole('button').filter(button => button.hasAttribute('disabled')).length).toBeGreaterThanOrEqual(3);
+        parameterContextValue.query = 'priority:high';
+        locationValue = { search: '' };
+        rerender(_jsx(RecordQuery, { triggerSearch: mockTriggerSearch, onChange: mockOnChange }));
+        await waitFor(() => expect(mockOnChange).toHaveBeenLastCalledWith('priority:high', false));
+        unmount();
+        expect(mockActionDispose).toHaveBeenCalled();
+        expect(mockKeybindingDispose).toHaveBeenCalled();
+    });
+});

package/components/routes/hits/search/SearchPane.test.d.ts

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

package/components/routes/hits/search/SearchPane.test.js

@@ -0,0 +1,178 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { fireEvent, render, screen } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+const mockSetOffset = vi.hoisted(() => vi.fn());
+const mockTriggerSearch = vi.hoisted(() => vi.fn());
+const mockOnClick = vi.hoisted(() => vi.fn());
+const parameterContextToken = vi.hoisted(() => ({ name: 'parameter-context' }));
+const recordContextToken = vi.hoisted(() => ({ name: 'record-context' }));
+const searchContextToken = vi.hoisted(() => ({ name: 'search-context' }));
+let contextValues;
+vi.mock('@mui/icons-material', () => ({
+    ErrorOutline: () => _jsx("div", { children: "error-icon" })
+}));
+vi.mock('@mui/material', () => ({
+    Alert: ({ children }) => _jsx("div", { children: children }),
+    AlertTitle: ({ children }) => _jsx("div", { children: children }),
+    Box: ({ children, id, onAuxClick, onClick, flex }) => (_jsx("div", { id: id, "data-flex": flex, onAuxClick: onAuxClick, onClick: onClick, children: children })),
+    LinearProgress: () => _jsx("div", { children: "loading-bar" }),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    Tooltip: ({ children }) => _jsx(_Fragment, { children: children }),
+    Typography: ({ children }) => _jsx("div", { children: children }),
+    useMediaQuery: () => false,
+    useTheme: () => ({
+        transitions: { create: () => 'transition' },
+        palette: { primary: { main: '#00f' }, text: { secondary: '#666' } },
+        shape: { borderRadius: 4 }
+    })
+}));
+vi.mock('@mui/material/colors', () => ({
+    grey: { 500: '#999' }
+}));
+vi.mock('@tui/core', () => ({
+    AppListEmpty: () => _jsx("div", { children: "empty-list" }),
+    PageCenter: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/app/providers/ParameterProvider', () => ({
+    ParameterContext: parameterContextToken
+}));
+vi.mock('components/app/providers/RecordProvider', () => ({
+    RecordContext: recordContextToken
+}));
+vi.mock('components/app/providers/RecordSearchProvider', () => ({
+    RecordSearchContext: searchContextToken
+}));
+vi.mock('components/elements/addons/layout/FlexOne', () => ({
+    default: () => _jsx("div", { children: "flex-one" })
+}));
+vi.mock('components/elements/addons/layout/FlexPort', () => ({
+    default: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/addons/layout/vsbox/VSBox', () => ({
+    default: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/addons/layout/vsbox/VSBoxContent', () => ({
+    default: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/addons/layout/vsbox/VSBoxHeader', () => ({
+    default: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/addons/search/SearchPagination', () => ({
+    default: ({ onChange }) => _jsx("button", { onClick: () => onChange(50), children: "paginate" })
+}));
+vi.mock('components/elements/addons/search/SearchTotal', () => ({
+    default: ({ total, pageLength, offset }) => _jsx("div", { children: `total:${total}:${pageLength}:${offset}` })
+}));
+vi.mock('components/elements/display/HowlerCard', () => ({
+    default: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/event/EventCard', () => ({
+    default: ({ id }) => _jsx("div", { children: `event-card:${id}` })
+}));
+vi.mock('components/elements/hit/HitCard', () => ({
+    default: ({ id, layout }) => _jsx("div", { children: `hit-card:${id}:${layout}` })
+}));
+vi.mock('components/elements/hit/HitLayout', () => ({
+    HitLayout: { NORMAL: 'normal', COMFY: 'comfy' }
+}));
+vi.mock('components/elements/record/RecordContextMenu', () => ({
+    default: ({ children, getSelectedId }) => (_jsx("div", { "data-selected": getSelectedId({ target: { closest: () => ({ id: 'selected-id' }) } }), children: children }))
+}));
+vi.mock('components/hooks/useMyLocalStorage', () => ({
+    useMyLocalStorageItem: (key) => {
+        if (key === 'SEARCH_PANE_WIDTH')
+            return [1200];
+        if (key === 'PAGE_COUNT')
+            return [25];
+        if (key === 'HIT_LAYOUT')
+            return ['normal'];
+        return [null];
+    }
+}));
+vi.mock('components/hooks/useRecordSelection', () => ({
+    default: () => ({ onClick: mockOnClick })
+}));
+vi.mock('react-device-detect', () => ({
+    isMobile: false
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('use-context-selector', () => ({
+    useContextSelector: (context, selector) => {
+        if (context === parameterContextToken)
+            return selector(contextValues.parameter);
+        if (context === recordContextToken)
+            return selector(contextValues.record);
+        if (context === searchContextToken)
+            return selector(contextValues.search);
+        return undefined;
+    }
+}));
+vi.mock('utils/constants', () => ({
+    StorageKey: { SEARCH_PANE_WIDTH: 'SEARCH_PANE_WIDTH', PAGE_COUNT: 'PAGE_COUNT', HIT_LAYOUT: 'HIT_LAYOUT' }
+}));
+vi.mock('utils/typeUtils', () => ({
+    isEvent: (record) => record?.__index === 'event',
+    isHit: (record) => record?.__index === 'hit'
+}));
+vi.mock('./QuerySettings', () => ({
+    default: ({ verticalSorters }) => _jsx("div", { children: `query-settings:${String(verticalSorters)}` })
+}));
+vi.mock('./RecordQuery', () => ({
+    default: ({ searching, triggerSearch }) => (_jsx("button", { onClick: () => triggerSearch('query'), disabled: searching, children: "record-query" }))
+}));
+vi.mock('./shared/SearchActionMenu', () => ({
+    default: ({ query }) => _jsx("div", { children: `search-actions:${query}` })
+}));
+import SearchPane from './SearchPane';
+describe('SearchPane', () => {
+    beforeEach(() => {
+        mockSetOffset.mockReset();
+        mockTriggerSearch.mockReset();
+        mockOnClick.mockReset();
+        contextValues = {
+            parameter: { query: 'status:open', setOffset: mockSetOffset, selected: 'hit-1' },
+            record: { selectedRecords: [{ howler: { id: 'event-1' } }] },
+            search: { search: mockTriggerSearch, searching: false, response: undefined, error: '' }
+        };
+        vi.stubGlobal('open', vi.fn());
+    });
+    it('shows the empty state and can trigger a search', () => {
+        render(_jsx(SearchPane, {}));
+        expect(screen.getByText('empty-list')).toBeInTheDocument();
+        expect(screen.getByText('search-actions:status:open')).toBeInTheDocument();
+        fireEvent.click(screen.getByText('record-query'));
+        expect(mockTriggerSearch).toHaveBeenCalledWith('query');
+    });
+    it('renders search results, errors, pagination, and supports selection interactions', () => {
+        contextValues.search = {
+            search: mockTriggerSearch,
+            searching: true,
+            error: 'boom',
+            response: {
+                total: 3,
+                offset: 25,
+                items: [
+                    { __index: 'hit', howler: { id: 'hit-1' } },
+                    { __index: 'event', howler: { id: 'event-1' } },
+                    { __index: 'other', howler: { id: 'bad-1' } }
+                ]
+            }
+        };
+        render(_jsx(SearchPane, {}));
+        expect(screen.getByText('error-icon')).toBeInTheDocument();
+        expect(screen.getByText('loading-bar')).toBeInTheDocument();
+        expect(screen.getByText('total:3:3:25')).toBeInTheDocument();
+        expect(screen.getByText('hit-card:hit-1:normal')).toBeInTheDocument();
+        expect(screen.getByText('event-card:event-1')).toBeInTheDocument();
+        expect(screen.getByText('hit.search.record.invalid')).toBeInTheDocument();
+        fireEvent.click(screen.getByText('paginate'));
+        expect(mockSetOffset).toHaveBeenCalledWith(50);
+        fireEvent.click(screen.getByText('hit-card:hit-1:normal').parentElement);
+        expect(mockOnClick).toHaveBeenCalled();
+        fireEvent(screen.getByText('hit-card:hit-1:normal').parentElement, new MouseEvent('auxclick', { bubbles: true, button: 1 }));
+        expect(window.open).toHaveBeenCalledWith(`${window.origin}/hits/hit-1`, '_blank');
+    });
+});

package/components/routes/hits/search/grid/RecordGrid.test.d.ts

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

package/components/routes/hits/search/grid/RecordGrid.test.js

@@ -0,0 +1,107 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { fireEvent, render, screen } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
+const parameterContextToken = vi.hoisted(() => ({ name: 'parameter-context' }));
+const recordContextToken = vi.hoisted(() => ({ name: 'record-context' }));
+const recordSearchContextToken = vi.hoisted(() => ({ name: 'record-search-context' }));
+const gridColumnsContextToken = vi.hoisted(() => ({ name: 'grid-columns-context' }));
+vi.mock('@mui/icons-material', () => ({
+    Info: () => _jsx("div", { children: "info-icon" })
+}));
+vi.mock('@mui/material', () => ({
+    LinearProgress: () => _jsx("div", { children: "progress" }),
+    Paper: ({ children, onScroll }) => _jsx("div", { onScroll: onScroll, children: children }),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    TableBody: ({ children }) => _jsx("div", { children: children }),
+    Typography: ({ children }) => _jsx("div", { children: children }),
+    useTheme: () => ({ spacing: (n) => `${n}px`, shape: { borderRadius: 4 } })
+}));
+vi.mock('components/app/providers/GridColumnsProvider', () => ({
+    GridColumnsContext: gridColumnsContextToken
+}));
+vi.mock('components/app/providers/ParameterProvider', () => ({
+    ParameterContext: parameterContextToken
+}));
+vi.mock('components/app/providers/RecordProvider', () => ({
+    RecordContext: recordContextToken
+}));
+vi.mock('components/app/providers/RecordSearchProvider', () => ({
+    RecordSearchContext: recordSearchContextToken
+}));
+vi.mock('components/elements/addons/search/SearchTotal', () => ({
+    default: ({ total }) => _jsx("div", { children: `total:${total}` })
+}));
+vi.mock('components/elements/display/features/DevelopmentBanner', () => ({
+    default: () => _jsx("div", { children: "banner" })
+}));
+vi.mock('components/elements/hit/grid/AddColumnModal', () => ({
+    default: ({ addColumn }) => _jsx("button", { onClick: () => addColumn('field.two'), children: "add-column" })
+}));
+vi.mock('components/elements/hit/grid/RecordTable', () => ({
+    default: ({ refreshItems, query, items }) => (_jsxs("div", { children: [_jsx("button", { onClick: () => refreshItems?.(query, true), children: "refresh" }), _jsx("div", { children: `table:${items?.length ?? 0}` })] }))
+}));
+vi.mock('components/elements/record/RecordContextMenu', () => ({
+    default: () => _jsx("div", { children: "context-menu" })
+}));
+vi.mock('components/hooks/useRecordSelection', () => ({
+    default: () => ({ onClick: vi.fn() })
+}));
+vi.mock('lodash-es', () => ({
+    uniq: (values) => [...new Set(values)]
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('use-context-selector', () => ({
+    useContextSelector: (context, selector) => {
+        if (context === recordSearchContextToken) {
+            return selector({
+                search: vi.fn(),
+                response: { items: [{ howler: { id: 'hit-1' } }], offset: 0, rows: 25, total: 1 },
+                searching: true
+            });
+        }
+        if (context === recordContextToken)
+            return selector({ selectedRecords: [{ howler: { id: 'hit-2' } }] });
+        if (context === parameterContextToken)
+            return selector({ query: 'status:open', selected: 'hit-1' });
+        if (context === gridColumnsContextToken)
+            return selector({ columns: ['field.one'], setColumns: vi.fn(), isReady: true });
+        return undefined;
+    }
+}));
+vi.mock('../QuerySettings', () => ({
+    default: () => _jsx("div", { children: "query-settings" })
+}));
+vi.mock('../RecordQuery', () => ({
+    default: () => _jsx("div", { children: "record-query" })
+}));
+vi.mock('../shared/SearchActionMenu', () => ({
+    default: () => _jsx("div", { children: "search-actions" })
+}));
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context === gridColumnsContextToken)
+                return { columns: ['field.one'], setColumns: vi.fn(), isReady: true };
+            return actual.useContext(context);
+        }
+    };
+});
+import RecordGrid from './RecordGrid';
+describe('RecordGrid', () => {
+    it('renders the search grid controls and empty message paths', () => {
+        render(_jsx(RecordGrid, {}));
+        expect(screen.getByText('banner')).toBeInTheDocument();
+        expect(screen.getByText('record-query')).toBeInTheDocument();
+        expect(screen.getByText('progress')).toBeInTheDocument();
+        expect(screen.getByText('query-settings')).toBeInTheDocument();
+        expect(screen.getByText('total:1')).toBeInTheDocument();
+        expect(screen.getByText('table:1')).toBeInTheDocument();
+        fireEvent.click(screen.getByText('add-column'));
+        fireEvent.click(screen.getByText('refresh'));
+    });
+});

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

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

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

@@ -0,0 +1,77 @@
+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 fieldContextToken = vi.hoisted(() => ({ name: 'field-context' }));
+const parameterContextToken = vi.hoisted(() => ({ name: 'parameter-context' }));
+const mockGetHitFields = vi.hoisted(() => vi.fn());
+const mockSetSavedSort = vi.hoisted(() => vi.fn());
+let fieldContextValue = {
+    hitFields: [{ key: 'event.created' }, { key: 'howler.score' }],
+    getHitFields: mockGetHitFields
+};
+let parameterValue = { sort: 'event.created desc', setSort: mockSetSavedSort };
+vi.mock('@mui/icons-material', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        ArrowDownward: () => _jsx("div", { children: "down-icon" }),
+        ArrowUpward: () => _jsx("div", { children: "up-icon" }),
+        Cancel: () => _jsx("div", { children: "cancel-icon" })
+    };
+});
+vi.mock('@mui/material', () => ({
+    Autocomplete: ({ onChange, options }) => _jsx("button", { onClick: () => onChange(null, options[1]), children: "pick-field" }),
+    Chip: ({ label, onClick, onDelete }) => (_jsxs("div", { children: [_jsx("button", { onClick: onClick, children: label }), _jsxs("button", { onClick: onDelete, children: ["delete-", label] })] })),
+    Grid: ({ children }) => _jsx("div", { children: children }),
+    MenuItem: ({ children }) => _jsx("div", { children: children }),
+    Select: ({ value, onChange }) => (_jsx("button", { onClick: () => onChange({ target: { value: value === 'desc' ? 'asc' : 'desc' } }), children: "toggle-direction" })),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    TextField: ({ label }) => _jsx("div", { children: label })
+}));
+vi.mock('components/app/providers/FieldProvider', () => ({
+    FieldContext: fieldContextToken
+}));
+vi.mock('components/app/providers/ParameterProvider', () => ({
+    ParameterContext: parameterContextToken
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('use-context-selector', () => ({
+    useContextSelector: (_context, selector) => selector({ sort: parameterValue.sort, setSort: mockSetSavedSort })
+}));
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context === fieldContextToken)
+                return fieldContextValue;
+            return actual.useContext(context);
+        }
+    };
+});
+import CustomSort from './CustomSort';
+describe('CustomSort', () => {
+    beforeEach(() => {
+        fieldContextValue = {
+            hitFields: [{ key: 'event.created' }, { key: 'howler.score' }],
+            getHitFields: mockGetHitFields
+        };
+        parameterValue = { sort: 'event.created desc', setSort: mockSetSavedSort };
+        mockGetHitFields.mockReset();
+        mockSetSavedSort.mockReset();
+    });
+    it('loads hit fields, adds sort entries, toggles direction, and deletes entries', async () => {
+        render(_jsx(CustomSort, {}));
+        await waitFor(() => expect(mockGetHitFields).toHaveBeenCalled());
+        fireEvent.click(screen.getByText('toggle-direction'));
+        fireEvent.click(screen.getByText('pick-field'));
+        await waitFor(() => expect(mockSetSavedSort).toHaveBeenCalledWith('event.created desc,howler.score asc'));
+        fireEvent.click(screen.getByText('event.created'));
+        expect(mockSetSavedSort).toHaveBeenCalledWith('event.created asc');
+        fireEvent.click(screen.getByText('delete-event.created'));
+        expect(mockSetSavedSort).toHaveBeenCalledWith('');
+    });
+});

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

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

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

@@ -0,0 +1,83 @@
+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 apiConfigContextToken = vi.hoisted(() => ({ name: 'api-config-context' }));
+const parameterContextToken = vi.hoisted(() => ({ name: 'parameter-context' }));
+const mockDispatchApi = vi.hoisted(() => vi.fn());
+const mockSetSavedFilter = vi.hoisted(() => vi.fn());
+const mockRemoveSavedFilter = vi.hoisted(() => vi.fn());
+let configValue = { lookups: { 'howler.assessment': ['malicious'] } };
+vi.mock('@mui/icons-material', async (importOriginal) => {
+    const actual = await importOriginal();
+    return { ...actual, FilterList: () => _jsx("div", { children: "filter-icon" }) };
+});
+vi.mock('@mui/material', () => ({
+    Autocomplete: ({ onChange, options, disabled }) => (_jsx("button", { disabled: disabled, onClick: () => onChange(null, options.includes('event.provider') ? 'event.provider' : options[0]), children: "change-filter" })),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    TextField: ({ label }) => _jsx("div", { children: label }),
+    Typography: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('api', () => ({
+    default: {
+        search: {
+            facet: {
+                hit: {
+                    post: (body) => body
+                }
+            }
+        }
+    }
+}));
+vi.mock('components/app/providers/ApiConfigProvider', () => ({
+    ApiConfigContext: apiConfigContextToken
+}));
+vi.mock('components/app/providers/ParameterProvider', () => ({
+    ParameterContext: parameterContextToken
+}));
+vi.mock('components/elements/display/ChipPopper', () => ({
+    default: ({ children, label, onDelete }) => (_jsxs("div", { children: [_jsx("div", { children: label }), _jsx("button", { onClick: onDelete, children: "delete-filter" }), children] }))
+}));
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({ dispatchApi: mockDispatchApi })
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('use-context-selector', () => ({
+    useContextSelector: (_context, selector) => selector({ setFilter: mockSetSavedFilter, removeFilter: mockRemoveSavedFilter })
+}));
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context === apiConfigContextToken)
+                return { config: configValue };
+            return actual.useContext(context);
+        }
+    };
+});
+import HitFilter from './HitFilter';
+describe('HitFilter', () => {
+    beforeEach(() => {
+        configValue = { lookups: { 'howler.assessment': ['malicious'] } };
+        mockDispatchApi.mockReset().mockImplementation(async (_value) => ({ 'event.provider': { azure: 2 } }));
+        mockSetSavedFilter.mockReset();
+        mockRemoveSavedFilter.mockReset();
+    });
+    it('initializes from value, fetches custom lookups, updates values, and removes filters', async () => {
+        render(_jsx(HitFilter, { id: 1, value: 'howler.assessment:*' }));
+        await waitFor(() => expect(mockSetSavedFilter).toHaveBeenCalledWith(1, 'howler.assessment:*'));
+        fireEvent.click(screen.getAllByText('change-filter')[0]);
+        await waitFor(() => expect(mockDispatchApi).toHaveBeenCalledWith({ query: 'howler.id:*', fields: ['event.provider'], rows: 100 }, { throwError: false }));
+        fireEvent.click(screen.getAllByText('change-filter')[1]);
+        expect(mockSetSavedFilter).toHaveBeenCalledWith(1, 'event.provider:"azure"');
+        fireEvent.click(screen.getByText('delete-filter'));
+        expect(mockRemoveSavedFilter).toHaveBeenCalledWith('howler.assessment:*');
+    });
+    it('uses configured lookups and wildcard values', async () => {
+        render(_jsx(HitFilter, { id: 2, value: 'howler.assessment:*' }));
+        await waitFor(() => expect(mockSetSavedFilter).toHaveBeenCalledWith(2, 'howler.assessment:*'));
+    });
+});

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

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

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

@@ -0,0 +1,61 @@
+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 mockSetSavedSort = vi.hoisted(() => vi.fn());
+const mockGetCurrentViews = vi.hoisted(() => vi.fn());
+let locationValue = { search: '' };
+let parameterValue = { views: [], sort: 'event.created desc', setSort: mockSetSavedSort };
+vi.mock('@mui/icons-material', async (importOriginal) => {
+    const actual = await importOriginal();
+    return { ...actual, Sort: () => _jsx("div", { children: "sort-icon" }) };
+});
+vi.mock('@mui/material', () => ({
+    Autocomplete: ({ onChange, options }) => (_jsx("button", { onClick: () => onChange(null, options.at(-1)), children: "change-sort" })),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    TextField: () => _jsx("div", { children: "text-field" })
+}));
+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('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('./CustomSort', () => ({
+    default: () => _jsx("div", { children: "custom-sort" })
+}));
+import HitSort from './HitSort';
+describe('HitSort', () => {
+    beforeEach(() => {
+        locationValue = { search: '' };
+        parameterValue = { views: [], sort: 'event.created desc', setSort: mockSetSavedSort };
+        mockSetSavedSort.mockReset();
+        mockGetCurrentViews.mockReset();
+    });
+    it('loads the current view sort and switches to custom sorting when requested', async () => {
+        mockGetCurrentViews.mockResolvedValueOnce([{ sort: 'howler.score asc' }]);
+        render(_jsx(HitSort, {}));
+        await waitFor(() => expect(mockSetSavedSort).toHaveBeenCalledWith('howler.score asc'));
+        fireEvent.click(screen.getAllByText('change-sort')[0]);
+        expect(screen.getByText('custom-sort')).toBeInTheDocument();
+    });
+    it('skips view lookup when sort is in the URL', () => {
+        locationValue = { search: '?sort=event.created%20asc' };
+        render(_jsx(HitSort, {}));
+        expect(mockGetCurrentViews).not.toHaveBeenCalled();
+    });
+});

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

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