@cccsaurora/howler-ui 2.19.0-dev.999 → 2.20.0-dev.1352

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

@@ -4,13 +4,14 @@ import { Autocomplete, Card, CardContent, CardHeader, Chip, Grid, IconButton, St
 import api from '@cccsaurora/howler-ui/api';
 import { useAppUser } from '@cccsaurora/howler-ui/commons/components/app/hooks';
 import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
+import SearchResponseProvider, { SearchResponseContext } from '@cccsaurora/howler-ui/components/app/providers/SearchResponseProvider';
 import FlexOne from '@cccsaurora/howler-ui/components/elements/addons/layout/FlexOne';
 import { TuiListProvider } from '@cccsaurora/howler-ui/components/elements/addons/lists';
 import { TuiListMethodContext } from '@cccsaurora/howler-ui/components/elements/addons/lists/TuiListProvider';
 import HowlerAvatar from '@cccsaurora/howler-ui/components/elements/display/HowlerAvatar';
 import ItemManager from '@cccsaurora/howler-ui/components/elements/display/ItemManager';
-import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
 import { useMyLocalStorageItem } from '@cccsaurora/howler-ui/components/hooks/useMyLocalStorage';
+import useMySnackbar from '@cccsaurora/howler-ui/components/hooks/useMySnackbar';
 import { useCallback, useContext, useEffect, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { useNavigate, useSearchParams } from 'react-router-dom';
@@ -21,17 +22,17 @@ const ActionSearch = () => {
     const navigate = useNavigate();
     const { t } = useTranslation();
     const { user } = useAppUser();
-    const { dispatchApi } = useMyApi();
     const { load } = useContext(TuiListMethodContext);
     const { withConfirmDeleteModal } = useContext(ModalContext);
+    const { showSuccessMessage } = useMySnackbar();
     const [searchParams, setSearchParams] = useSearchParams();
     const { deleteAction } = useMyActionFunctions();
     const pageCount = useMyLocalStorageItem(StorageKey.PAGE_COUNT, 25)[0];
+    const { response, request, remove, getSearchRequestData } = useContext(SearchResponseContext);
     const [searching, setSearching] = useState(false);
     const [hasError, setHasError] = useState(false);
     const [phrase, setPhrase] = useState(searchParams.get('phrase') || '');
     const [offset, setOffset] = useState(parseInt(searchParams.get('offset')) || 0);
-    const [response, setResponse] = useState(null);
     const [searchModifiers, setSearchModifiers] = useState([]);
     // Search Handler.
     const onSearch = useCallback(async () => {
@@ -50,39 +51,44 @@ const ActionSearch = () => {
             if (searchModifiers.length > 0) {
                 query = `(${query}) AND (triggers:(${searchModifiers.join(' OR ')}))`;
             }
-            const _response = await dispatchApi(api.search.action.post({
+            await request(api.search.action.post, {
                 query,
                 rows: pageCount,
                 offset
-            }));
-            setResponse(_response);
-            load(_response.items.map(u => ({ id: u.action_id, item: u })));
+            });
         }
-        catch (e) {
+        catch {
             setHasError(true);
         }
         finally {
             setSearching(false);
         }
-    }, [dispatchApi, load, offset, pageCount, phrase, searchModifiers, searchParams, setSearchParams]);
+    }, [phrase, setSearchParams, searchParams, searchModifiers, request, pageCount, offset]);
+    useEffect(() => {
+        if (response) {
+            load(response.items.map((item) => ({ id: item.action_id, item: item })));
+        }
+    }, [response, load]);
     const onPageChange = useCallback((_offset) => {
         if (_offset !== offset) {
-            searchParams.set('offset', _offset.toString());
+            const modifiedRequest = getSearchRequestData({ offset: _offset });
+            searchParams.set('offset', modifiedRequest.offset.toString());
             setSearchParams(searchParams, { replace: true });
-            setOffset(_offset);
+            setOffset(modifiedRequest.offset);
         }
-    }, [offset, searchParams, setSearchParams]);
+    }, [offset, searchParams, setSearchParams, getSearchRequestData]);
     const onDelete = useCallback((e, actionId) => {
         e.preventDefault();
         e.stopPropagation();
         withConfirmDeleteModal(async () => {
             await deleteAction(actionId);
-            onSearch();
+            remove(actionId);
+            showSuccessMessage(t('route.actions.manager.delete.success'));
         });
-    }, [deleteAction, onSearch, withConfirmDeleteModal]);
+    }, [deleteAction, remove, withConfirmDeleteModal, showSuccessMessage, t]);
     // Effect to initialize list of users.
     useEffect(() => {
-        onSearch();
+        void onSearch();
         if (!searchParams.has('offset')) {
             searchParams.set('offset', '0');
             setSearchParams(searchParams, { replace: true });
@@ -99,12 +105,12 @@ const ActionSearch = () => {
     }, [offset, response?.total, searchParams, setSearchParams]);
     useEffect(() => {
         if (!searching) {
-            onSearch();
+            void onSearch();
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [offset]);
     useEffect(() => {
-        onSearch();
+        void onSearch();
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [searchModifiers]);
     const editRoles = user.roles.includes('automation_basic') || user.roles.includes('automation_advanced');
@@ -115,11 +121,11 @@ const ActionSearch = () => {
                 transitionProperty: 'border-color',
                 cursor: 'pointer',
                 mt: 1
-            }, children: [_jsx(CardHeader, { title: _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(Typography, { variant: "h5", children: item.item.name }), item.item.triggers.length > 0 && (_jsx(Tooltip, { title: _jsx(Trans, { i18nKey: "route.actions.trigger.description", values: { triggers: item.item.triggers.join(', ') }, components: { bold: _jsx("strong", {}) } }), children: _jsx(Engineering, {}) })), _jsx(FlexOne, {}), ((item.item.owner_id === user.username && editRoles) || user.roles?.includes('admin')) && (_jsx(IconButton, { size: "small", onClick: e => onDelete(e, item.item.action_id), children: _jsx(Delete, {}) })), _jsx(HowlerAvatar, { sx: { width: 24, height: 24, marginRight: '8px !important' }, userId: item.item.owner_id })] }), subheader: item.item.query }), _jsx(CardContent, { sx: { paddingTop: 0 }, children: _jsx(Grid, { container: true, spacing: 1, children: item.item.operations.map(d => (_jsx(Grid, { item: true, children: _jsx(Chip, { size: "small", label: t(`operations.${d.operation_id}`) }) }, d.operation_id))) }) })] }, item.item.name));
+            }, children: [_jsx(CardHeader, { title: _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(Typography, { variant: "h5", children: item.item.name }), item.item.triggers.length > 0 && (_jsx(Tooltip, { title: _jsx(Trans, { i18nKey: "route.actions.trigger.description", values: { triggers: item.item.triggers.join(', ') }, components: { bold: _jsx("strong", {}) } }), children: _jsx(Engineering, {}) })), _jsx(FlexOne, {}), ((item.item.owner_id === user.username && editRoles) || user.roles?.includes('admin')) && (_jsx(IconButton, { size: "small", onClick: e => onDelete(e, item.item.action_id), children: _jsx(Delete, {}) })), _jsx(HowlerAvatar, { sx: { width: 24, height: 24, marginRight: '8px !important' }, userId: item.item.owner_id })] }), subheader: item.item.query }), _jsx(CardContent, { sx: { paddingTop: 0 }, children: _jsx(Grid, { container: true, spacing: 1, children: item.item.operations.map(d => (_jsx(Grid, { item: true, children: _jsx(Chip, { label: t(`operations.${d.operation_id}`) }) }, d.operation_id))) }) })] }, item.item.name));
     }, [editRoles, navigate, onDelete, t, user.roles, user.username]);
     return (_jsx(ItemManager, { onSearch: onSearch, onCreate: editRoles ? () => navigate('/action/execute') : undefined, onPageChange: onPageChange, phrase: phrase, setPhrase: setPhrase, hasError: hasError, searching: searching, aboveSearch: _jsx(Typography, { sx: theme => ({ fontStyle: 'italic', color: theme.palette.text.disabled, mb: 0.5 }), variant: "body2", children: t('route.actions.search.prompt') }), searchFilters: _jsx(Autocomplete, { multiple: true, size: "small", value: searchModifiers, onChange: (__, values) => setSearchModifiers(values), getOptionLabel: trigger => t(`route.actions.trigger.${trigger}`), options: VALID_ACTION_TRIGGERS, renderInput: params => (_jsx(TextField, { ...params, sx: { maxWidth: '500px' }, label: t('route.actions.trigger') })) }), renderer: renderer, response: response, createPrompt: "route.actions.create", searchPrompt: "route.actions.search", createIcon: _jsx(Terminal, { sx: { mr: 1 } }) }));
 };
 const ActionSearchProvider = () => {
-    return (_jsx(TuiListProvider, { children: _jsx(ActionSearch, {}) }));
+    return (_jsx(TuiListProvider, { children: _jsx(SearchResponseProvider, { idField: "action_id", children: _jsx(ActionSearch, {}) }) }));
 };
 export default ActionSearchProvider;

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

