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

package/components/routes/action/view/ActionDetails.test.js

@@ -0,0 +1,170 @@
+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 mockDispatchApi = vi.hoisted(() => vi.fn());
+const mockShowSuccessMessage = vi.hoisted(() => vi.fn());
+const mockExecuteAction = vi.hoisted(() => vi.fn());
+const mockDeleteAction = vi.hoisted(() => vi.fn());
+const mockOnSearch = vi.hoisted(() => vi.fn());
+const mockSetLoading = vi.hoisted(() => vi.fn());
+const mockPluginExecute = vi.hoisted(() => vi.fn(() => _jsx("div", { children: "plugin-operation" }, "plugin-operation")));
+const modalContextToken = vi.hoisted(() => ({ name: 'modal-context' }));
+vi.mock('@mui/icons-material', () => ({
+    Delete: () => _jsx("div", { children: "delete-icon" }),
+    Edit: () => _jsx("div", { children: "edit-icon" }),
+    PlayCircleOutline: () => _jsx("div", { children: "play-icon" }),
+    Search: () => _jsx("div", { children: "search-icon" })
+}));
+vi.mock('@mui/material', () => ({
+    Button: ({ children, onClick, component: Component, to }) => Component ? _jsx("a", { href: to, children: children }) : _jsx("button", { onClick: onClick, children: children }),
+    Checkbox: ({ name, onChange, checked }) => (_jsx("input", { type: "checkbox", "aria-label": name, checked: checked, onChange: e => onChange({ target: { name, checked: e.target.checked } }) })),
+    FormControlLabel: ({ control, label }) => (_jsxs("label", { children: [control, label] })),
+    FormGroup: ({ children }) => _jsx("div", { children: children }),
+    IconButton: ({ children, onClick }) => _jsx("button", { onClick: onClick, children: children }),
+    LinearProgress: ({ value }) => _jsx("div", { children: `progress:${value ?? 'indeterminate'}` }),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    Typography: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('@tui/core', () => ({
+    PageCenter: ({ children }) => _jsx("div", { children: children }),
+    useAppUser: () => ({ user: { username: 'alice', roles: ['automation_advanced'] } })
+}));
+vi.mock('api', () => ({
+    default: {
+        action: {
+            patch: (id, body) => ({ op: 'patch', id, body }),
+            operations: { get: () => ({ op: 'get-operations' }) },
+            get: (id) => ({ op: 'get-action', id })
+        }
+    }
+}));
+vi.mock('components/app/providers/ModalProvider', () => ({
+    ModalContext: modalContextToken
+}));
+vi.mock('components/elements/addons/layout/FlexOne', () => ({
+    default: () => _jsx("div", { children: "flex" })
+}));
+vi.mock('components/elements/addons/search/phrase/Phrase', () => ({
+    default: ({ value, startAdornment }) => (_jsxs("div", { children: [startAdornment, _jsx("div", { children: `phrase:${value}` })] }))
+}));
+vi.mock('components/elements/display/HowlerAvatar', () => ({
+    default: ({ userId }) => _jsx("div", { children: `avatar:${userId}` })
+}));
+vi.mock('components/elements/membership/MembershipManagement', () => ({
+    MembershipManagement: () => _jsx("div", { children: "membership-management" })
+}));
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({ dispatchApi: mockDispatchApi })
+}));
+vi.mock('components/hooks/useMySnackbar', () => ({
+    default: () => ({ showSuccessMessage: mockShowSuccessMessage })
+}));
+vi.mock('components/routes/action/shared/OperationEntry', () => ({
+    default: ({ operation, values }) => _jsx("div", { children: `operation:${operation.id}:${values.kind}` })
+}));
+vi.mock('plugins/store', () => ({
+    default: { operations: ['plugin-op'] }
+}));
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context?.name === 'modal-context') {
+                return { withConfirmDeleteModal: async (cb) => cb() };
+            }
+            return actual.useContext(context);
+        }
+    };
+});
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('react-pluggable', () => ({
+    usePluginStore: () => ({ executeFunction: mockPluginExecute })
+}));
+vi.mock('react-router', () => ({
+    Link: ({ children, to }) => _jsx("a", { href: to, children: children }),
+    useParams: () => ({ id: 'action-1' })
+}));
+vi.mock('../../../elements/display/QueryResultText', () => ({
+    default: ({ count, query }) => _jsx("div", { children: `query-result:${count}:${query}` })
+}));
+vi.mock('../shared/ActionReportDisplay', () => ({
+    default: ({ report }) => _jsx("div", { children: `report:${report.status}` })
+}));
+vi.mock('../useMyActionFunctions', () => ({
+    default: () => ({
+        response: { total: 7 },
+        onSearch: mockOnSearch,
+        loading: true,
+        setLoading: mockSetLoading,
+        executeAction: mockExecuteAction,
+        deleteAction: mockDeleteAction,
+        progress: [2, 4],
+        report: { status: 'done' }
+    })
+}));
+import ActionDetails from './ActionDetails';
+describe('ActionDetails', () => {
+    beforeEach(() => {
+        mockDispatchApi.mockReset();
+        mockShowSuccessMessage.mockReset();
+        mockExecuteAction.mockReset();
+        mockDeleteAction.mockReset();
+        mockOnSearch.mockReset();
+        mockSetLoading.mockReset();
+        mockPluginExecute.mockClear();
+        mockDispatchApi.mockImplementation(async (request) => {
+            if (request.op === 'get-operations') {
+                return [
+                    { id: 'direct-op', triggers: ['manual', 'alert'] },
+                    { id: 'plugin-op', triggers: ['alert'] }
+                ];
+            }
+            if (request.op === 'get-action') {
+                return {
+                    action_id: 'action-1',
+                    owner: 'alice',
+                    name: 'My action',
+                    query: 'status:open',
+                    admins: ['alice'],
+                    members: ['alice'],
+                    triggers: ['manual'],
+                    operations: [
+                        { operation_id: 'direct-op', data_json: { kind: 'direct' } },
+                        { operation_id: 'plugin-op', data_json: { kind: 'plugin' } }
+                    ]
+                };
+            }
+            return request;
+        });
+    });
+    it('loads action details, searches, patches triggers, executes, deletes, and renders operations', async () => {
+        render(_jsx(ActionDetails, {}));
+        await waitFor(() => expect(mockDispatchApi).toHaveBeenCalledTimes(2));
+        await waitFor(() => expect(mockOnSearch).toHaveBeenCalledWith('status:open'));
+        expect(screen.getByText('My action')).toBeInTheDocument();
+        expect(screen.getByText('avatar:alice')).toBeInTheDocument();
+        expect(screen.getByText('query-result:7:status:open')).toBeInTheDocument();
+        expect(screen.getByText('report:done')).toBeInTheDocument();
+        expect(screen.getByText('progress:50')).toBeInTheDocument();
+        expect(screen.getByText('operation:direct-op:direct')).toBeInTheDocument();
+        expect(screen.getByText('plugin-operation')).toBeInTheDocument();
+        fireEvent.click(screen.getByText('search-icon').parentElement);
+        expect(mockOnSearch).toHaveBeenCalledWith('status:open');
+        fireEvent.click(screen.getByLabelText('alert'));
+        await waitFor(() => expect(mockDispatchApi).toHaveBeenCalledWith({
+            op: 'patch',
+            id: 'action-1',
+            body: { triggers: ['manual', 'alert'] }
+        }));
+        fireEvent.click(screen.getByText('route.actions.execute'));
+        expect(mockExecuteAction).toHaveBeenCalledWith('action-1');
+        fireEvent.click(screen.getByText('button.delete'));
+        await waitFor(() => expect(mockDeleteAction).toHaveBeenCalledWith('action-1'));
+        expect(mockShowSuccessMessage).toHaveBeenCalledWith('route.actions.manager.delete.success');
+        expect(screen.getByRole('link', { name: 'route.actions.edit' })).toHaveAttribute('href', '/action/action-1/edit');
+    });
+});

