@cccsaurora/howler-ui 3.1.0-dev.1493 → 3.1.0-dev.1607

package/components/routes/templates/Templates.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useAppUser } from '@tui/core';
 import { Article } from '@mui/icons-material';
 import { Stack, ToggleButton, ToggleButtonGroup, Typography } from '@mui/material';
 import api from '@cccsaurora/howler-ui/api';
-import { useAppUser } from '@cccsaurora/howler-ui/commons/components/app/hooks';
 import { AnalyticContext } from '@cccsaurora/howler-ui/components/app/providers/AnalyticProvider';
-import SearchResponseProvider, { SearchResponseContext } from '@cccsaurora/howler-ui/components/app/providers/SearchResponseProvider';
+import SearchResponseProvider, { createSearchResponseContext, useSearchResponseContext } from '@cccsaurora/howler-ui/components/app/providers/SearchResponseProvider';
 import { TuiListProvider } from '@cccsaurora/howler-ui/components/elements/addons/lists';
 import { TuiListMethodContext } from '@cccsaurora/howler-ui/components/elements/addons/lists/TuiListProvider';
 import ItemManager from '@cccsaurora/howler-ui/components/elements/display/ItemManager';
@@ -13,9 +13,10 @@ import { useMyLocalStorageItem } from '@cccsaurora/howler-ui/components/hooks/us
 import useMySnackbar from '@cccsaurora/howler-ui/components/hooks/useMySnackbar';
 import { useCallback, useContext, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useNavigate, useSearchParams } from 'react-router-dom';
+import { useNavigate, useSearchParams } from 'react-router';
 import { StorageKey } from '@cccsaurora/howler-ui/utils/constants';
 import TemplateCard from './TemplateCard';
+const SearchResponseContext = createSearchResponseContext();
 const TemplatesBase = () => {
     const { t } = useTranslation();
     const { user } = useAppUser();
@@ -26,7 +27,7 @@ const TemplatesBase = () => {
     const pageCount = useMyLocalStorageItem(StorageKey.PAGE_COUNT, 25)[0];
     const { showSuccessMessage } = useMySnackbar();
     const { analytics } = useContext(AnalyticContext);
-    const { response, request, remove, getSearchRequestData } = useContext(SearchResponseContext);
+    const { response, request, remove, getSearchRequestData } = useSearchResponseContext(SearchResponseContext);
     const [phrase, setPhrase] = useState('');
     const [offset, setOffset] = useState(parseInt(searchParams.get('offset')) || 0);
     const [types, setTypes] = useState([]);
@@ -70,11 +71,11 @@ const TemplatesBase = () => {
                 item,
                 selected: false,
                 cursor: false,
-                disabled: item.detection &&
+                disabled: !!(item.detection &&
                     !analytics
                         .find(v => v.name === item.analytic)
                         ?.detections?.map((s) => s.toLowerCase())
-                        ?.includes(item.detection?.toLowerCase())
+                        ?.includes(item.detection?.toLowerCase()))
             })));
         }
     }, [response, load, analytics]);
@@ -95,7 +96,7 @@ const TemplatesBase = () => {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [dispatchApi, types]);
     useEffect(() => {
-        if (response?.total <= offset) {
+        if ((response?.total ?? 0) <= offset) {
             setOffset(0);
             searchParams.set('offset', '0');
             setSearchParams(searchParams, { replace: true });
@@ -122,10 +123,10 @@ const TemplatesBase = () => {
                         setTypes(_types.length < 2 ? _types : []);
                     }
                 }, children: [_jsx(ToggleButton, { value: "personal", "aria-label": "personal", children: t('route.templates.manager.personal') }), _jsx(ToggleButton, { value: "global", "aria-label": "global", children: t('route.templates.manager.global') })] }) }), aboveSearch: _jsx(Typography, { sx: theme => ({ fontStyle: 'italic', color: theme.palette.text.disabled, mb: 0.5 }), variant: "body2", children: t('route.templates.search.prompt') }), renderer: ({ item }, classRenderer) => renderer(item.item, !!item.disabled, classRenderer()), response: response, onSelect: (item) => {
-            navigate(`/templates/view?type=${item.item.type}&analytic=${item.item.analytic}${item.item.detection ? '&detection=' + item.item.detection : ''}`);
+            void navigate(`/templates/view?type=${item.item.type}&analytic=${item.item.analytic}${item.item.detection ? '&detection=' + item.item.detection : ''}`);
         }, onCreate: () => navigate('/templates/view'), createPrompt: "route.templates.create", searchPrompt: "route.templates.manager.search", createIcon: _jsx(Article, { sx: { mr: 1 } }) }));
 };
 const Templates = () => {
-    return (_jsx(TuiListProvider, { children: _jsx(SearchResponseProvider, { idField: "template_id", children: _jsx(TemplatesBase, {}) }) }));
+    return (_jsx(TuiListProvider, { children: _jsx(SearchResponseProvider, { context: SearchResponseContext, idField: "template_id", children: _jsx(TemplatesBase, {}) }) }));
 };
 export default Templates;

package/components/routes/views/ViewComposer.js