@@ -20,7 +20,7 @@ const UserEditor = () => {
     }, [user, setUser]);
     useEffect(() => {
         if (id && !user) {
-            dispatchApi(api.user.get(id)).then(setUser);
+            void dispatchApi(api.user.get(id)).then(setUser);
         }
     }, [dispatchApi, id, user]);
     return (_jsxs(UserPageWrapper, { user: user, children: [_jsx(ProfileSection, { user: user, editName: (isAdmin || currentUser.username === user?.username) && userWrapper(editName), addRole: isAdmin && userWrapper(addRole), removeRole: isAdmin && userWrapper(removeRole), viewGroups: currentUser.username === user?.username && viewGroups }), _jsx(SecuritySection, { user: user, editPassword: currentUser.username === user?.username && editPassword, addApiKey: currentUser.username === user?.username && addApiKey, removeApiKey: (isAdmin || currentUser.username === user?.username) && userWrapper(removeApiKey), editQuota: isAdmin && userWrapper(editQuota) })] }));

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Close, Search } from '@mui/icons-material';
 import { Box, Chip, Grid, IconButton, LinearProgress, Stack, TextField, Typography } from '@mui/material';
 import api from '@cccsaurora/howler-ui/api';
@@ -65,17 +65,17 @@ const UserSearch = () => {
     const onKeyDown = useCallback((event) => {
         const { isEnter } = parseEvent(event);
         if (isEnter) {
-            onSearch();
+            void onSearch();
         }
     }, [onSearch]);
     // Clean button handler.
     const onClear = useCallback(() => {
         setPhrase('');
-        onSearch();
+        void onSearch();
     }, [onSearch]);
     // Effect to initialize list of users.
     useEffect(() => {
-        onSearch();
+        void onSearch();
         if (!searchParams.has('offset')) {
             searchParams.set('offset', '0');
             setSearchParams(searchParams);
@@ -92,7 +92,7 @@ const UserSearch = () => {
     }, [offset, response?.total, searchParams, setSearchParams]);
     useEffect(() => {
         if (!searching) {
-            onSearch();
+            void onSearch();
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [offset]);

package/components/routes/advanced/QueryBuilder.js

@@ -1,18 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable no-useless-escape */
 import { useMonaco } from '@monaco-editor/react';
-import { OpenInNew, PlayArrowOutlined, SsidChart } from '@mui/icons-material';
+import { OpenInNew, PlayArrowOutlined } from '@mui/icons-material';
 import { Alert, AlertTitle, Autocomplete, Box, Card, Checkbox, Chip, CircularProgress, FormControlLabel, IconButton, ListItemText, Slider, Stack, TextField, Tooltip, Typography, useMediaQuery, useTheme } from '@mui/material';
 import Popper, {} from '@mui/material/Popper';
 import api from '@cccsaurora/howler-ui/api';
 import PageCenter from '@cccsaurora/howler-ui/commons/components/pages/PageCenter';
 import { parseEvent } from '@cccsaurora/howler-ui/commons/components/utils/keyboard';
 import { FieldContext } from '@cccsaurora/howler-ui/components/app/providers/FieldProvider';
-import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
 import CustomButton from '@cccsaurora/howler-ui/components/elements/addons/buttons/CustomButton';
 import FlexOne from '@cccsaurora/howler-ui/components/elements/addons/layout/FlexOne';
 import JSONViewer from '@cccsaurora/howler-ui/components/elements/display/json/JSONViewer';
-import useMySnackbar from '@cccsaurora/howler-ui/components/hooks/useMySnackbar';
 import dayjs from 'dayjs';
 import { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -20,7 +18,6 @@ import { Link } from 'react-router-dom';
 import { sanitizeMultilineLucene } from '@cccsaurora/howler-ui/utils/stringUtils';
 import { v4 as uuid } from 'uuid';
 import QueryEditor from './QueryEditor';
-import RuleModal from './RuleModal';
 const QUERY_TYPES = ['eql', 'lucene', 'yaml'];
 const STEPS = [1, 5, 25, 50, 100, 250, 500, 1000, 2500, 10000];
 const DEFAULT_VALUES = {
@@ -78,8 +75,6 @@ const QueryBuilder = () => {
     const compactLayout = useMediaQuery('(max-width:870px)');
     const monaco = useMonaco();
     const { hitFields, getHitFields } = useContext(FieldContext);
-    const { showModal } = useContext(ModalContext);
-    const { showWarningMessage } = useMySnackbar();
     const [type, setType] = useState('lucene');
     const [loading, setLoading] = useState(false);
     const [query, setQuery] = useState(DEFAULT_VALUES.lucene);
@@ -152,7 +147,7 @@ const QueryBuilder = () => {
     const onKeyDown = useCallback(event => {
         const parsedEvent = parseEvent(event);
         if (parsedEvent.isCtrl && parsedEvent.isEnter) {
-            execute();
+            void execute();
         }
     }, [execute]);
     const onMouseMove = useCallback((event) => {
@@ -168,16 +163,6 @@ const QueryBuilder = () => {
         window.addEventListener('mousemove', onMouseMove);
         window.addEventListener('mouseup', onMouseUp);
     }, [onMouseMove, onMouseUp]);
-    const onCreateRule = useCallback(async () => {
-        if (!response) {
-            showWarningMessage(t('route.advanced.create.rule.disabled'));
-            return;
-        }
-        await new Promise(res => showModal(_jsx(RuleModal, { onSubmit: res, fileData: query, type: type }), {
-            maxWidth: '85vw',
-            maxHeight: '85vh'
-        }));
-    }, [query, response, showModal, showWarningMessage, t, type]);
     const searchDisabled = useMemo(() => type === 'lucene' && queryType === 'groupby' && !groupByField, [groupByField, queryType, type]);
     useEffect(() => {
         if (type !== 'lucene' && queryType !== 'default') {
@@ -195,20 +180,12 @@ const QueryBuilder = () => {
             keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.Enter],
             run: execute
         });
-        const ruleDisposable = monaco.editor.addEditorAction({
-            id: 'save-query',
-            label: t('route.advanced.create.rule'),
-            contextMenuGroupId: 'howler',
-            keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS],
-            run: onCreateRule
-        });
         return () => {
             queryDisposable.dispose();
-            ruleDisposable.dispose();
         };
-    }, [execute, monaco, onCreateRule, t]);
+    }, [execute, monaco, t]);
     useEffect(() => {
-        getHitFields();
+        void getHitFields();
     }, [getHitFields]);
     useEffect(() => {
         setResponse(null);
@@ -233,8 +210,8 @@ const QueryBuilder = () => {
                                             height: '100%',
                                             '& .MuiFormControl-root': { height: '100%', '& > div': { height: '100%' } }
                                         }
-                                    ], slotProps: { paper: { sx: { minWidth: '600px' } } } }), _jsx(Card, { variant: "outlined", sx: { flex: 1, maxWidth: '350px', minWidth: '210px' }, children: _jsxs(Stack, { spacing: 0.5, sx: { px: 1, alignItems: 'start' }, children: [_jsxs(Typography, { variant: "caption", color: "text.secondary", sx: { whiteSpace: 'nowrap' }, children: [t('route.advanced.rows'), ": ", STEPS[rows]] }), _jsx(Slider, { size: "small", valueLabelDisplay: "off", value: rows, onChange: (_, value) => setRows(value), min: 0, max: 9, step: 1, marks: true, track: false, sx: { py: 0.5 } })] }) })] }), type === 'lucene' && (_jsx(Autocomplete, { size: "small", getOptionLabel: opt => t(`route.advanced.query.type.${opt}`), options: LUCENE_QUERY_OPTIONS, value: queryType, onChange: (_event, value) => setQueryType(value), renderInput: params => (_jsx(TextField, { ...params, label: t('route.advanced.query.lucene.type'), sx: { minWidth: '230px' } })), renderOption: (props, option) => (_jsx(ListItemText, { ...props, sx: { flexDirection: 'column', alignItems: 'start !important' }, primary: t(`route.advanced.query.type.${option}`), secondary: t(`route.advanced.query.type.${option}.description`) })) })), queryType === 'groupby' && (_jsx(Autocomplete, { size: "small", options: fieldOptions, value: groupByField, onChange: (__, value) => setGroupByField(value), renderInput: params => _jsx(TextField, { ...params, label: t('route.advanced.pivot.field') }), sx: { minWidth: '200px', '& label': { zIndex: 1200 } }, onKeyDown: onKeyDown, PopperComponent: CustomPopper })), allFields && queryType !== 'facet' ? (_jsx(FormControlLabel, { control: _jsx(Checkbox, { size: "small", checked: allFields, onChange: (__, checked) => setAllFields(checked) }), label: t('route.advanced.fields.all'), sx: { '& > span': { color: 'text.secondary' }, alignSelf: 'start' } })) : (_jsx(Autocomplete, { fullWidth: true, renderTags: values => values.length <= 3 ? (_jsx(Stack, { direction: "row", spacing: 0.5, children: values.map(_value => (_jsx(Chip, { size: "small", label: _value }, _value))) })) : (_jsx(Tooltip, { title: _jsx(Stack, { spacing: 1, children: values.map(_value => (_jsx("span", { children: _value }, _value))) }), children: _jsx(Chip, { size: "small", label: values.length }) })), multiple: true, size: "small", options: fieldOptions, value: fields, onChange: (__, values) => (values.length > 0 ? setFields(values) : setAllFields(true)), renderInput: params => _jsx(TextField, { ...params, label: t('route.advanced.fields') }), sx: { maxWidth: '500px', width: '20vw', minWidth: '200px', '& label': { zIndex: 1200 } }, onKeyDown: onKeyDown, PopperComponent: CustomPopper })), _jsx(FlexOne, {}), type === 'lucene' &&
-                            (smallButtons ? (_jsx(Tooltip, { title: t('route.advanced.open'), children: _jsx(IconButton, { color: "primary", sx: { alignSelf: 'center' }, component: Link, disabled: !response, to: `/hits?query=${sanitizeMultilineLucene(query).replaceAll('\n', ' ').trim()}`, children: _jsx(OpenInNew, { fontSize: "small" }) }) })) : (_jsx(CustomButton, { size: "small", variant: "outlined", startIcon: _jsx(OpenInNew, {}), component: Link, disabled: !response, ...{ to: `/hits?query=${sanitizeMultilineLucene(query).replaceAll('\n', ' ').trim()}` }, children: t('route.advanced.open') }))), smallButtons ? (_jsx(Tooltip, { title: response ? t('route.advanced.create.rule') : t('route.advanced.create.rule.disabled'), children: _jsx(IconButton, { size: "small", sx: { alignSelf: 'center' }, color: "info", onClick: onCreateRule, disabled: !response, children: _jsx(SsidChart, {}) }) })) : (_jsx(CustomButton, { size: "small", variant: "outlined", color: "info", startIcon: _jsx(SsidChart, {}), onClick: onCreateRule, disabled: !response, ...{ to: `/hits?query=${sanitizeMultilineLucene(query).replaceAll('\n', ' ').trim()}` }, tooltip: !response && t('route.advanced.create.rule.disabled'), children: t('route.advanced.create.rule') }))] }), _jsxs(Box, { width: "100%", height: "calc(100vh - 112px)", sx: { position: 'relative', overflow: 'hidden', borderTop: `thin solid ${theme.palette.divider}` }, children: [_jsx(Box, { sx: {
+                                    ], slotProps: { paper: { sx: { minWidth: '600px' } } } }), _jsx(Card, { variant: "outlined", sx: { flex: 1, maxWidth: '350px', minWidth: '210px' }, children: _jsxs(Stack, { spacing: 0.5, sx: { px: 1, alignItems: 'start' }, children: [_jsxs(Typography, { variant: "caption", color: "text.secondary", sx: { whiteSpace: 'nowrap' }, children: [t('route.advanced.rows'), ": ", STEPS[rows]] }), _jsx(Slider, { size: "small", valueLabelDisplay: "off", value: rows, onChange: (_, value) => setRows(value), min: 0, max: 9, step: 1, marks: true, track: false, sx: { py: 0.5 } })] }) })] }), type === 'lucene' && (_jsx(Autocomplete, { size: "small", getOptionLabel: opt => t(`route.advanced.query.type.${opt}`), options: LUCENE_QUERY_OPTIONS, value: queryType, onChange: (_event, value) => setQueryType(value), renderInput: params => (_jsx(TextField, { ...params, label: t('route.advanced.query.lucene.type'), sx: { minWidth: '230px' } })), renderOption: (props, option) => (_jsx(ListItemText, { ...props, sx: { flexDirection: 'column', alignItems: 'start !important' }, primary: t(`route.advanced.query.type.${option}`), secondary: t(`route.advanced.query.type.${option}.description`) })) })), queryType === 'groupby' && (_jsx(Autocomplete, { size: "small", options: fieldOptions, value: groupByField, onChange: (__, value) => setGroupByField(value), renderInput: params => _jsx(TextField, { ...params, label: t('route.advanced.pivot.field') }), sx: { minWidth: '200px', '& label': { zIndex: 1200 } }, onKeyDown: onKeyDown, PopperComponent: CustomPopper })), allFields && queryType !== 'facet' ? (_jsx(FormControlLabel, { control: _jsx(Checkbox, { size: "small", checked: allFields, onChange: (__, checked) => setAllFields(checked) }), label: t('route.advanced.fields.all'), sx: { '& > span': { color: 'text.secondary' }, alignSelf: 'start' } })) : (_jsx(Autocomplete, { fullWidth: true, renderTags: values => values.length <= 3 ? (_jsx(Stack, { direction: "row", spacing: 0.5, children: values.map(_value => (_jsx(Chip, { label: _value }, _value))) })) : (_jsx(Tooltip, { title: _jsx(Stack, { spacing: 1, children: values.map(_value => (_jsx("span", { children: _value }, _value))) }), children: _jsx(Chip, { label: values.length }) })), multiple: true, size: "small", options: fieldOptions, value: fields, onChange: (__, values) => (values.length > 0 ? setFields(values) : setAllFields(true)), renderInput: params => _jsx(TextField, { ...params, label: t('route.advanced.fields') }), sx: { maxWidth: '500px', width: '20vw', minWidth: '200px', '& label': { zIndex: 1200 } }, onKeyDown: onKeyDown, PopperComponent: CustomPopper })), _jsx(FlexOne, {}), type === 'lucene' &&
+                            (smallButtons ? (_jsx(Tooltip, { title: t('route.advanced.open'), children: _jsx(IconButton, { color: "primary", sx: { alignSelf: 'center' }, component: Link, disabled: !response, to: `/hits?query=${sanitizeMultilineLucene(query).replaceAll('\n', ' ').trim()}`, children: _jsx(OpenInNew, { fontSize: "small" }) }) })) : (_jsx(CustomButton, { size: "small", variant: "outlined", startIcon: _jsx(OpenInNew, {}), component: Link, disabled: !response, ...{ to: `/hits?query=${sanitizeMultilineLucene(query).replaceAll('\n', ' ').trim()}` }, children: t('route.advanced.open') })))] }), _jsxs(Box, { width: "100%", height: "calc(100vh - 112px)", sx: { position: 'relative', overflow: 'hidden', borderTop: `thin solid ${theme.palette.divider}` }, children: [_jsx(Box, { sx: {
                                 position: 'absolute',
                                 top: 0,
                                 left: 0,

package/components/routes/advanced/QueryEditor.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useMonaco } from '@monaco-editor/react';
 import { Box, useTheme } from '@mui/material';
 import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
-import { HitSearchContext } from '@cccsaurora/howler-ui/components/app/providers/HitSearchProvider';
+import { RecordSearchContext } from '@cccsaurora/howler-ui/components/app/providers/RecordSearchProvider';
 import ThemedEditor from '@cccsaurora/howler-ui/components/elements/ThemedEditor';
 import { memo, useCallback, useContext, useEffect, useMemo } from 'react';
 import { useContextSelector } from 'use-context-selector';
@@ -20,8 +20,8 @@ const QueryEditor = ({ query, setQuery, onMount, language = 'lucene', fontSize =
     const yamlCompletion = useYamlCompletionProvider();
     const eqlCompletion = useEQLCompletionProvider();
     const historyCompletion = useHistoryCompletionProvider();
-    const fzfSearch = useContextSelector(HitSearchContext, ctx => ctx?.fzfSearch ?? false);
-    const setFzfSearch = useContextSelector(HitSearchContext, ctx => ctx?.setFzfSearch);
+    const fzfSearch = useContextSelector(RecordSearchContext, ctx => ctx?.fzfSearch ?? false);
+    const setFzfSearch = useContextSelector(RecordSearchContext, ctx => ctx?.setFzfSearch);
     const beforeEditorMount = useCallback((_monaco) => {
         _monaco.languages.register({ id: 'lucene' });
         _monaco.languages.register({ id: 'eql' });

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

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

package/components/routes/advanced/eqlTokenProvider.test.js

@@ -0,0 +1,34 @@
+/// <reference types="vitest" />
+import { describe, expect, it } from 'vitest';
+import TOKEN_PROVIDER from './eqlTokenProvider';
+describe('EQL token provider', () => {
+    it('exports a non-null object', () => {
+        expect(TOKEN_PROVIDER).toBeDefined();
+        expect(TOKEN_PROVIDER).not.toBeNull();
+        expect(typeof TOKEN_PROVIDER).toBe('object');
+    });
+    it('has a "root" tokenizer entry', () => {
+        expect(TOKEN_PROVIDER.tokenizer).toBeDefined();
+        expect(TOKEN_PROVIDER.tokenizer.root).toBeDefined();
+        expect(Array.isArray(TOKEN_PROVIDER.tokenizer.root)).toBe(true);
+    });
+    it('uses "invalid" as the defaultToken', () => {
+        expect(TOKEN_PROVIDER.defaultToken).toBe('invalid');
+    });
+    it('defines the expected EQL keywords', () => {
+        const kws = TOKEN_PROVIDER.keywords;
+        expect(kws).toContain('where');
+        expect(kws).toContain('not');
+        expect(kws).toContain('in');
+        expect(kws).toContain('head');
+        expect(kws).toContain('tail');
+    });
+    it('defines boolean operators', () => {
+        const booleans = TOKEN_PROVIDER.booleans;
+        expect(booleans).toContain('and');
+        expect(booleans).toContain('or');
+    });
+    it('has includeLF set to true', () => {
+        expect(TOKEN_PROVIDER.includeLF).toBe(true);
+    });
+});

package/components/routes/advanced/historyCompletionProvider.js

@@ -1,13 +1,13 @@
 import { useMonaco } from '@monaco-editor/react';
-import { HitSearchContext } from '@cccsaurora/howler-ui/components/app/providers/HitSearchProvider';
+import { RecordSearchContext } from '@cccsaurora/howler-ui/components/app/providers/RecordSearchProvider';
 import Fuse from 'fuse.js';
 import { useMemo } from 'react';
 import { useContextSelector } from 'use-context-selector';
 import { twitterShort } from '@cccsaurora/howler-ui/utils/utils';
 const useHistoryCompletionProvider = () => {
     const monaco = useMonaco();
-    const fzfSearch = useContextSelector(HitSearchContext, ctx => ctx?.fzfSearch);
-    const queryHistory = useContextSelector(HitSearchContext, ctx => ctx?.queryHistory ?? {});
+    const fzfSearch = useContextSelector(RecordSearchContext, ctx => ctx?.fzfSearch);
+    const queryHistory = useContextSelector(RecordSearchContext, ctx => ctx?.queryHistory ?? {});
     // Using fuse for fuzzy searching
     const fuse = useMemo(() => new Fuse(Object.keys(queryHistory), { keys: ['key'], threshold: 0.4 }), [queryHistory]);
     return {

package/components/routes/advanced/luceneCompletionProvider.js

@@ -10,7 +10,7 @@ const useLuceneCompletionProvider = () => {
     const monaco = useMonaco();
     const { hitFields, getHitFields } = useContext(FieldContext);
     useEffect(() => {
-        getHitFields();
+        void getHitFields();
     }, [getHitFields]);
     // Using fuse for fuzzy searching
     const fuse = useMemo(() => new Fuse(hitFields, { keys: ['key'], threshold: 0.4 }), [hitFields]);

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

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

package/components/routes/advanced/luceneTokenProvider.test.js

@@ -0,0 +1,34 @@
+/// <reference types="vitest" />
+import { describe, expect, it } from 'vitest';
+import TOKEN_PROVIDER from './luceneTokenProvider';
+describe('Lucene token provider', () => {
+    it('exports a non-null object', () => {
+        expect(TOKEN_PROVIDER).toBeDefined();
+        expect(TOKEN_PROVIDER).not.toBeNull();
+        expect(typeof TOKEN_PROVIDER).toBe('object');
+    });
+    it('has a "root" tokenizer entry', () => {
+        expect(TOKEN_PROVIDER.tokenizer).toBeDefined();
+        expect(TOKEN_PROVIDER.tokenizer.root).toBeDefined();
+        expect(Array.isArray(TOKEN_PROVIDER.tokenizer.root)).toBe(true);
+    });
+    it('defines the expected operators', () => {
+        const ops = TOKEN_PROVIDER.operators;
+        expect(ops).toContain('-');
+        expect(ops).toContain('&&');
+        expect(ops).toContain('||');
+        expect(ops).toContain(':');
+    });
+    it('defines the expected keywords (AND, OR, NOT)', () => {
+        const kws = TOKEN_PROVIDER.keywords;
+        expect(kws).toContain('AND');
+        expect(kws).toContain('OR');
+        expect(kws).toContain('NOT');
+    });
+    it('uses "default" as the defaultToken', () => {
+        expect(TOKEN_PROVIDER.defaultToken).toBe('default');
+    });
+    it('includes a string tokenizer state for quoted values', () => {
+        expect(TOKEN_PROVIDER.tokenizer).toHaveProperty('string');
+    });
+});

package/components/routes/analytics/AnalyticComments.js

@@ -53,7 +53,7 @@ const AnalyticComments = ({ analytic, setAnalytic }) => {
             setShowClear(true);
         }
         if (e.ctrlKey && e.key === 'Enter' && !loading) {
-            onSubmit();
+            void onSubmit();
         }
     }, [loading, onSubmit]);
     const checkLength = useCallback(() => setLength(input.current?.value.length), []);
@@ -89,16 +89,14 @@ const AnalyticComments = ({ analytic, setAnalytic }) => {
             await dispatchApi(api.analytic.comments.react.put(analytic?.analytic_id, commentId, type));
             setAnalytic({
                 ...analytic,
-                comment: analytic.comment.map(cmt => cmt.id !== commentId ? cmt : { ...cmt, reactions: { ...(cmt?.reactions ?? {}), [user.username]: type } })
+                comment: analytic.comment.map(cmt => cmt.id !== commentId ? cmt : { ...cmt, reactions: { ...cmt?.reactions, [user.username]: type } })
             });
         }
         else {
             await dispatchApi(api.analytic.comments.react.del(analytic?.analytic_id, commentId));
             setAnalytic({
                 ...analytic,
-                comment: analytic.comment.map(cmt => cmt.id !== commentId
-                    ? cmt
-                    : { ...cmt, reactions: { ...(cmt?.reactions ?? {}), [user.username]: undefined } })
+                comment: analytic.comment.map(cmt => cmt.id !== commentId ? cmt : { ...cmt, reactions: { ...cmt?.reactions, [user.username]: undefined } })
             });
         }
     }, [analytic, dispatchApi, setAnalytic, user.username]);

package/components/routes/analytics/AnalyticDetails.js

@@ -1,48 +1,36 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Check, Delete, Edit, OpenInNew, SsidChart } from '@mui/icons-material';
-import { Autocomplete, CircularProgress, Divider, FormControl, Grid, IconButton, InputLabel, MenuItem, Select, Skeleton, Stack, Tab, Tabs, TextField, Tooltip, Typography, useTheme } from '@mui/material';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { OpenInNew } from '@mui/icons-material';
+import { Autocomplete, Divider, Grid, IconButton, Skeleton, Stack, Tab, Tabs, TextField, Typography, useTheme } from '@mui/material';
 import api from '@cccsaurora/howler-ui/api';
-import { useAppUser } from '@cccsaurora/howler-ui/commons/components/app/hooks';
 import PageCenter from '@cccsaurora/howler-ui/commons/components/pages/PageCenter';
 import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
-import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
 import { UserListContext } from '@cccsaurora/howler-ui/components/app/providers/UserListProvider';
 import UserList from '@cccsaurora/howler-ui/components/elements/UserList';
 import HowlerAvatar from '@cccsaurora/howler-ui/components/elements/display/HowlerAvatar';
 import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
-import useMySnackbar from '@cccsaurora/howler-ui/components/hooks/useMySnackbar';
 import { useCallback, useContext, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Link, useNavigate, useParams, useSearchParams } from 'react-router-dom';
-import { RULE_INTERVALS } from '@cccsaurora/howler-ui/utils/constants';
+import { Link, useParams, useSearchParams } from 'react-router-dom';
 import AnalyticComments from './AnalyticComments';
 import AnalyticHitComments from './AnalyticHitComments';
 import AnalyticNotebooks from './AnalyticNotebooks';
 import AnalyticOverview from './AnalyticOverview';
 import AnalyticOverviews from './AnalyticOverviews';
 import AnalyticTemplates from './AnalyticTemplates';
-import RuleView from './RuleView';
 import TriageSettings from './TriageSettings';
 const AnalyticDetails = () => {
     const { t } = useTranslation();
     const params = useParams();
-    const navigate = useNavigate();
-    const { user } = useAppUser();
     const [searchParams, setSearchParams] = useSearchParams();
     const { dispatchApi } = useMyApi();
     const theme = useTheme();
-    const { showSuccessMessage } = useMySnackbar();
-    const { withConfirmDeleteModal } = useContext(ModalContext);
     const { users, searchUsers } = useContext(UserListContext);
     const { config } = useContext(ApiConfigContext);
     const [analytic, setAnalytic] = useState(null);
     const [tab, setTab] = useState(searchParams.get('tab') ?? 'overview');
-    const [editingInterval, setEditingInterval] = useState(false);
-    const [intervalLoading, setIntervalLoading] = useState(false);
-    const [crontab, setCrontab] = useState(RULE_INTERVALS[3].crontab);
     const filteredContributors = useMemo(() => (analytic?.contributors ?? []).filter(_user => _user !== analytic?.owner), [analytic?.contributors, analytic?.owner]);
     useEffect(() => {
-        dispatchApi(api.analytic.get(params.id)).then(setAnalytic);
+        void dispatchApi(api.analytic.get(params.id)).then(setAnalytic);
     }, [dispatchApi, params.id]);
     const [filter, _setFilter] = useState(searchParams.get('filter') ?? null);
     const setFilter = useCallback((detection) => {
@@ -53,41 +41,13 @@ const AnalyticDetails = () => {
             _setFilter(detection);
         }
     }, [filter]);
-    const onOwnerChange = useCallback(async (ownerId) => {
+    const onOwnerChange = useCallback(async ([ownerId]) => {
         const result = await dispatchApi(api.analytic.owner.post(analytic.analytic_id, { username: ownerId }), {
             throwError: true,
             showError: true
         });
         setAnalytic(result);
     }, [analytic?.analytic_id, dispatchApi]);
-    const onDelete = useCallback(() => {
-        withConfirmDeleteModal(async () => {
-            await dispatchApi(api.analytic.del(analytic?.analytic_id));
-            showSuccessMessage(t('route.analytics.deleted'));
-            navigate('/analytics');
-        });
-    }, [analytic?.analytic_id, dispatchApi, navigate, withConfirmDeleteModal, showSuccessMessage, t]);
-    const onEdit = useCallback(async () => {
-        if (editingInterval) {
-            setIntervalLoading(true);
-            try {
-                await dispatchApi(api.analytic.put(analytic?.analytic_id, {
-                    rule_crontab: crontab
-                }));
-                setAnalytic(_analytic => ({
-                    ..._analytic,
-                    rule_crontab: crontab
-                }));
-                setEditingInterval(false);
-            }
-            finally {
-                setIntervalLoading(false);
-            }
-        }
-        else {
-            setEditingInterval(true);
-        }
-    }, [analytic?.analytic_id, crontab, dispatchApi, editingInterval]);
     useEffect(() => {
         if (searchParams.get('tab') !== tab) {
             searchParams.set('tab', tab);
@@ -108,23 +68,15 @@ const AnalyticDetails = () => {
         }
         searchUsers(`uname:"${analytic?.owner}"`);
     }, [analytic?.owner, searchUsers]);
-    return (_jsx(PageCenter, { maxWidth: "1500px", textAlign: "left", height: "100%", children: _jsxs("div", { style: { height: '100%', display: 'flex', flexDirection: 'column' }, children: [_jsx(Typography, { variant: "h3", mb: 2, children: _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [analytic ? (_jsx("span", { children: analytic.name })) : (_jsxs(Stack, { children: [_jsx(Skeleton, { variant: "text", width: "170px", height: "28px" }), _jsx(Skeleton, { variant: "text", width: "140px", height: "28px" })] })), analytic?.rule && (_jsxs(_Fragment, { children: [_jsx(Tooltip, { title: t('route.analytics.rule'), children: _jsx(SsidChart, { fontSize: "large", color: "info" }) }), (analytic?.owner === user.username || user.roles.includes('admin')) && (_jsx(IconButton, { onClick: onDelete, children: _jsx(Delete, {}) }))] })), _jsx(IconButton, { component: Link, to: `/hits?query=howler.analytic:"${analytic?.name}"`, children: _jsx(OpenInNew, {}) })] }) }), _jsxs(Stack, { direction: "row", spacing: 1, divider: _jsx(Divider, { flexItem: true, orientation: "vertical", sx: { marginLeft: `${theme.spacing(2)} !important`, marginRight: `${theme.spacing(1)} !important` } }), mb: 2, children: [_jsxs(Stack, { spacing: 1, alignItems: "start", children: [_jsx(Typography, { variant: "body1", color: "text.secondary", children: t('owner') }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [!analytic?.rule ? (_jsx(UserList, { buttonSx: {
+    return (_jsx(PageCenter, { maxWidth: "1500px", textAlign: "left", height: "100%", children: _jsxs("div", { style: { height: '100%', display: 'flex', flexDirection: 'column' }, children: [_jsx(Typography, { variant: "h3", mb: 2, children: _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [analytic ? (_jsx("span", { children: analytic.name })) : (_jsxs(Stack, { children: [_jsx(Skeleton, { variant: "text", width: "170px", height: "28px" }), _jsx(Skeleton, { variant: "text", width: "140px", height: "28px" })] })), _jsx(IconButton, { component: Link, to: `/hits?query=howler.analytic:"${analytic?.name}"`, children: _jsx(OpenInNew, {}) })] }) }), _jsxs(Stack, { direction: "row", spacing: 1, divider: _jsx(Divider, { flexItem: true, orientation: "vertical", sx: { marginLeft: `${theme.spacing(2)} !important`, marginRight: `${theme.spacing(1)} !important` } }), mb: 2, children: [_jsxs(Stack, { spacing: 1, alignItems: "start", children: [_jsx(Typography, { variant: "body1", color: "text.secondary", children: t('owner') }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(UserList, { buttonSx: {
                                                 marginTop: '0 !important',
                                                 marginLeft: `${theme.spacing(-1)} !important`,
                                                 marginRight: `${theme.spacing(-1)} !important`
-                                            }, userId: analytic?.owner, onChange: onOwnerChange, i18nLabel: "route.analytics.set.owner" })) : (_jsx(HowlerAvatar, { userId: analytic?.owner })), _jsx(Stack, { children: users[analytic?.owner] ? (_jsxs(_Fragment, { children: [_jsx(Typography, { variant: "body1", children: users[analytic?.owner].name }), _jsx(Typography, { component: "a", href: `mailto:${users[analytic?.owner].email}`, variant: "caption", color: "text.secondary", children: users[analytic?.owner].email })] })) : (_jsxs(_Fragment, { children: [_jsx(Skeleton, { variant: "text", width: "70px" }), _jsx(Skeleton, { variant: "text", width: "60px" })] })) })] })] }), filteredContributors.length > 0 && (_jsxs(Stack, { spacing: 1, children: [_jsx(Typography, { variant: "body1", color: "text.secondary", children: t('route.analytics.contributors') }), _jsx(Stack, { direction: "row", alignItems: "center", spacing: 1, children: filteredContributors.map(_user => (_jsx(HowlerAvatar, { userId: _user }, _user))) })] })), analytic?.rule_crontab && (_jsxs(Stack, { direction: "row", spacing: 1, children: [_jsxs(Stack, { spacing: 1, justifyContent: "space-between", children: [_jsx(Typography, { variant: "body1", color: "text.secondary", children: t('rule.interval') }), editingInterval ? (_jsxs(FormControl, { sx: { minWidth: '200px' }, children: [_jsx(InputLabel, { children: t('rule.interval') }), _jsx(Select, { size: "small", label: t('rule.interval'), onChange: event => setCrontab(event.target.value), value: crontab, children: RULE_INTERVALS.map(interval => (_jsx(MenuItem, { value: interval.crontab, children: t(interval.key) }, interval.key))) })] })) : (_jsx("code", { style: {
-                                                backgroundColor: theme.palette.background.paper,
-                                                padding: theme.spacing(0.5),
-                                                alignSelf: 'start',
-                                                borderRadius: theme.shape.borderRadius,
-                                                border: `thin solid ${theme.palette.divider}`,
-                                                width: '100%'
-                                            }, children: analytic.rule_crontab }))] }), (analytic?.owner === user.username || user.roles.includes('admin')) && (_jsx(Tooltip, { title: editingInterval ? t('rule.interval.save') : t('rule.interval.edit'), children: _jsx(IconButton, { disabled: intervalLoading, sx: { alignSelf: 'end' }, onClick: onEdit, children: intervalLoading ? _jsx(CircularProgress, { size: 20 }) : editingInterval ? _jsx(Check, {}) : _jsx(Edit, {}) }) }))] }))] }), _jsxs(Grid, { container: true, children: [_jsx(Grid, { item: true, xs: 12, md: 9, children: _jsxs(Tabs, { value: tab, onChange: (_, _tab) => setTab(_tab), children: [_jsx(Tab, { label: t('route.analytics.tab.overview'), value: "overview" }), _jsx(Tab, { label: t('route.analytics.tab.comments'), value: "comments" }), _jsx(Tab, { label: t('route.analytics.tab.hit_comments'), value: "hit_comments" }), _jsx(Tab, { label: t('route.analytics.tab.templates'), value: "templates" }), _jsx(Tab, { label: t('route.analytics.tab.overviews'), value: "overviews" }), analytic?.rule && _jsx(Tab, { label: t('route.analytics.tab.rule'), value: "rule" }), config?.configuration.features.notebook && (_jsx(Tab, { label: t('route.analytics.tab.notebooks'), value: "notebooks" })), _jsx(Tab, { label: t('route.analytics.tab.triage'), value: "triage" })] }) }), ['comments', 'hit_comments'].includes(tab) && (_jsx(Grid, { item: true, xs: 12, md: 3, children: _jsx(Autocomplete, { options: analytic?.detections ?? [], renderInput: param => _jsx(TextField, { ...param, label: t('route.analytics.dropdown.detection') }), value: filter, onChange: (_, v) => setFilter(v) }) }))] }), {
+                                            }, userIds: [analytic?.owner], onChange: onOwnerChange, i18nLabel: "route.analytics.set.owner" }), _jsx(Stack, { children: users[analytic?.owner] ? (_jsxs(_Fragment, { children: [_jsx(Typography, { variant: "body1", children: users[analytic?.owner].name }), _jsx(Typography, { component: "a", href: `mailto:${users[analytic?.owner].email}`, variant: "caption", color: "text.secondary", children: users[analytic?.owner].email })] })) : (_jsxs(_Fragment, { children: [_jsx(Skeleton, { variant: "text", width: "70px" }), _jsx(Skeleton, { variant: "text", width: "60px" })] })) })] })] }), filteredContributors.length > 0 && (_jsxs(Stack, { spacing: 1, children: [_jsx(Typography, { variant: "body1", color: "text.secondary", children: t('route.analytics.contributors') }), _jsx(Stack, { direction: "row", alignItems: "center", spacing: 1, children: filteredContributors.map(_user => (_jsx(HowlerAvatar, { userId: _user }, _user))) })] }))] }), _jsxs(Grid, { container: true, children: [_jsx(Grid, { item: true, xs: 12, md: 9, children: _jsxs(Tabs, { value: tab, onChange: (_, _tab) => setTab(_tab), children: [_jsx(Tab, { label: t('route.analytics.tab.overview'), value: "overview" }), _jsx(Tab, { label: t('route.analytics.tab.comments'), value: "comments" }), _jsx(Tab, { label: t('route.analytics.tab.hit_comments'), value: "hit_comments" }), _jsx(Tab, { label: t('route.analytics.tab.templates'), value: "templates" }), _jsx(Tab, { label: t('route.analytics.tab.overviews'), value: "overviews" }), config?.configuration.features.notebook && (_jsx(Tab, { label: t('route.analytics.tab.notebooks'), value: "notebooks" })), _jsx(Tab, { label: t('route.analytics.tab.triage'), value: "triage" })] }) }), ['comments', 'hit_comments'].includes(tab) && (_jsx(Grid, { item: true, xs: 12, md: 3, children: _jsx(Autocomplete, { options: analytic?.detections ?? [], renderInput: param => _jsx(TextField, { ...param, label: t('route.analytics.dropdown.detection') }), value: filter, onChange: (_, v) => setFilter(v) }) }))] }), {
                     comments: _jsx(AnalyticComments, { analytic: analytic, setAnalytic: setAnalytic }),
                     hit_comments: _jsx(AnalyticHitComments, { analytic: analytic }),
                     overview: _jsx(AnalyticOverview, { analytic: analytic, setAnalytic: setAnalytic }),
                     overviews: _jsx(AnalyticOverviews, { analytic: analytic }),
-                    rule: _jsx(RuleView, { analytic: analytic, setAnalytic: setAnalytic }),
                     templates: _jsx(AnalyticTemplates, { analytic: analytic }),
                     triage: _jsx(TriageSettings, { analytic: analytic, setAnalytic: setAnalytic }),
                     ...(config?.configuration.features.notebook

package/components/routes/analytics/AnalyticHitComments.js

@@ -25,7 +25,7 @@ const AnalyticHitComments = ({ analytic }) => {
             return;
         }
         setLoading(true);
-        api.search.hit
+        void api.search.hit
             .post({
             query: `howler.analytic:"${sanitizeLuceneQuery(analytic.name)}" AND _exists_:howler.comment`,
             rows: pageCount

package/components/routes/analytics/AnalyticHitComments.test.js

@@ -1,4 +1,4 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { render, screen, waitFor } from '@testing-library/react';
 import { omit } from 'lodash-es';
 import { MemoryRouter } from 'react-router-dom';

package/components/routes/analytics/AnalyticOverview.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Check, Edit } from '@mui/icons-material';
 import { Alert, AlertTitle, Box, Card, CardContent, CircularProgress, Divider, IconButton, Skeleton, Stack, TextField, Typography, useMediaQuery, useTheme } from '@mui/material';
 import api from '@cccsaurora/howler-ui/api';
@@ -30,7 +30,7 @@ const AnalyticOverview = ({ analytic, setAnalytic }) => {
             return;
         }
         setLoading(true);
-        api.search.count.hit
+        void api.search.count.hit
             .post({ query: `howler.analytic:"${sanitizeLuceneQuery(analytic.name)}"` })
             .then(({ count }) => setEmpty(!count))
             .finally(() => setLoading(false));

package/components/routes/analytics/AnalyticOverviews.js

@@ -16,7 +16,7 @@ const AnalyticOverviews = ({ analytic }) => {
     const [loading, setLoading] = useState(false);
     useEffect(() => {
         setLoading(true);
-        getOverviews().finally(() => setLoading(false));
+        void getOverviews().finally(() => setLoading(false));
     }, [getOverviews]);
     if (!analytic) {
         return _jsx(Skeleton, { variant: "rounded", width: "100%", sx: { minHeight: '300px', mt: 2 } });