package/components/routes/action/view/ActionSearch.test.d.ts

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

package/components/routes/action/view/ActionSearch.test.js

@@ -0,0 +1,185 @@
+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 mockShowSuccessMessage = vi.hoisted(() => vi.fn());
+const mockNavigate = vi.hoisted(() => vi.fn());
+const mockSetSearchParams = vi.hoisted(() => vi.fn());
+const mockLoad = vi.hoisted(() => vi.fn());
+const mockRequest = vi.hoisted(() => vi.fn());
+const mockRemove = vi.hoisted(() => vi.fn());
+const mockGetSearchRequestData = vi.hoisted(() => vi.fn((data) => ({ offset: data.offset })));
+const mockDeleteAction = vi.hoisted(() => vi.fn());
+const modalContextToken = vi.hoisted(() => ({ name: 'modal-context' }));
+const listMethodContextToken = vi.hoisted(() => ({ name: 'list-method-context' }));
+let searchParamsValue = new URLSearchParams();
+let responseValue = {
+    total: 1,
+    items: [
+        {
+            action_id: 'action-1',
+            name: 'Action One',
+            owner: 'demo',
+            triggers: ['manual'],
+            operations: [{ operation_id: 'archive' }],
+            query: 'status:open'
+        }
+    ]
+};
+let appUserValue = {
+    user: { username: 'demo', roles: ['automation_basic'] }
+};
+vi.mock('@mui/icons-material', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        Delete: () => _jsx("div", { children: "delete-icon" }),
+        Engineering: () => _jsx("div", { children: "engineering-icon" }),
+        Terminal: () => _jsx("div", { children: "terminal-icon" })
+    };
+});
+vi.mock('@mui/material', () => ({
+    Autocomplete: ({ onChange }) => _jsx("button", { onClick: () => onChange?.(null, ['manual']), children: "set-trigger" }),
+    Card: ({ children, onClick }) => _jsx("div", { onClick: onClick, children: children }),
+    CardContent: ({ children }) => _jsx("div", { children: children }),
+    CardHeader: ({ title, subheader }) => (_jsxs("div", { children: [title, subheader] })),
+    Chip: ({ label }) => _jsx("div", { children: label }),
+    Grid: ({ children }) => _jsx("div", { children: children }),
+    IconButton: ({ children, onClick }) => _jsx("button", { onClick: onClick, children: children }),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    TextField: () => _jsx("div", { children: "text-field" }),
+    Tooltip: ({ children }) => _jsx("div", { children: children }),
+    Typography: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('@tui/core', () => ({
+    useAppUser: () => appUserValue
+}));
+vi.mock('api', () => ({
+    default: {
+        search: {
+            action: {
+                post: 'action-search'
+            }
+        }
+    }
+}));
+vi.mock('components/app/providers/ModalProvider', () => ({
+    ModalContext: modalContextToken
+}));
+vi.mock('components/app/providers/SearchResponseProvider', () => ({
+    __esModule: true,
+    default: ({ children }) => _jsx("div", { children: children }),
+    createSearchResponseContext: () => ({}),
+    useSearchResponseContext: () => ({
+        response: responseValue,
+        request: mockRequest,
+        remove: mockRemove,
+        getSearchRequestData: mockGetSearchRequestData
+    })
+}));
+vi.mock('components/elements/addons/layout/FlexOne', () => ({
+    default: () => _jsx("div", { children: "flex" })
+}));
+vi.mock('components/elements/addons/lists', () => ({
+    TuiListProvider: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/addons/lists/TuiListProvider', () => ({
+    TuiListMethodContext: listMethodContextToken
+}));
+vi.mock('components/elements/display/ItemManager', () => ({
+    default: (props) => (_jsxs("div", { children: [_jsx("button", { onClick: () => props.onSearch(), children: "search" }), _jsx("button", { onClick: () => props.onPageChange(25), children: "page" }), _jsx("button", { onClick: () => props.onCreate?.(), children: "create" }), _jsx("div", { children: props.searchFilters }), props.response?.items?.map((item) => (_jsx("div", { children: props.renderer({ item: { item } }, () => 'card') }, item.action_id)))] }))
+}));
+vi.mock('components/elements/membership/Members', () => ({
+    default: ({ item }) => _jsx("div", { children: `members:${item.action_id}` })
+}));
+vi.mock('components/hooks/useMyLocalStorage', () => ({
+    useMyLocalStorageItem: () => [25]
+}));
+vi.mock('components/hooks/useMySnackbar', () => ({
+    default: () => ({ showSuccessMessage: mockShowSuccessMessage })
+}));
+vi.mock('react-i18next', () => ({
+    Trans: ({ values }) => _jsx("div", { children: values?.triggers }),
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('react-router', () => ({
+    useNavigate: () => mockNavigate,
+    useSearchParams: () => [searchParamsValue, mockSetSearchParams]
+}));
+vi.mock('../useMyActionFunctions', () => ({
+    default: () => ({ deleteAction: mockDeleteAction })
+}));
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context === modalContextToken) {
+                return { withConfirmDeleteModal: async (fn) => fn() };
+            }
+            if (context === listMethodContextToken) {
+                return { load: mockLoad };
+            }
+            return actual.useContext(context);
+        }
+    };
+});
+import ActionSearch from './ActionSearch';
+describe('ActionSearch', () => {
+    beforeEach(() => {
+        searchParamsValue = new URLSearchParams();
+        responseValue = {
+            total: 1,
+            items: [
+                {
+                    action_id: 'action-1',
+                    name: 'Action One',
+                    owner: 'demo',
+                    triggers: ['manual'],
+                    operations: [{ operation_id: 'archive' }],
+                    query: 'status:open'
+                }
+            ]
+        };
+        appUserValue = { user: { username: 'demo', roles: ['automation_basic'] } };
+        mockShowSuccessMessage.mockReset();
+        mockNavigate.mockReset();
+        mockSetSearchParams.mockReset();
+        mockLoad.mockReset();
+        mockRequest.mockReset();
+        mockRemove.mockReset();
+        mockGetSearchRequestData.mockClear();
+        mockDeleteAction.mockReset();
+    });
+    it('searches, filters, paginates, and navigates to create/detail pages', async () => {
+        render(_jsx(ActionSearch, {}));
+        await waitFor(() => expect(mockRequest).toHaveBeenCalledWith('action-search', {
+            query: 'name:(**) OR query:(**)',
+            rows: 25,
+            offset: 0
+        }));
+        expect(mockLoad).toHaveBeenCalledWith([expect.objectContaining({ id: 'action-1' })]);
+        expect(screen.getByText('status:open')).toBeInTheDocument();
+        expect(screen.getByText('members:action-1')).toBeInTheDocument();
+        expect(screen.getByText('operations.archive')).toBeInTheDocument();
+        fireEvent.click(screen.getByText('set-trigger'));
+        await waitFor(() => expect(mockRequest).toHaveBeenLastCalledWith('action-search', {
+            query: '(name:(**) OR query:(**)) AND (triggers:(manual))',
+            rows: 25,
+            offset: 0
+        }));
+        fireEvent.click(screen.getByText('page'));
+        expect(mockSetSearchParams).toHaveBeenCalled();
+        fireEvent.click(screen.getByText('create'));
+        expect(mockNavigate).toHaveBeenCalledWith('/action/execute');
+        fireEvent.click(screen.getByText('Action One'));
+        expect(mockNavigate).toHaveBeenCalledWith('/action/action-1');
+    });
+    it('deletes actions and shows a success message', async () => {
+        render(_jsx(ActionSearch, {}));
+        fireEvent.click(screen.getByText('delete-icon'));
+        await waitFor(() => expect(mockDeleteAction).toHaveBeenCalledWith('action-1'));
+        expect(mockRemove).toHaveBeenCalledWith('action-1');
+        expect(mockShowSuccessMessage).toHaveBeenCalledWith('route.actions.manager.delete.success');
+    });
+});

package/components/routes/action/view/Integrations.test.d.ts

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

package/components/routes/action/view/Integrations.test.js

@@ -0,0 +1,62 @@
+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 mockExecuteFunction = vi.hoisted(() => vi.fn());
+const mockSetSearchParams = vi.hoisted(() => vi.fn());
+let searchParamsValue = new URLSearchParams();
+let pluginList = ['demo'];
+vi.mock('@mui/material', () => ({
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    Tab: ({ label, value }) => _jsx("button", { "data-value": value, children: label }),
+    Tabs: ({ children, onChange }) => (_jsxs("div", { children: [_jsx("button", { onClick: () => onChange(null, 'second'), children: "switch-tab" }), children] }))
+}));
+vi.mock('@tui/core', () => ({
+    PageCenter: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/display/Markdown', () => ({
+    default: ({ md }) => _jsx("div", { children: md })
+}));
+vi.mock('plugins/store', () => ({
+    default: {
+        get plugins() {
+            return pluginList;
+        }
+    }
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key, i18n: { language: 'en' } })
+}));
+vi.mock('react-pluggable', () => ({
+    usePluginStore: () => ({ executeFunction: mockExecuteFunction })
+}));
+vi.mock('react-router', () => ({
+    useSearchParams: () => [searchParamsValue, mockSetSearchParams]
+}));
+vi.mock('./markdown/integrations.en.md', () => ({ default: 'integrations-en' }));
+vi.mock('./markdown/integrations.fr.md', () => ({ default: 'integrations-fr' }));
+import Integrations from './Integrations';
+describe('Integrations', () => {
+    beforeEach(() => {
+        searchParamsValue = new URLSearchParams();
+        pluginList = ['demo'];
+        mockExecuteFunction.mockReset();
+        mockSetSearchParams.mockReset();
+    });
+    it('renders plugin integrations and syncs the selected tab into search params', () => {
+        mockExecuteFunction.mockReturnValue([
+            ['first', () => _jsx("div", { children: "first-view" })],
+            ['second', () => _jsx("div", { children: "second-view" })]
+        ]);
+        render(_jsx(Integrations, {}));
+        expect(screen.getByText('route.integrations.first')).toBeInTheDocument();
+        expect(screen.getByText('first-view')).toBeInTheDocument();
+        fireEvent.click(screen.getByText('switch-tab'));
+        expect(mockSetSearchParams).toHaveBeenCalled();
+    });
+    it('falls back to markdown when no plugin integrations exist', () => {
+        pluginList = [];
+        render(_jsx(Integrations, {}));
+        expect(screen.getByText('integrations-en')).toBeInTheDocument();
+    });
+});