@@ -1,11 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AppListEmpty, PageCenter } from '@tui/core';
 import { useCallback, useContext, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { HelpOutline, Save, Settings } from '@mui/icons-material';
 import { Alert, Checkbox, CircularProgress, LinearProgress, Paper, Stack, TextField, ToggleButton, ToggleButtonGroup, Tooltip, Typography } from '@mui/material';
 import api from '@cccsaurora/howler-ui/api';
-import AppListEmpty from '@cccsaurora/howler-ui/commons/components/display/AppListEmpty';
-import PageCenter from '@cccsaurora/howler-ui/commons/components/pages/PageCenter';
 import { GridColumnsContext } from '@cccsaurora/howler-ui/components/app/providers/GridColumnsProvider';
 import { ParameterContext } from '@cccsaurora/howler-ui/components/app/providers/ParameterProvider';
 import { RecordContext } from '@cccsaurora/howler-ui/components/app/providers/RecordProvider';
@@ -24,16 +23,17 @@ import AddColumnModal from '@cccsaurora/howler-ui/components/elements/hit/grid/A
 import RecordTable from '@cccsaurora/howler-ui/components/elements/hit/grid/RecordTable';
 import HitCard from '@cccsaurora/howler-ui/components/elements/hit/HitCard';
 import { HitLayout } from '@cccsaurora/howler-ui/components/elements/hit/HitLayout';
-import LayoutToggle, {} from '@cccsaurora/howler-ui/components/elements/view/LayoutToggle';
+import LayoutToggle from '@cccsaurora/howler-ui/components/elements/view/LayoutToggle';
 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 { uniq } from 'lodash-es';
-import { useNavigate, useParams } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router';
 import { useContextSelector } from 'use-context-selector';
 import { DEFAULT_QUERY, StorageKey } from '@cccsaurora/howler-ui/utils/constants';
 import { convertDateToLucene } from '@cccsaurora/howler-ui/utils/utils';
 import { buildViewUrl } from '@cccsaurora/howler-ui/utils/viewUtils';
+import { MembershipManagement } from '../../elements/membership/MembershipManagement';
 import ErrorBoundary from '../ErrorBoundary';
 import RecordQuery from '../hits/search/RecordQuery';
 import HitSort from '../hits/search/shared/HitSort';
@@ -52,6 +52,7 @@ const ViewComposer = () => {
     const setIndexes = useContextSelector(ParameterContext, ctx => ctx.setIndexes);
     const pageCount = useMyLocalStorageItem(StorageKey.PAGE_COUNT, 25)[0];
     const loadRecords = useContextSelector(RecordContext, ctx => ctx.loadRecords);
+    const [view, setView] = useState();
     // view state
     const [title, setTitle] = useState('');
     const [type, setType] = useState('global');
@@ -79,22 +80,22 @@ const ViewComposer = () => {
             width: columnWidths[column] ?? null
         }));
         try {
-            const normalizedIndexes = indexes?.length > 0 ? indexes : ['hit'];
+            const normalizedIndexes = (indexes?.length ?? 0) > 0 ? indexes : ['hit'];
             if (!routeParams.id) {
                 const newView = await addView({
                     title,
                     type,
                     query,
                     indexes: normalizedIndexes,
-                    sort: sort || null,
-                    span: span || null,
+                    sort,
+                    span,
                     settings: {
                         advance_on_triage: advanceOnTriage,
                         display: displayType,
-                        columns: displayType === 'grid' ? _columnData : null
+                        columns: displayType === 'grid' ? _columnData : undefined
                     }
                 });
-                navigate(buildViewUrl(newView));
+                void navigate(buildViewUrl(newView));
             }
             else {
                 await editView(routeParams.id, {
@@ -107,14 +108,14 @@ const ViewComposer = () => {
                     settings: {
                         advance_on_triage: advanceOnTriage,
                         display: displayType,
-                        columns: displayType === 'grid' ? _columnData : null
+                        columns: displayType === 'grid' ? _columnData : undefined
                     }
                 });
             }
             showSuccessMessage(t(routeParams.id ? 'route.views.update.success' : 'route.views.create.success'));
         }
         catch (e) {
-            showErrorMessage(e.message);
+            showErrorMessage(e instanceof Error ? e.message : String(e));
         }
         finally {
             setLoading(false);
@@ -142,7 +143,7 @@ const ViewComposer = () => {
         setSearching(true);
         setError(null);
         try {
-            const normalizedIndexes = searchIndexes?.length > 0 ? searchIndexes : ['hit'];
+            const normalizedIndexes = (searchIndexes?.length ?? 0) > 0 ? searchIndexes : ['hit'];
             const _response = await dispatchApi(api.v2.search.post(normalizedIndexes, {
                 rows: pageCount,
                 query: searchQuery,
@@ -150,11 +151,17 @@ const ViewComposer = () => {
                 filters: searchSpan ? [`event.created:${convertDateToLucene(searchSpan)}`] : [],
                 metadata: ['template', 'analytic']
             }), { showError: false, throwError: true });
-            loadRecords(_response.items);
-            setResponse(_response);
+            const searchResponse = _response ?? {
+                items: [],
+                offset: 0,
+                rows: pageCount,
+                total: 0
+            };
+            loadRecords(searchResponse.items);
+            setResponse(searchResponse);
         }
         catch (e) {
-            setError(e.message);
+            setError(e instanceof Error ? e.message : String(e));
         }
         finally {
             setSearching(false);
@@ -183,30 +190,31 @@ const ViewComposer = () => {
             return;
         }
         void (async () => {
-            const viewToEdit = (await getCurrentViews({ views: [routeParams.id] }))[0];
-            if (!viewToEdit) {
+            const _view = (await getCurrentViews({ views: [routeParams.id] }))[0];
+            setView(_view);
+            if (!_view) {
                 setError('route.views.missing');
                 return;
             }
             else {
                 setError(null);
             }
-            setTitle(viewToEdit.title);
-            setAdvanceOnTriage(viewToEdit.settings?.advance_on_triage ?? false);
-            setDisplayType((viewToEdit.settings?.display ?? null));
-            setType(viewToEdit.type);
-            const loadedQuery = viewToEdit.query || DEFAULT_QUERY;
-            const loadedIndexes = viewToEdit.indexes || indexes;
-            const loadedSort = viewToEdit.sort || sort;
-            const loadedSpan = viewToEdit.span || span;
+            setTitle(_view.title ?? '');
+            setAdvanceOnTriage(_view.settings?.advance_on_triage ?? false);
+            setDisplayType(_view.settings?.display ?? 'list');
+            setType(_view.type);
+            const loadedQuery = _view.query || DEFAULT_QUERY;
+            const loadedIndexes = _view.indexes || indexes || ['hit'];
+            const loadedSort = _view.sort || sort;
+            const loadedSpan = _view.span || span;
             setQuery(loadedQuery);
-            if (viewToEdit.indexes) {
+            if (_view.indexes) {
                 setIndexes(loadedIndexes);
             }
-            if (viewToEdit.sort) {
+            if (_view.sort) {
                 setSort(loadedSort);
             }
-            if (viewToEdit.span) {
+            if (_view.span) {
                 setSpan(loadedSpan);
             }
             // Perform search with the loaded values to avoid using stale state
@@ -219,11 +227,11 @@ const ViewComposer = () => {
                                                     if (_type) {
                                                         setType(_type);
                                                     }
-                                                }, children: [_jsx(ToggleButton, { value: "personal", "aria-label": "personal", children: t('route.views.manager.personal') }), _jsx(ToggleButton, { value: "global", "aria-label": "global", children: t('route.views.manager.global') })] }), _jsx(CustomButton, { variant: "outlined", disabled: !title || !type || !query || !response || loading || searching || isSearchDirty, startIcon: loading ? _jsx(CircularProgress, { size: 20 }) : _jsx(Save, {}), onClick: onSave, children: t('save') })] }), _jsx(Typography, { sx: theme => ({
+                                                }, children: [_jsx(ToggleButton, { value: "personal", "aria-label": "personal", children: t('route.views.manager.personal') }), _jsx(ToggleButton, { value: "global", "aria-label": "global", children: t('route.views.manager.global') })] }), _jsx(CustomButton, { variant: "outlined", disabled: !title || !type || !query || !response || loading || searching || isSearchDirty, startIcon: loading ? _jsx(CircularProgress, { size: 20 }) : _jsx(Save, {}), onClick: onSave, children: t('save') }), _jsx(MembershipManagement, { type: "view", entity: view, onChange: _view => setView(_view) })] }), _jsx(Typography, { sx: theme => ({
                                             color: theme.palette.text.secondary,
                                             fontSize: '0.9em',
                                             fontStyle: 'italic',
                                             mb: 0.5
-                                        }), variant: "body2", children: t('hit.search.prompt') }), _jsx(Stack, { direction: "row", width: "100%", spacing: 2, alignItems: "flex-start", paddingBottom: 1, children: _jsxs(Stack, { direction: "column", width: "100%", spacing: 1, children: [_jsx(RecordQuery, { triggerSearch: search, searching: searching, onChange: (_query, isDirty) => setIsSearchDirty(isDirty) }), _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(IndexPicker, {}), _jsx(HitSort, {}), _jsx(SearchSpan, { omitCustom: true }), _jsx("div", { style: { flex: 1 } }), _jsx(ChipPopper, { label: _jsx(Typography, { variant: "body2", children: t('view.settings') }), deleteIcon: _jsx(Settings, {}), toggleOnDelete: true, slotProps: { chip: { size: 'small' } }, placement: "bottom-end", children: _jsxs(Stack, { direction: "column", spacing: 1, children: [_jsxs(Stack, { spacing: 1, direction: "row", alignItems: "center", sx: { flex: '0 !important', minWidth: '300px' }, children: [_jsx(Typography, { component: "span", children: t('view.settings.advance_on_triage') }), _jsx(Tooltip, { title: t('view.settings.advance_on_triage.description'), children: _jsx(HelpOutline, { sx: { fontSize: '16px' } }) }), _jsx(FlexOne, {}), _jsx(Checkbox, { size: "small", checked: advanceOnTriage, onChange: (_event, checked) => setAdvanceOnTriage(checked) })] }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", justifyContent: "space-between", children: [_jsx(Typography, { component: "span", children: t('view.settings.layout') }), _jsx(LayoutToggle, { displayType: displayType, setDisplayType: setDisplayType, size: "small", allowNullValue: true })] })] }) })] })] }) }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "flex-end", justifyContent: "space-between", children: [response && (_jsx(SearchTotal, { total: response.total, pageLength: response.items.length, offset: response.offset, sx: theme => ({ color: theme.palette.text.secondary, fontSize: '0.9em', fontStyle: 'italic' }) })), _jsx(FlexOne, {}), displayType === 'grid' && (_jsx(AddColumnModal, { columns: columns, addColumn: key => isReady && setColumns(uniq([...columns, key])) }))] }), _jsx(LinearProgress, { sx: [!searching && { opacity: 0 }] })] }) }), _jsx(VSBoxContent, { children: displayType === 'grid' ? (_jsx(Stack, { component: Paper, spacing: 1, width: "100%", height: "100%", sx: { overflow: 'auto', flex: 1 }, children: _jsx(RecordTable, { query: query, items: response?.items }) })) : (_jsxs(Stack, { spacing: 1, children: [!response?.total && _jsx(AppListEmpty, {}), response?.items.map(record => record.__index === 'hit' ? (_jsx(HitCard, { id: record.howler.id, layout: HitLayout.DENSE }, record.howler.id)) : (_jsx(EventCard, { event: record }, record.howler.id)))] })) })] }) }) }) }));
+                                        }), variant: "body2", children: t('hit.search.prompt') }), _jsx(Stack, { direction: "row", width: "100%", spacing: 2, alignItems: "flex-start", paddingBottom: 1, children: _jsxs(Stack, { direction: "column", width: "100%", spacing: 1, children: [_jsx(RecordQuery, { triggerSearch: search, searching: searching, onChange: (_query, isDirty) => setIsSearchDirty(isDirty) }), _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(IndexPicker, {}), _jsx(HitSort, {}), _jsx(SearchSpan, { omitCustom: true }), _jsx("div", { style: { flex: 1 } }), _jsx(ChipPopper, { label: _jsx(Typography, { variant: "body2", children: t('view.settings') }), deleteIcon: _jsx(Settings, {}), toggleOnDelete: true, slotProps: { chip: { size: 'small' } }, placement: "bottom-end", children: _jsxs(Stack, { direction: "column", spacing: 1, children: [_jsxs(Stack, { spacing: 1, direction: "row", alignItems: "center", sx: { flex: '0 !important', minWidth: '300px' }, children: [_jsx(Typography, { component: "span", children: t('view.settings.advance_on_triage') }), _jsx(Tooltip, { title: t('view.settings.advance_on_triage.description'), children: _jsx(HelpOutline, { sx: { fontSize: '16px' } }) }), _jsx(FlexOne, {}), _jsx(Checkbox, { size: "small", checked: advanceOnTriage, onChange: (_event, checked) => setAdvanceOnTriage(checked) })] }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", justifyContent: "space-between", children: [_jsx(Typography, { component: "span", children: t('view.settings.layout') }), _jsx(LayoutToggle, { displayType: displayType, setDisplayType: type => type && setDisplayType(type), size: "small", allowNullValue: true })] })] }) })] })] }) }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "flex-end", justifyContent: "space-between", children: [response && (_jsx(SearchTotal, { total: response.total, pageLength: response.items.length, offset: response.offset, sx: theme => ({ color: theme.palette.text.secondary, fontSize: '0.9em', fontStyle: 'italic' }) })), _jsx(FlexOne, {}), displayType === 'grid' && (_jsx(AddColumnModal, { columns: columns, addColumn: key => isReady && setColumns(uniq([...columns, key])) }))] }), _jsx(LinearProgress, { sx: [!searching && { opacity: 0 }] })] }) }), _jsx(VSBoxContent, { children: displayType === 'grid' ? (_jsx(Stack, { component: Paper, spacing: 1, width: "100%", height: "100%", sx: { overflow: 'auto', flex: 1 }, children: _jsx(RecordTable, { query: query ?? DEFAULT_QUERY, items: response?.items }) })) : (_jsxs(Stack, { spacing: 1, children: [!response?.total && _jsx(AppListEmpty, {}), response?.items.map(record => record.__index === 'hit' ? (_jsx(HitCard, { id: record.howler.id, layout: HitLayout.DENSE }, record.howler.id)) : (_jsx(EventCard, { event: record }, record.howler.id)))] })) })] }) }) }) }));
 };
 export default ViewComposer;

package/components/routes/views/Views.d.ts

@@ -1,2 +1,3 @@
-declare const Views: () => import("react/jsx-runtime").JSX.Element;
+import React from 'react';
+declare const Views: () => React.JSX.Element;
 export default Views;

package/components/routes/views/Views.js

@@ -2,28 +2,29 @@ import { createElement as _createElement } from "react";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Clear, Edit, SavedSearch, Star, StarBorder } from '@mui/icons-material';
 import { Autocomplete, Card, Checkbox, IconButton, Skeleton, Stack, TextField, ToggleButton, ToggleButtonGroup, Tooltip, Typography } from '@mui/material';
+import { useAppUser } from '@tui/core';
 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 SearchResponseProvider, { createSearchResponseContext, useSearchResponseContext } from '@cccsaurora/howler-ui/components/app/providers/SearchResponseProvider';
 import { ViewContext } from '@cccsaurora/howler-ui/components/app/providers/ViewProvider';
 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 Members from '@cccsaurora/howler-ui/components/elements/membership/Members';
 import { ViewTitle } from '@cccsaurora/howler-ui/components/elements/view/ViewTitle';
 import { useMyLocalStorageItem } from '@cccsaurora/howler-ui/components/hooks/useMyLocalStorage';
 import useMySnackbar from '@cccsaurora/howler-ui/components/hooks/useMySnackbar';
-import { isNull, omitBy, size } from 'lodash-es';
+import { isNil, omitBy, size } from 'lodash-es';
 import React, { useCallback, useContext, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Link, useNavigate, useSearchParams } from 'react-router-dom';
+import { Link, useNavigate, useSearchParams } from 'react-router';
 import { useContextSelector } from 'use-context-selector';
 import { StorageKey } from '@cccsaurora/howler-ui/utils/constants';
 import { sanitizeLuceneQuery } from '@cccsaurora/howler-ui/utils/stringUtils';
 import { buildViewUrl } from '@cccsaurora/howler-ui/utils/viewUtils';
 const FIELDS_TO_SEARCH = ['title', 'query', 'sort', 'type', 'owner'];
+const SearchResponseContext = createSearchResponseContext();
 const ViewsBase = () => {
     const { t } = useTranslation();
     const { user } = useAppUser();
@@ -40,10 +41,10 @@ const ViewsBase = () => {
     const [searchParams, setSearchParams] = useSearchParams();
     const { load } = useContext(TuiListMethodContext);
     const pageCount = useMyLocalStorageItem(StorageKey.PAGE_COUNT, 25)[0];
-    const { response, request, remove, getSearchRequestData } = useContext(SearchResponseContext);
+    const { response, request, remove, getSearchRequestData } = useSearchResponseContext(SearchResponseContext);
     const [phrase, setPhrase] = useState('');
     const [offset, setOffset] = useState(parseInt(searchParams.get('offset')) || 0);
-    const [type, setType] = useState(searchParams.get('type') || null);
+    const [type, setType] = useState(searchParams.get('type'));
     const [hasError, setHasError] = useState(false);
     const [searching, setSearching] = useState(false);
     const [favouritesOnly, setFavouritesOnly] = useState(false);
@@ -62,8 +63,10 @@ const ViewsBase = () => {
             setSearchParams(searchParams, { replace: true });
             const searchTerm = phrase ? `*${sanitizeLuceneQuery(phrase)}*` : '*';
             const phraseQuery = FIELDS_TO_SEARCH.map(_field => `${_field}:${searchTerm}`).join(' OR ');
-            const typeQuery = `(type:global OR owner:(${user.username} OR none)) AND type:(${type ?? '*'}${type === 'personal' ? ' OR readonly' : ''})`;
-            const favouritesQuery = favouritesOnly && user.favourite_views.length > 0 ? ` AND view_id:(${user.favourite_views.join(' OR ')})` : '';
+            const typeQuery = `(type:global OR owner:(${user.username} OR none) OR admins:${user.username} OR members:${user.username}) AND type:(${type ?? '*'}${type === 'personal' ? ' OR readonly' : ''})`;
+            const favouritesQuery = favouritesOnly && (user.favourite_views?.length ?? 0) > 0
+                ? ` AND view_id:(${user.favourite_views.join(' OR ')})`
+                : '';
             await request(api.search.view.post, {
                 query: `(${phraseQuery}) AND ${typeQuery}${favouritesQuery}`,
                 rows: pageCount,
@@ -167,7 +170,7 @@ const ViewsBase = () => {
         }
     }, [searchParams, setSearchParams]);
     useEffect(() => {
-        if (response?.total <= offset) {
+        if ((response?.total ?? 0) <= offset) {
             setOffset(0);
             searchParams.set('offset', '0');
             setSearchParams(searchParams, { replace: true });
@@ -179,12 +182,15 @@ const ViewsBase = () => {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [offset, favouritesOnly, type]);
-    return (_jsx(ItemManager, { onSearch: onSearch, onPageChange: onPageChange, phrase: phrase, setPhrase: setPhrase, hasError: hasError, searching: searching, searchFilters: _jsx(Stack, { direction: "row", spacing: 1, alignItems: "center", children: _jsxs(ToggleButtonGroup, { sx: { display: 'grid', gridTemplateColumns: '1fr 1fr' }, size: "small", value: type, exclusive: true, onChange: (__, _type) => onTypeChange(_type), children: [_jsx(ToggleButton, { value: "personal", "aria-label": "personal", children: t('route.views.manager.personal') }), _jsx(ToggleButton, { value: "global", "aria-label": "global", children: t('route.views.manager.global') })] }) }), aboveSearch: _jsx(Typography, { sx: theme => ({ fontStyle: 'italic', color: theme.palette.text.disabled, mb: 0.5 }), variant: "body2", children: t('route.views.search.prompt') }), afterSearch: size(views) > 0 ? (_jsx(Autocomplete, { open: defaultViewOpen, loading: defaultViewLoading, onOpen: onDefaultViewOpen, onClose: () => setDefaultViewOpen(false), options: Object.values(omitBy(views, isNull)), renderOption: ({ key, ...props }, o) => (_createElement("li", { ...props, key: key },
+    return (_jsx(ItemManager, { onSearch: onSearch, onPageChange: onPageChange, phrase: phrase, setPhrase: setPhrase, hasError: hasError, searching: searching, searchFilters: _jsx(Stack, { direction: "row", spacing: 1, alignItems: "center", children: _jsxs(ToggleButtonGroup, { sx: { display: 'grid', gridTemplateColumns: '1fr 1fr' }, size: "small", value: type, exclusive: true, onChange: (__, _type) => onTypeChange(_type), children: [_jsx(ToggleButton, { value: "personal", "aria-label": "personal", children: t('route.views.manager.personal') }), _jsx(ToggleButton, { value: "global", "aria-label": "global", children: t('route.views.manager.global') })] }) }), aboveSearch: _jsx(Typography, { sx: theme => ({ fontStyle: 'italic', color: theme.palette.text.disabled, mb: 0.5 }), variant: "body2", children: t('route.views.search.prompt') }), afterSearch: size(views) > 0 ? (_jsx(Autocomplete, { open: defaultViewOpen, loading: defaultViewLoading, onOpen: onDefaultViewOpen, onClose: () => setDefaultViewOpen(false), options: Object.values(omitBy(views, isNil)), renderOption: ({ key, ...props }, o) => (_createElement("li", { ...props, key: key },
                 _jsxs(Stack, { children: [_jsx(Typography, { variant: "body1", children: t(o.title) }), _jsx(Typography, { variant: "caption", children: _jsx("code", { children: o.query }) })] }))), renderInput: params => (_jsx(TextField, { ...params, label: t('route.views.manager.default'), sx: { minWidth: '300px' } })), filterOptions: (_views, { inputValue }) => _views.filter(v => t(v.title).toLowerCase().includes(inputValue.toLowerCase()) ||
-                v.query.toLowerCase().includes(inputValue.toLowerCase())), getOptionLabel: (v) => t(v.title), isOptionEqualToValue: (view, value) => view.view_id === value.view_id, value: views[defaultView] ?? null, onChange: (_, option) => setDefaultView(option?.view_id) })) : (_jsx(Skeleton, { variant: "rounded", width: "300px", height: "initial" })), belowSearch: _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(Checkbox, { size: "small", disabled: user.favourite_views?.length < 1, checked: favouritesOnly, onChange: (_, checked) => setFavouritesOnly(checked) }), _jsx(Typography, { variant: "body1", sx: theme => ({ color: theme.palette.text.disabled }), children: t('route.views.manager.favourites') })] }), renderer: ({ item }, classRenderer) => (_jsx(Card, { variant: "outlined", sx: { p: 1, mb: 1, transitionProperty: 'border-color', '&:hover': { borderColor: 'primary.main' } }, className: classRenderer(), children: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, sx: { color: 'inherit', textDecoration: 'none' }, component: Link, to: buildViewUrl(item.item), children: [_jsx(ViewTitle, { ...item.item }), _jsx(FlexOne, {}), ((item.item.owner === user.username && item.item.type !== 'readonly') ||
-                        (item.item.type === 'global' && user.is_admin)) && (_jsx(Tooltip, { title: t('button.edit'), children: _jsx(IconButton, { component: Link, to: `/views/${item.item.view_id}/edit?query=${item.item.query}`, children: _jsx(Edit, {}) }) })), item.item.owner === user.username && item.item.type !== 'readonly' && (_jsx(Tooltip, { title: t('button.delete'), children: _jsx(IconButton, { onClick: event => onDelete(event, item.item.view_id), children: _jsx(Clear, {}) }) })), item.item.type === 'global' && item.item.owner !== user.username && (_jsx(Tooltip, { title: item.item.owner, children: _jsx("div", { children: _jsx(HowlerAvatar, { sx: { width: 24, height: 24, marginRight: '8px !important', marginLeft: '8px !important' }, userId: item.item.owner }) }) })), _jsx(Tooltip, { title: t('button.pin'), children: _jsx(IconButton, { onClick: e => onFavourite(e, item.item.view_id), children: user.favourite_views?.includes(item.item.view_id) ? _jsx(Star, {}) : _jsx(StarBorder, {}) }) })] }) }, item.item.view_id)), response: response, searchPrompt: "route.views.manager.search", onCreate: () => navigate('/views/create'), createPrompt: "route.views.create", createIcon: _jsx(SavedSearch, { sx: { mr: 1 } }) }));
+                v.query.toLowerCase().includes(inputValue.toLowerCase())), getOptionLabel: (v) => t(v.title), isOptionEqualToValue: (view, value) => view.view_id === value.view_id, value: views[defaultView] ?? null, onChange: (_, option) => setDefaultView(option?.view_id) })) : (_jsx(Skeleton, { variant: "rounded", width: "300px", height: "initial" })), belowSearch: _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(Checkbox, { size: "small", disabled: (user.favourite_views?.length ?? 0) < 1, checked: favouritesOnly, onChange: (_, checked) => setFavouritesOnly(checked) }), _jsx(Typography, { variant: "body1", sx: theme => ({ color: theme.palette.text.disabled }), children: t('route.views.manager.favourites') })] }), renderer: ({ item }, classRenderer) => (_jsx(Card, { variant: "outlined", sx: { p: 1, mb: 1, transitionProperty: 'border-color', '&:hover': { borderColor: 'primary.main' } }, className: classRenderer(), children: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, sx: { color: 'inherit', textDecoration: 'none' }, component: Link, to: buildViewUrl(item.item), children: [_jsx(ViewTitle, { ...item.item }), _jsx(FlexOne, {}), _jsx(Members, { item: item.item }), item.item.type !== 'readonly' &&
+                        (item.item.owner === user.username ||
+                            item.item.admins?.includes(user.username) ||
+                            item.item.members?.includes(user.username) ||
+                            (item.item.type === 'global' && user.is_admin)) && (_jsx(Tooltip, { title: t('button.edit'), children: _jsx(IconButton, { component: Link, to: `/views/${item.item.view_id}/edit?query=${item.item.query}`, children: _jsx(Edit, {}) }) })), item.item.owner === user.username && item.item.type !== 'readonly' && (_jsx(Tooltip, { title: t('button.delete'), children: _jsx(IconButton, { onClick: event => onDelete(event, item.item.view_id), children: _jsx(Clear, {}) }) })), _jsx(Tooltip, { title: t('button.pin'), children: _jsx(IconButton, { onClick: e => onFavourite(e, item.item.view_id), children: user.favourite_views?.includes(item.item.view_id) ? _jsx(Star, {}) : _jsx(StarBorder, {}) }) })] }) }, item.item.view_id)), response: response, searchPrompt: "route.views.manager.search", onCreate: () => navigate('/views/create'), createPrompt: "route.views.create", createIcon: _jsx(SavedSearch, { sx: { mr: 1 } }) }));
 };
 const Views = () => {
-    return (_jsx(TuiListProvider, { children: _jsx(SearchResponseProvider, { idField: "view_id", children: _jsx(ViewsBase, {}) }) }));
+    return (_jsx(TuiListProvider, { children: _jsx(SearchResponseProvider, { context: SearchResponseContext, idField: "view_id", children: _jsx(ViewsBase, {}) }) }));
 };
 export default Views;

package/i18n.js

@@ -1,3 +1,5 @@
+import { addTranslations as addA11yTranslations } from '@tui/a11y';
+import { addTranslations as addCoreTranslations } from '@tui/core';
 import { createInstance } from 'i18next';
 import LanguageDetector from 'i18next-browser-languagedetector';
 import helpMainEN from '@cccsaurora/howler-ui/locales/en/help/main.json';
@@ -40,4 +42,6 @@ void i18nInstance
     },
     resources
 });
+addCoreTranslations(i18nInstance);
+addA11yTranslations(i18nInstance);
 export default i18nInstance;

package/locales/en/translation.json

@@ -20,6 +20,7 @@
     "api.user.apikey.removed": "API key removed successfully.",
     "api.user.apikey.updated": "New API key added successfully.",
     "api.user.email.updated": "User's email updated successfully.",
+    "api.user.groups.empty": "No user groups to show.",
     "api.user.name.updated": "User's name updated successfully.",
     "api.user.quota.updated": "API quota updated successfully.",
     "api.user.role.updated": "User's roles updated successfully.",
@@ -318,6 +319,14 @@
     "markdown.error": "An Error Has Occurred.",
     "markdown.json.invalid": "Invalid JSON Provided. Consider using the {{json <data>}} utility to convert objects into JSON strings.",
     "markdown.props.missing": "You are missing keyword arguments for this helper:",
+    "membership.manage": "Manage Membership",
+    "membership.message.error": "There was an error when updating permissions.",
+    "membership.message.success": "Permissions updated.",
+    "membership.message.warning": "No users selected.",
+    "membership.privilege.admins": "Administrator",
+    "membership.privilege.manage": "Manage Privileges",
+    "membership.privilege.members": "Member",
+    "membership.privilege.owner": "Owner",
     "modal.action.description": "Provide a name that allows other users to identify the purpose of this action.",
     "modal.action.empty": "Action Name cannot be empty.",
     "modal.action.label": "Action Name",
@@ -871,6 +880,7 @@
     "rule.interval.thirty.minutes": "Every thirty minutes",
     "rule.interval.three.hours": "Every three hours",
     "save": "Save",
+    "search": "Search",
     "search.fuzzy.no_results": "No results found.",
     "search.fuzzy.placeholder": "Search by IP, domain, hash, email, or keyword...",
     "search.fuzzy.results.cases": "Cases",

package/locales/fr/translation.json

@@ -20,6 +20,7 @@
     "api.user.apikey.removed": "Clé API supprimée avec succès",
     "api.user.apikey.updated": "Nouvelle clé API ajoutée avec succès.",
     "api.user.email.updated": "L'email de l'utilisateur a été actualisé avec succès.",
+    "api.user.groups.empty": "L'utilisateur n'a aucun groupe à afficher.",
     "api.user.name.updated": "Le nom de l'utilisateur a été actualisé avec succès.",
     "api.user.quota.updated": "Le quota de l'API a été actualisé avec succès.",
     "api.user.role.updated": "Les rôles de l'utilisateur ont été actualisé avec succès.",
@@ -318,6 +319,14 @@
     "markdown.error": "Une erreur s'est produite.",
     "markdown.json.invalid": "JSON non valide fourni. Pensez à utiliser l'utilitaire {{json <data>}} pour convertir les objets en chaînes JSON.",
     "markdown.props.missing": "Il manque des arguments de mots-clés pour cette aide:",
+    "membership.manage": "Gestion des membres",
+    "membership.message.error": "Il y a eu une erreur durant la mise a jours des permissions",
+    "membership.message.success": "Permissions misse à jours.",
+    "membership.message.warning": "Aucun utilisateur sélectionné",
+    "membership.privilege.admins": "Administrateur",
+    "membership.privilege.manage": "Gérer privilèges",
+    "membership.privilege.members": "Membre",
+    "membership.privilege.owner": "Propriétaire",
     "modal.action.description": "Donnez un nom qui permette aux autres utilisateurs d'identifier l'objectif de cette action.",
     "modal.action.empty": "Le nom de l'action ne peut pas être vide.",
     "modal.action.label": "Nom de l'action",
@@ -871,6 +880,7 @@
     "rule.interval.thirty.minutes": "Toutes les trente minutes",
     "rule.interval.three.hours": "Toutes les trois heures",
     "save": "Sauvegarder",
+    "search": "Rechercher",
     "search.fuzzy.no_results": "Aucun résultat trouvé.",
     "search.fuzzy.placeholder": "Rechercher par IP, domaine, hash, courriel ou mot-clé...",
     "search.fuzzy.results.cases": "Cas",

package/models/entities/HowlerUser.d.ts

@@ -1,4 +1,4 @@
-import type { AppUser } from 'commons/components/app/AppUserService';
+import type { AppUser } from '@tui/core';
 
 export interface HowlerUser extends AppUser {
   name: string;

package/models/entities/generated/Action.d.ts

@@ -7,7 +7,9 @@ export interface Action {
   action_id?: string;
   name?: string;
   operations?: Operation[];
-  owner_id?: string;
+  owner?: string;
   query?: string;
   triggers?: string[];
+  admins?: string[];
+  members?: string[];
 }

package/models/entities/generated/ApiType.d.ts

@@ -49,6 +49,7 @@ export interface APILookups {
     'compromise',
     'mitigated'
   ];
+  'case.escalation': ["normal", "focus", "crisis"];
   transitions: { [index: string]: string[] };
   techniques: { [index: string]: { key: string; name: string; url: string } };
   tactics: { [index: string]: { key: string; name: string; url: string } };
@@ -56,7 +57,7 @@ export interface APILookups {
   roles: ['admin', 'actionrunner_advanced', 'actionrunner_basic', 'automation_advanced', 'automation_basic', 'user'];
 }
 
-export interface APIConfiguration {
+export interface APIConfiguration extends APIMappings {
   auth: {
     allow_apikeys: boolean;
     allow_extended_apikeys: boolean;
@@ -81,7 +82,6 @@ export interface APIConfiguration {
   ui: {
     apps: { alt: string; name: string; img_d: string; img_l: string; route: string; classification: string }[];
   };
-  mapping: APIMappings;
   features: {
     clue: boolean;
     notebook: boolean;
@@ -237,5 +237,4 @@ export interface ApiType {
   lookups: APILookups;
   configuration: APIConfiguration;
   c12nDef: ClassificationDefinition;
-  mapping: APIMappings;
 }

package/models/entities/generated/Dossier.d.ts

@@ -12,4 +12,6 @@ export interface Dossier {
   query?: string;
   title?: string;
   type?: string;
+  admins?: string[];
+  members?: string[];
 }

package/models/entities/generated/HowlerDossier.d.ts

@@ -9,4 +9,6 @@ export interface HowlerDossier {
   icon?: string;
   label?: Label;
   metadata?: string;
+  admins?: string[];
+  members?: string[];
 }

package/models/entities/generated/Item.d.ts

@@ -4,8 +4,8 @@
 export interface Item {
   id?: string;
   classification?: string;
-  parent?: string | null;
-  name?: string | null;
+  parent?: string;
+  name?: string;
   type?: string;
   value?: string;
   visible?: boolean;

package/models/entities/generated/Settings.d.ts

@@ -6,5 +6,5 @@ import type { Column } from './Column';
 export interface Settings {
   advance_on_triage?: boolean;
   columns?: Column[];
-  display?: string;
+  display?: 'list' | 'grid';
 }

package/models/entities/generated/View.d.ts

@@ -13,4 +13,6 @@ export interface View {
   type?: string;
   view_id?: string;
   indexes?: string[];
+  admins?: string[];
+  members?: string[];
 }