package/components/routes/admin/users/UserEditor.test.d.ts

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

package/components/routes/admin/users/UserEditor.test.js

@@ -0,0 +1,74 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { render, screen, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+const mockDispatchApi = vi.hoisted(() => vi.fn());
+const mockUseUserFunctions = vi.hoisted(() => ({
+    editName: vi.fn(async (user, name) => ({ ...user, name })),
+    editPassword: vi.fn(),
+    editQuota: vi.fn(async (user, quota) => ({ ...user, api_quota: quota ? parseInt(quota) : 25 })),
+    addRole: vi.fn(async (user, role) => ({ ...user, roles: [...(user.roles ?? []), role] })),
+    removeRole: vi.fn(async (user, role) => ({
+        ...user,
+        roles: (user.roles ?? []).filter((r) => r !== role)
+    })),
+    addApiKey: vi.fn(),
+    removeApiKey: vi.fn(async (user, key) => ({
+        ...user,
+        apikeys: (user.apikeys ?? []).filter((v) => v !== key)
+    })),
+    viewGroups: vi.fn()
+}));
+let currentUser = { username: 'admin', is_admin: true };
+let paramsValue = { id: 'alice' };
+vi.mock('@tui/core', () => ({
+    useAppUser: () => ({ user: currentUser })
+}));
+vi.mock('api', () => ({
+    default: {
+        user: {
+            get: (id) => ({ id })
+        }
+    }
+}));
+vi.mock('components/elements/display/UserPageWrapper', () => ({
+    default: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({ dispatchApi: mockDispatchApi })
+}));
+vi.mock('components/hooks/useMyUserFunctions', () => ({
+    default: () => mockUseUserFunctions
+}));
+vi.mock('components/routes/settings/ProfileSection', () => ({
+    default: (props) => (_jsxs("div", { children: [_jsx("span", { children: `profile:${props.user.username}` }), _jsxs("span", { children: [String(!!props.editName), "-", String(!!props.addRole), "-", String(!!props.removeRole), "-", String(!!props.viewGroups)] })] }))
+}));
+vi.mock('components/routes/settings/SecuritySection', () => ({
+    default: (props) => (_jsxs("div", { children: [_jsx("span", { children: `security:${props.user.username}` }), _jsxs("span", { children: [String(!!props.editPassword), "-", String(!!props.addApiKey), "-", String(!!props.removeApiKey), "-", String(!!props.editQuota)] })] }))
+}));
+vi.mock('react-router', () => ({
+    useParams: () => paramsValue
+}));
+import UserEditor from './UserEditor';
+describe('UserEditor', () => {
+    beforeEach(() => {
+        currentUser = { username: 'admin', is_admin: true };
+        paramsValue = { id: 'alice' };
+        mockDispatchApi.mockReset();
+    });
+    it('loads the requested user and exposes admin controls', async () => {
+        mockDispatchApi.mockResolvedValue({ username: 'alice', roles: ['member'], apikeys: [] });
+        render(_jsx(UserEditor, {}));
+        await waitFor(() => expect(screen.getByText('profile:alice')).toBeInTheDocument());
+        expect(screen.getByText('true-true-true-false')).toBeInTheDocument();
+        expect(screen.getByText('false-false-true-true')).toBeInTheDocument();
+    });
+    it('exposes self-service actions for the same user', async () => {
+        currentUser = { username: 'alice', is_admin: false };
+        mockDispatchApi.mockResolvedValue({ username: 'alice', roles: ['member'], apikeys: [] });
+        render(_jsx(UserEditor, {}));
+        await waitFor(() => expect(screen.getByText('profile:alice')).toBeInTheDocument());
+        expect(screen.getByText('true-false-false-true')).toBeInTheDocument();
+        expect(screen.getByText('true-true-true-false')).toBeInTheDocument();
+    });
+});

package/components/routes/admin/users/UserSearch.test.d.ts

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

package/components/routes/admin/users/UserSearch.test.js

@@ -0,0 +1,146 @@
+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 listMethodContextToken = vi.hoisted(() => ({ name: 'list-method-context' }));
+const mockDispatchApi = vi.hoisted(() => vi.fn());
+const mockNavigate = vi.hoisted(() => vi.fn());
+const mockSetSearchParams = vi.hoisted(() => vi.fn());
+const mockLoad = vi.hoisted(() => vi.fn());
+let searchParamsValue = new URLSearchParams();
+let tableSelect;
+vi.mock('@mui/icons-material', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        Close: () => _jsx("div", { children: "close-icon" }),
+        Search: () => _jsx("div", { children: "search-icon" })
+    };
+});
+vi.mock('@mui/material', () => ({
+    Box: ({ children }) => _jsx("div", { children: children }),
+    Chip: ({ label }) => _jsx("div", { children: label }),
+    Grid: ({ children }) => _jsx("div", { children: children }),
+    IconButton: ({ children, onClick }) => _jsx("button", { onClick: onClick, children: children }),
+    LinearProgress: () => _jsx("div", { children: "loading" }),
+    Stack: ({ children }) => _jsx("div", { children: children }),
+    TextField: ({ value, onChange, onKeyDown, InputProps }) => (_jsxs("div", { children: [InputProps?.startAdornment, _jsx("input", { "aria-label": "phrase", value: value, onChange: onChange, onKeyDown: onKeyDown }), InputProps?.endAdornment] })),
+    Typography: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('@tui/core', () => ({
+    PageCenter: ({ children }) => _jsx("div", { children: children }),
+    parseEvent: (event) => ({ isEnter: event.key === 'Enter' })
+}));
+vi.mock('api', () => ({
+    default: {
+        search: {
+            user: {
+                post: (body) => body
+            }
+        }
+    }
+}));
+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/lists', () => ({
+    TuiListProvider: ({ children }) => _jsx("div", { children: children })
+}));
+vi.mock('components/elements/addons/lists/table/TuiTable', () => ({
+    default: ({ columns, onRowSelect, children }) => {
+        tableSelect = onRowSelect;
+        return (_jsxs("div", { children: [_jsx("div", { children: children(['group-a', 'group-b'], undefined, { column: 'groups' }) }), _jsx("div", { children: columns.map((column) => column.column).join(',') })] }));
+    }
+}));
+vi.mock('components/elements/addons/lists/TuiListProvider', () => ({
+    TuiListMethodContext: listMethodContextToken
+}));
+vi.mock('components/elements/addons/search/SearchPagination', () => ({
+    default: ({ onChange }) => _jsx("button", { onClick: () => onChange(30), children: "page" })
+}));
+vi.mock('components/elements/addons/search/SearchTotal', () => ({
+    default: ({ total }) => _jsx("div", { children: `total:${total}` })
+}));
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({ dispatchApi: mockDispatchApi })
+}));
+vi.mock('components/hooks/useMyLocalStorage', () => ({
+    useMyLocalStorageItem: () => [25]
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('react-router', () => ({
+    Link: ({ children }) => _jsx("div", { children: children }),
+    useNavigate: () => mockNavigate,
+    useSearchParams: () => [searchParamsValue, mockSetSearchParams]
+}));
+vi.mock('utils/stringUtils', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        sanitizeLuceneQuery: (value) => value.replaceAll(':', '\\:')
+    };
+});
+vi.mock('react', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        useContext: (context) => {
+            if (context === listMethodContextToken) {
+                return { load: mockLoad };
+            }
+            return actual.useContext(context);
+        }
+    };
+});
+import UserSearchProvider from './UserSearch';
+describe('UserSearch', () => {
+    beforeEach(() => {
+        searchParamsValue = new URLSearchParams();
+        tableSelect = undefined;
+        mockDispatchApi.mockReset().mockResolvedValue({
+            total: 1,
+            offset: 0,
+            rows: 25,
+            items: [{ username: 'alice', name: 'Alice', email: 'a@example.com', groups: ['group-a', 'group-b'] }]
+        });
+        mockNavigate.mockReset();
+        mockSetSearchParams.mockReset();
+        mockLoad.mockReset();
+    });
+    it('searches users, sanitizes input, paginates, clears, and navigates selected rows', async () => {
+        render(_jsx(UserSearchProvider, {}));
+        await waitFor(() => expect(mockDispatchApi).toHaveBeenCalled());
+        expect(mockLoad).toHaveBeenCalledWith([
+            {
+                id: 'alice',
+                item: { username: 'alice', name: 'Alice', email: 'a@example.com', groups: ['group-a', 'group-b'] }
+            }
+        ]);
+        fireEvent.change(screen.getByLabelText('phrase'), { target: { value: 'alice:demo' } });
+        fireEvent.keyDown(screen.getByLabelText('phrase'), { key: 'Enter' });
+        await waitFor(() => expect(mockDispatchApi.mock.calls.at(-1)?.[0]).toMatchObject({
+            query: 'name:*alice\\:demo* OR uname:*alice\\:demo* OR email:*alice\\:demo*',
+            rows: 25,
+            offset: 0
+        }));
+        fireEvent.click(screen.getByText('page'));
+        expect(mockSetSearchParams).toHaveBeenCalled();
+        fireEvent.click(screen.getByText('close-icon').closest('button'));
+        await waitFor(() => expect(mockDispatchApi.mock.calls.at(-1)?.[0]).toMatchObject({
+            query: 'name:*alice\\:demo* OR uname:*alice\\:demo* OR email:*alice\\:demo*'
+        }));
+        expect(screen.getByLabelText('phrase')).toHaveValue('');
+        tableSelect({ item: { username: 'alice' } });
+        expect(mockNavigate).toHaveBeenCalledWith('alice');
+        expect(screen.getByText('group-a')).toBeInTheDocument();
+        expect(screen.getByText('total:1')).toBeInTheDocument();
+    });
+});

package/components/routes/advanced/QueryBuilder.test.d.ts

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