@cccsaurora/howler-ui 2.14.0-dev.250 → 2.14.0-dev.255

package/components/routes/hits/view/HitViewer.js

@@ -1,162 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Icon } from '@iconify/react/dist/iconify.js';
-import { Code, Comment, DataObject, History, LinkSharp, QueryStats, ViewAgenda } from '@mui/icons-material';
-import { Badge, Box, CardContent, Collapse, IconButton, Skeleton, Stack, Tab, Tabs, Tooltip, useMediaQuery, useTheme } from '@mui/material';
-import PageCenter from '@cccsaurora/howler-ui/commons/components/pages/PageCenter';
-import useMatchers from '@cccsaurora/howler-ui/components/app/hooks/useMatchers';
-import { HitContext } from '@cccsaurora/howler-ui/components/app/providers/HitProvider';
-import FlexOne from '@cccsaurora/howler-ui/components/elements/addons/layout/FlexOne';
-import HowlerCard from '@cccsaurora/howler-ui/components/elements/display/HowlerCard';
-import BundleButton from '@cccsaurora/howler-ui/components/elements/display/icons/BundleButton';
-import SocketBadge from '@cccsaurora/howler-ui/components/elements/display/icons/SocketBadge';
-import JSONViewer from '@cccsaurora/howler-ui/components/elements/display/json/JSONViewer';
-import HitActions from '@cccsaurora/howler-ui/components/elements/hit/HitActions';
-import HitBanner from '@cccsaurora/howler-ui/components/elements/hit/HitBanner';
-import HitComments from '@cccsaurora/howler-ui/components/elements/hit/HitComments';
-import HitDetails from '@cccsaurora/howler-ui/components/elements/hit/HitDetails';
-import HitLabels from '@cccsaurora/howler-ui/components/elements/hit/HitLabels';
-import { HitLayout } from '@cccsaurora/howler-ui/components/elements/hit/HitLayout';
-import HitNotebooks from '@cccsaurora/howler-ui/components/elements/hit/HitNotebooks';
-import HitOutline from '@cccsaurora/howler-ui/components/elements/hit/HitOutline';
-import HitOverview from '@cccsaurora/howler-ui/components/elements/hit/HitOverview';
-import HitRelated from '@cccsaurora/howler-ui/components/elements/hit/HitRelated';
-import HitWorklog from '@cccsaurora/howler-ui/components/elements/hit/HitWorklog';
-import PivotLink from '@cccsaurora/howler-ui/components/elements/hit/related/PivotLink';
-import RelatedLink from '@cccsaurora/howler-ui/components/elements/hit/related/RelatedLink';
-import { useMyLocalStorageItem } from '@cccsaurora/howler-ui/components/hooks/useMyLocalStorage';
-import useMyUserList from '@cccsaurora/howler-ui/components/hooks/useMyUserList';
-import uniqBy from 'lodash-es/uniqBy';
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useNavigate, useParams } from 'react-router-dom';
-import { useContextSelector } from 'use-context-selector';
-import { StorageKey } from '@cccsaurora/howler-ui/utils/constants';
-import { getUserList } from '@cccsaurora/howler-ui/utils/hitFunctions';
-import { tryParse } from '@cccsaurora/howler-ui/utils/utils';
-import LeadRenderer from './LeadRenderer';
-export var Orientation;
-(function (Orientation) {
-    Orientation["VERTICAL"] = "vertical";
-    Orientation["HORIZONTAL"] = "horizontal";
-})(Orientation || (Orientation = {}));
-const HitViewer = () => {
-    const { t, i18n } = useTranslation();
-    const params = useParams();
-    const navigate = useNavigate();
-    const theme = useTheme();
-    const isUnderLg = useMediaQuery(theme.breakpoints.down('lg'));
-    const [orientation, setOrientation] = useMyLocalStorageItem(StorageKey.VIEWER_ORIENTATION, Orientation.VERTICAL);
-    const { getMatchingOverview, getMatchingDossiers, getMatchingAnalytic } = useMatchers();
-    const getHit = useContextSelector(HitContext, ctx => ctx.getHit);
-    const hit = useContextSelector(HitContext, ctx => ctx.hits[params.id]);
-    const [userIds, setUserIds] = useState(new Set());
-    const users = useMyUserList(userIds);
-    const [tab, setTab] = useState('details');
-    const [analytic, setAnalytic] = useState();
-    const [dossiers, setDossiers] = useState([]);
-    const [hasOverview, setHasOverview] = useState(false);
-    const fetchData = useCallback(async () => {
-        try {
-            if (!hit) {
-                await getHit(params.id, true);
-                return;
-            }
-            setUserIds(getUserList(hit));
-            setAnalytic(await getMatchingAnalytic(hit));
-        }
-        catch (err) {
-            if (err.cause?.api_status_code === 404) {
-                navigate('/404');
-            }
-        }
-    }, [hit, getMatchingAnalytic, getHit, params.id, navigate]);
-    useEffect(() => {
-        if (isUnderLg) {
-            setOrientation(Orientation.HORIZONTAL);
-        }
-    }, [isUnderLg, setOrientation]);
-    useEffect(() => {
-        fetchData();
-    }, [params.id, fetchData, hit]);
-    const onOrientationChange = useCallback(() => setOrientation(orientation === Orientation.VERTICAL ? Orientation.HORIZONTAL : Orientation.VERTICAL), [orientation, setOrientation]);
-    useEffect(() => {
-        getMatchingOverview(hit).then(_overview => setHasOverview(!!_overview));
-    }, [getMatchingOverview, hit]);
-    useEffect(() => {
-        if (hasOverview && tab === 'details') {
-            setTab('overview');
-        }
-        else if (!hasOverview && tab === 'overview') {
-            setTab('details');
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [hasOverview]);
-    const tabContent = useMemo(() => {
-        if (!tab || !hit) {
-            return;
-        }
-        return {
-            overview: () => _jsx(HitOverview, { hit: hit }),
-            details: () => _jsx(HitDetails, { hit: hit }),
-            hit_comments: () => _jsx(HitComments, { hit: hit, users: users }),
-            hit_raw: () => _jsx(JSONViewer, { data: hit }),
-            hit_data: () => _jsx(JSONViewer, { data: hit?.howler?.data?.map(entry => tryParse(entry)), collapse: false }),
-            hit_worklog: () => _jsx(HitWorklog, { hit: hit, users: users }),
-            hit_related: () => _jsx(HitRelated, { hit: hit }),
-            ...Object.fromEntries(hit?.howler.dossier?.map((lead, index) => ['lead:' + index, () => _jsx(LeadRenderer, { lead: lead, hit: hit })]) ?? []),
-            ...Object.fromEntries(dossiers.flatMap((_dossier, dossierIndex) => (_dossier.leads ?? []).map((_lead, leadIndex) => [
-                `external-lead:${dossierIndex}:${leadIndex}`,
-                () => _jsx(LeadRenderer, { lead: _lead, hit: hit })
-            ])))
-        }[tab]?.();
-    }, [dossiers, hit, tab, users]);
-    useEffect(() => {
-        if (!hit) {
-            return;
-        }
-        getMatchingDossiers(hit).then(setDossiers);
-    }, [getMatchingDossiers, hit]);
-    if (!hit) {
-        return (_jsx(PageCenter, { children: _jsx(Skeleton, { variant: "rounded", height: "520px" }) }));
-    }
-    return (_jsx(PageCenter, { maxWidth: "1500px", children: _jsxs(Box, { sx: {
-                display: 'grid',
-                position: 'relative',
-                gridTemplateColumns: `1fr ${orientation === 'vertical' ? '300px' : '0px'}`,
-                alignItems: 'stretch',
-                gap: theme.spacing(2),
-                transition: `${theme.transitions.duration.standard}ms`,
-                mb: 1
-            }, textAlign: "left", children: [_jsx(Collapse, { sx: { gridColumn: '1 / span 2', '& [class*=MuiStack-root]': { padding: '0 !important' } }, in: orientation === 'horizontal', children: _jsx(HitActions, { hit: hit, orientation: "horizontal" }) }), _jsxs(Box, { sx: {
-                        display: 'flex',
-                        '& > .MuiPaper-root': { flex: 1 },
-                        mr: orientation === 'vertical' ? 0 : -2
-                    }, children: [_jsx(HowlerCard, { tabIndex: 0, sx: { position: 'relative' }, children: _jsxs(CardContent, { children: [_jsx(HitBanner, { hit: hit, layout: HitLayout.COMFY, useListener: true }), _jsx(HitOutline, { hit: hit, layout: HitLayout.COMFY }), _jsx(HitLabels, { hit: hit }), (hit?.howler?.links?.length > 0 ||
-                                        analytic?.notebooks?.length > 0 ||
-                                        dossiers.filter(_dossier => _dossier.pivots?.length > 0).length > 0) && (_jsxs(Stack, { direction: "row", spacing: 1, pr: 2, children: [analytic?.notebooks?.length > 0 && _jsx(HitNotebooks, { analytic: analytic, hit: hit }), hit?.howler?.links?.length > 0 &&
-                                                uniqBy(hit.howler.links, 'href')
-                                                    .slice(0, 3)
-                                                    .map(l => _jsx(RelatedLink, { compact: true, ...l }, l.href)), dossiers.flatMap(_dossier => (_dossier.pivots ?? []).map((_pivot, index) => (
-                                            // eslint-disable-next-line react/no-array-index-key
-                                            _jsx(PivotLink, { pivot: _pivot, hit: hit, compact: true }, _dossier.dossier_id + index))))] }))] }) }), !isUnderLg && (_jsxs(Stack, { spacing: 1, sx: {
-                                position: 'absolute',
-                                top: theme.spacing(2),
-                                right: theme.spacing(-6)
-                            }, children: [_jsx(Tooltip, { title: t('page.hits.view.layout'), children: _jsx(IconButton, { onClick: onOrientationChange, children: _jsx(ViewAgenda, { sx: { transition: 'rotate 250ms', rotate: orientation === 'vertical' ? '90deg' : '0deg' } }) }) }), _jsx(SocketBadge, { size: "medium" }), analytic && (_jsx(Tooltip, { title: t('hit.panel.analytic.open'), children: _jsx(IconButton, { onClick: () => navigate(`/analytics/${analytic.analytic_id}`), children: _jsx(QueryStats, {}) }) })), hit?.howler.bundles?.length > 0 && _jsx(BundleButton, { ids: hit.howler.bundles })] }))] }), _jsx(HowlerCard, { sx: [orientation === 'horizontal' && { height: '0px' }], children: _jsx(CardContent, { sx: { padding: 1, position: 'relative' }, children: _jsx(HitActions, { hit: hit, orientation: "vertical" }) }) }), _jsx(Box, { sx: { gridColumn: '1 / span 2', mb: 1 }, children: _jsxs(Tabs, { value: tab === 'overview' && !hasOverview ? 'details' : tab, sx: { display: 'flex', flexDirection: 'row', pr: 2, alignItems: 'center' }, children: [hit?.howler?.is_bundle && (_jsx(Tab, { label: t('hit.viewer.aggregate'), value: "hit_aggregate", onClick: () => setTab('hit_aggregate') })), hasOverview && (_jsx(Tab, { label: t('hit.viewer.overview'), value: "overview", onClick: () => setTab('overview') })), _jsx(Tab, { label: t('hit.viewer.details'), value: "details", onClick: () => setTab('details') }), hit?.howler.dossier?.map((lead, index) => (_jsx(Tab
-                            // eslint-disable-next-line react/no-array-index-key
-                            , { label: _jsxs(Stack, { direction: "row", spacing: 0.5, children: [lead.icon && _jsx(Icon, { icon: lead.icon }), _jsx("span", { children: i18n.language === 'en' ? lead.label.en : lead.label.fr })] }), value: 'lead:' + index, onClick: () => setTab('lead:' + index) }, 'lead:' + index))), dossiers.flatMap((_dossier, dossierIndex) => (_dossier.leads ?? []).map((_lead, leadIndex) => (_jsx(Tab
-                            // eslint-disable-next-line react/no-array-index-key
-                            , { label: _jsxs(Stack, { direction: "row", spacing: 0.5, children: [_lead.icon && _jsx(Icon, { icon: _lead.icon }), _jsx("span", { children: i18n.language === 'en' ? _lead.label.en : _lead.label.fr })] }), value: `external-lead:${dossierIndex}:${leadIndex}`, onClick: () => setTab(`external-lead:${dossierIndex}:${leadIndex}`) }, `external-lead:${dossierIndex}:${leadIndex}`)))), _jsx(FlexOne, {}), _jsx(Tab, { sx: { px: 2, minWidth: 0 }, label: _jsx(Tooltip, { title: t('hit.viewer.data'), children: _jsx(DataObject, {}) }), value: "hit_data", onClick: () => setTab('hit_data'), disabled: !hit?.howler?.data }), _jsx(Tab, { sx: { px: 2, minWidth: 0 }, label: _jsx(Tooltip, { title: t('hit.viewer.json'), children: _jsx(Code, {}) }), value: "hit_raw", onClick: () => setTab('hit_raw') }), _jsx(Tab, { sx: { px: 2, minWidth: 0 }, label: _jsx(Tooltip, { title: t('hit.viewer.comments'), children: _jsx(Badge, { sx: {
-                                            '& > .MuiBadge-badge': {
-                                                backgroundColor: theme.palette.divider,
-                                                zIndex: 1,
-                                                right: theme.spacing(-0.5)
-                                            },
-                                            '& > svg': { zIndex: 2 }
-                                        }, badgeContent: hit?.howler.comment?.length ?? 0, children: _jsx(Comment, {}) }) }), value: "hit_comments", onClick: () => setTab('hit_comments') }), _jsx(Tab, { sx: { px: 2, minWidth: 0 }, label: _jsx(Tooltip, { title: t('hit.viewer.worklog'), children: _jsx(History, {}) }), value: "hit_worklog", onClick: () => setTab('hit_worklog') }), _jsx(Tab, { sx: { px: 2, minWidth: 0 }, label: _jsx(Tooltip, { title: t('hit.viewer.related'), children: _jsx(LinkSharp, {}) }), value: "hit_related", onClick: () => setTab('hit_related') })] }) }), _jsx(Box, { sx: {
-                        gridColumn: '1 / span 2',
-                        '& > div': { padding: 0 },
-                        '& .react-json-view': { backgroundColor: 'transparent !important' }
-                    }, children: tabContent })] }) }));
-};
-export default HitViewer;

package/components/routes/hits/view/LeadRenderer.d.ts

@@ -1,7 +0,0 @@
-import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
-import type { Lead } from '@cccsaurora/howler-ui/models/entities/generated/Lead';
-declare const _default: import("react").NamedExoticComponent<{
-    lead: Lead;
-    hit?: Hit;
-}>;
-export default _default;

package/components/routes/hits/view/LeadRenderer.js

@@ -1,21 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Divider, Stack, Typography } from '@mui/material';
-import HandlebarsMarkdown from '@cccsaurora/howler-ui/components/elements/display/HandlebarsMarkdown';
-import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { usePluginStore } from 'react-pluggable';
-const LeadRenderer = ({ lead, hit }) => {
-    const { t } = useTranslation();
-    const pluginStore = usePluginStore();
-    if (lead.format === 'markdown') {
-        return (_jsx(Box, { sx: {
-                mt: -2
-            }, children: _jsx(HandlebarsMarkdown, { disableLinks: true, md: lead.content, object: hit ?? lead }) }));
-    }
-    const pluginLead = pluginStore.executeFunction(`lead.${lead.format}`, lead.content, lead.metadata, hit);
-    if (pluginLead) {
-        return pluginLead;
-    }
-    return (_jsxs(Stack, { p: 3, direction: "column", spacing: 2, alignItems: "center", children: [_jsx(Typography, { variant: "h3", color: "error.light", children: t('lead.invalid') }), _jsx(Divider, { flexItem: true }), _jsx(Typography, { variant: "body1", children: t('lead.invalid.description') })] }));
-};
-export default memo(LeadRenderer);

package/components/routes/home/AddNewCard.d.ts

@@ -1,7 +0,0 @@
-import type { HowlerUser } from '@cccsaurora/howler-ui/models/entities/HowlerUser';
-import type { FC } from 'react';
-declare const AddNewCard: FC<{
-    dashboard: HowlerUser['dashboard'];
-    addCard: (newCard: any) => void;
-}>;
-export default AddNewCard;

package/components/routes/home/AddNewCard.js

@@ -1,103 +0,0 @@
-import { createElement as _createElement } from "react";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Check } from '@mui/icons-material';
-import { Autocomplete, Box, Card, CardContent, CardHeader, Divider, FormControl, Grid, InputLabel, MenuItem, Select, Slider, Stack, TextField, Typography } from '@mui/material';
-import api from '@cccsaurora/howler-ui/api';
-import { ViewContext } from '@cccsaurora/howler-ui/components/app/providers/ViewProvider';
-import CustomButton from '@cccsaurora/howler-ui/components/elements/addons/buttons/CustomButton';
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useContextSelector } from 'use-context-selector';
-const TYPES = {
-    view: ['viewId', 'limit'],
-    analytic: ['analyticId', 'type']
-};
-const VISUALIZATIONS = ['assessment', 'created', 'escalation', 'status', 'detection'];
-const AddNewCard = ({ dashboard, addCard }) => {
-    const { t } = useTranslation();
-    const views = useContextSelector(ViewContext, ctx => ctx.views ?? {});
-    const fetchViews = useContextSelector(ViewContext, ctx => ctx.fetchViews);
-    const [selectedType, setSelectedType] = useState('');
-    const [analytics, setAnalytics] = useState([]);
-    const [analyticsLoading, setAnalyticsLoading] = useState(false);
-    const [config, _setConfig] = useState({});
-    const [viewOpen, setViewOpen] = useState(false);
-    const [viewLoading, setViewLoading] = useState(false);
-    const setConfig = useCallback((key, value) => _setConfig(_config => ({ ..._config, [key]: value })), []);
-    const _addCard = useCallback(() => {
-        if (!selectedType) {
-            return;
-        }
-        addCard({
-            entry_id: selectedType === 'view' ? config.viewId : `${config.analyticId}-${config.type}`,
-            type: selectedType,
-            config: JSON.stringify(config)
-        });
-        // Zero the config so we don't prep the user to add the same card
-        // We can leave the analyticId, because it is allowed to be duplicated across viz types
-        ['type', 'viewId'].forEach(key => {
-            if (key in config) {
-                setConfig(key, '');
-            }
-        });
-    }, [selectedType, addCard, config, setConfig]);
-    const fetchAllAnalytics = async () => {
-        setAnalyticsLoading(true);
-        const batchSize = 150;
-        let offset = 0;
-        let allAnalytics = [];
-        let total = 0;
-        do {
-            const response = await api.search.analytic.post({
-                query: '*:*',
-                rows: batchSize,
-                offset
-            });
-            allAnalytics = [...allAnalytics, ...(response.items ?? [])];
-            total = response.total ?? 0;
-            offset += batchSize;
-        } while (offset < total);
-        setAnalytics(allAnalytics);
-        setAnalyticsLoading(false);
-    };
-    useEffect(() => {
-        fetchAllAnalytics();
-    }, []);
-    const filteredAnalyticVisualizations = useMemo(() => {
-        const existingAnalyticCards = dashboard.filter(_card => _card.type === "analytic");
-        return VISUALIZATIONS.filter(viz => {
-            return !existingAnalyticCards.some(_card => {
-                const parsedConfig = JSON.parse(_card.config);
-                return parsedConfig.analyticId === config.analyticId && parsedConfig.type === viz;
-            });
-        });
-    }, [dashboard, config.analyticId]);
-    useEffect(() => {
-        if (selectedType === 'view') {
-            _setConfig({
-                limit: 3
-            });
-        }
-        else {
-            _setConfig({});
-        }
-    }, [selectedType]);
-    const onViewOpen = useCallback(async () => {
-        setViewOpen(true);
-        setViewLoading(true);
-        try {
-            await fetchViews();
-        }
-        finally {
-            setViewLoading(false);
-        }
-    }, [fetchViews]);
-    return (_jsx(Grid, { item: true, xs: 12, md: 6, children: _jsxs(Card, { variant: "outlined", sx: { height: '100%' }, children: [_jsx(CardHeader, { title: t('route.home.add'), subheader: _jsx(Typography, { variant: "body2", color: "text.secondary", children: t('route.home.add.description') }) }), _jsx(CardContent, { children: _jsxs(Stack, { spacing: 1, children: [_jsxs(FormControl, { sx: theme => ({ mt: `${theme.spacing(2)} !important` }), children: [_jsx(InputLabel, { children: t('route.home.add.type') }), _jsx(Select, { value: selectedType, onChange: event => setSelectedType(event.target.value), label: t('route.home.add.type'), children: Object.keys(TYPES).map(type => (_jsx(MenuItem, { value: type, children: _jsxs(Stack, { children: [_jsx(Typography, { variant: "body1", children: t(`route.home.add.type.${type}`) }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: t(`route.home.add.type.${type}.description`) })] }) }, type))) })] }), selectedType && _jsx(Divider, { flexItem: true }), selectedType === 'analytic' && (_jsxs(_Fragment, { children: [_jsx(Typography, { variant: "body1", children: t('route.home.add.analytic.title') }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('route.home.add.analytic.description') }), _jsx(Autocomplete, { sx: { pt: 1 }, onChange: (__, opt) => setConfig('analyticId', opt.analytic_id), loading: analyticsLoading, options: analytics, filterOptions: (options, state) => options.filter(opt => opt.name.toLowerCase().includes(state.inputValue.toLowerCase()) ||
-                                            opt.description?.split('\n')[0]?.toLowerCase().includes(state.inputValue.toLowerCase())), renderOption: (props, option) => (_createElement("li", { ...props, key: option.analytic_id },
-                                            _jsxs(Stack, { children: [_jsx(Typography, { variant: "body1", children: option.name }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: option.description?.split('\n')[0] })] }))), getOptionLabel: option => option.name, renderInput: params => _jsx(TextField, { ...params, label: t('route.home.add.analytic') }) }), _jsxs(FormControl, { sx: theme => ({ mt: `${theme.spacing(2)} !important` }), children: [_jsx(InputLabel, { children: t('route.home.add.visualization') }), _jsx(Select, { value: config.type ?? '', onChange: event => setConfig('type', event.target.value), label: t('route.home.add.visualization'), children: filteredAnalyticVisualizations.length > 0 ? (filteredAnalyticVisualizations.map(viz => (_jsx(MenuItem, { value: viz, children: _jsxs(Stack, { children: [_jsx(Typography, { variant: "body1", children: t(`route.home.add.visualization.${viz}`) }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: t(`route.home.add.visualization.${viz}.description`) })] }) }, viz)))) : (_jsx(MenuItem, { disabled: true, children: _jsx(Typography, { variant: "body1", color: "text.secondary", children: t('route.home.add.visualization.unavailable') }) })) })] })] })), selectedType === 'view' && (_jsxs(_Fragment, { children: [_jsx(Autocomplete, { sx: { pt: 1 }, value: views[config.viewId] || null, onChange: (__, opt) => setConfig('viewId', opt.view_id), onOpen: onViewOpen, onClose: () => setViewOpen(false), open: viewOpen, loading: viewLoading, options: Object.values(views), filterOptions: (options, state) => options.filter(opt => !!opt &&
-                                            !dashboard?.find(entry => entry.type === 'view' && JSON.parse(entry.config).viewId === opt.view_id) &&
-                                            (opt.title.toLowerCase().includes(state.inputValue.toLowerCase()) ||
-                                                opt.query.toLowerCase().includes(state.inputValue.toLowerCase()))), renderOption: (props, option) => (_createElement("li", { ...props, key: option.view_id },
-                                            _jsxs(Stack, { children: [_jsx(Typography, { variant: "body1", children: t(option.title) }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: option.query })] }))), getOptionLabel: option => t(option.title), renderInput: params => _jsx(TextField, { ...params, label: t('route.home.add.view') }) }), _jsx(Typography, { variant: "body1", sx: { pt: 1 }, children: t('route.home.add.limit') }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('route.home.add.limit.description') }), _jsx(Box, { sx: { px: 0.5 }, children: _jsx(Slider, { value: config.limit ?? 3, valueLabelDisplay: "auto", onChange: (_, value) => setConfig('limit', value), min: 1, max: 10, step: 1, marks: true }) })] })), _jsx(Stack, { direction: "row", justifyContent: "end", children: _jsx(CustomButton, { variant: "outlined", size: "small", color: "primary", startIcon: _jsx(Check, {}), disabled: !selectedType || TYPES[selectedType]?.filter(field => !config[field])?.length > 0, onClick: _addCard, children: t('create') }) })] }) })] }) }));
-};
-export default AddNewCard;

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

@@ -1,7 +0,0 @@
-import type { FC } from 'react';
-export interface AnalyticSettings {
-    analyticId: string;
-    type: 'assessment' | 'created' | 'escalation';
-}
-declare const AnalyticCard: FC<AnalyticSettings>;
-export default AnalyticCard;

package/components/routes/home/AnalyticCard.js

@@ -1,30 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CenterFocusWeak, OpenInNew } from '@mui/icons-material';
-import { Box, Card, CardContent, IconButton, Skeleton, Stack, Tooltip, Typography } from '@mui/material';
-import { AnalyticContext } from '@cccsaurora/howler-ui/components/app/providers/AnalyticProvider';
-import FlexOne from '@cccsaurora/howler-ui/components/elements/addons/layout/FlexOne';
-import { useContext, useEffect, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Link } from 'react-router-dom';
-import Assessment from '../analytics/widgets/Assessment';
-import Created from '../analytics/widgets/Created';
-import Detection from '../analytics/widgets/Detection';
-import Escalation from '../analytics/widgets/Escalation';
-import Status from '../analytics/widgets/Status';
-const AnalyticCard = ({ analyticId, type }) => {
-    const { t } = useTranslation();
-    const [analytic, setAnalytic] = useState(null);
-    const { getAnalyticFromId } = useContext(AnalyticContext);
-    const chartRef = useRef();
-    useEffect(() => {
-        getAnalyticFromId(analyticId).then(setAnalytic);
-    }, [analyticId, getAnalyticFromId]);
-    return (_jsx(Card, { variant: "outlined", sx: { height: '100%' }, children: _jsxs(CardContent, { sx: { height: '100%' }, children: [_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(Typography, { variant: "h6", children: analytic?.name ?? _jsx(Skeleton, { variant: "text", height: "2em", width: "100px" }) }), _jsx(IconButton, { size: "small", component: Link, to: `/analytics/${analytic?.analytic_id}`, children: _jsx(OpenInNew, { fontSize: "small" }) }), _jsx(FlexOne, {}), !['assessment', 'escalation'].includes(type) && (_jsx(Tooltip, { title: t('hit.summary.zoom.reset'), children: _jsx(IconButton, { onClick: () => chartRef.current?.resetZoom(), children: _jsx(CenterFocusWeak, {}) }) }))] }), {
-                    assessment: () => _jsx(Assessment, { ref: chartRef, analytic: analytic }),
-                    created: () => _jsx(Created, { ref: chartRef, analytic: analytic }),
-                    status: () => _jsx(Status, { ref: chartRef, analytic: analytic }),
-                    detection: () => _jsx(Detection, { ref: chartRef, analytic: analytic }),
-                    escalation: () => (_jsx(Box, { sx: { display: 'flex', justifyContent: 'center' }, children: _jsx(Escalation, { analytic: analytic, maxWidth: "80%" }) }))
-                }[type]()] }) }));
-};
-export default AnalyticCard;

package/components/routes/home/EntryWrapper.d.ts

@@ -1,7 +0,0 @@
-import type { FC, PropsWithChildren } from 'react';
-declare const EntryWrapper: FC<PropsWithChildren<{
-    editing: boolean;
-    id: string;
-    onDelete?: () => void;
-}>>;
-export default EntryWrapper;

package/components/routes/home/EntryWrapper.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useSortable } from '@dnd-kit/sortable';
-import { CSS } from '@dnd-kit/utilities';
-import { Delete } from '@mui/icons-material';
-import { Box, Grid, IconButton } from '@mui/material';
-const EntryWrapper = ({ editing, id, children, onDelete }) => {
-    const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id, disabled: !editing });
-    return (_jsxs(Grid, { item: true, ref: setNodeRef, xs: 12, md: 6, sx: { position: 'relative' }, style: { transform: CSS.Translate.toString(transform), transition }, children: [editing && (_jsxs(_Fragment, { children: [_jsx(IconButton, { color: "error", sx: theme => ({ position: 'absolute', top: theme.spacing(2), right: theme.spacing(1), zIndex: 10 }), onClick: onDelete, children: _jsx(Delete, { fontSize: "small" }) }), _jsx(Box, { ...attributes, ...listeners, sx: {
-                            zIndex: 9,
-                            position: 'absolute',
-                            backgroundColor: 'background.paper',
-                            opacity: 0.5,
-                            top: 0,
-                            bottom: 0,
-                            left: 0,
-                            right: 0
-                        } })] })), children] }));
-};
-export default EntryWrapper;

package/components/routes/home/ViewCard.d.ts

@@ -1,7 +0,0 @@
-import type { FC } from 'react';
-export interface ViewSettings {
-    viewId: string;
-    limit: number;
-}
-declare const ViewCard: FC<ViewSettings>;
-export default ViewCard;

package/components/routes/home/ViewCard.js

@@ -1,43 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { OpenInNew } from '@mui/icons-material';
-import { Card, CardContent, IconButton, Skeleton, Stack, Typography } from '@mui/material';
-import api from '@cccsaurora/howler-ui/api';
-import AppListEmpty from '@cccsaurora/howler-ui/commons/components/display/AppListEmpty';
-import { ViewContext } from '@cccsaurora/howler-ui/components/app/providers/ViewProvider';
-import HitBanner from '@cccsaurora/howler-ui/components/elements/hit/HitBanner';
-import { HitLayout } from '@cccsaurora/howler-ui/components/elements/hit/HitLayout';
-import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
-import { useCallback, useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useNavigate } from 'react-router-dom';
-import { useContextSelector } from 'use-context-selector';
-const ViewCard = ({ viewId, limit }) => {
-    const navigate = useNavigate();
-    const { t } = useTranslation();
-    const { dispatchApi } = useMyApi();
-    const [hits, setHits] = useState([]);
-    const [loading, setLoading] = useState(false);
-    const view = useContextSelector(ViewContext, ctx => ctx.views[viewId]);
-    const fetchViews = useContextSelector(ViewContext, ctx => ctx.fetchViews);
-    useEffect(() => {
-        fetchViews([viewId]);
-    }, [fetchViews, viewId]);
-    useEffect(() => {
-        if (!view?.query) {
-            return;
-        }
-        const timeout = setTimeout(() => setLoading(true), 200);
-        dispatchApi(api.search.hit.post({
-            query: view.query,
-            rows: limit
-        }))
-            .then(res => setHits(res.items ?? []))
-            .finally(() => {
-            clearTimeout(timeout);
-            setLoading(false);
-        });
-    }, [dispatchApi, limit, view?.query]);
-    const onClick = useCallback((query) => navigate('/hits?query=' + query), [navigate]);
-    return (_jsx(Card, { variant: "outlined", sx: { height: '100%' }, children: _jsxs(Stack, { spacing: 1, sx: { p: 1, minHeight: 100 }, children: [_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(Typography, { variant: "h6", children: t(view?.title) || _jsx(Skeleton, { variant: "text", height: "2em", width: "100px" }) }), _jsx(IconButton, { size: "small", onClick: () => onClick(view.query), children: _jsx(OpenInNew, { fontSize: "small" }) })] }), loading ? (_jsxs(_Fragment, { children: [_jsx(Skeleton, { height: 150, width: "100%", variant: "rounded" }), _jsx(Skeleton, { height: 160, width: "100%", variant: "rounded" }), _jsx(Skeleton, { height: 140, width: "100%", variant: "rounded" })] })) : hits.length > 0 ? (hits.map(h => (_jsx(Card, { variant: "outlined", sx: { cursor: 'pointer' }, onClick: () => navigate((h.howler.is_bundle ? '/bundles/' : '/hits/') + h.howler.id), children: _jsx(CardContent, { children: _jsx(HitBanner, { layout: HitLayout.DENSE, hit: h }) }) }, h.howler.id)))) : (_jsx(AppListEmpty, {}))] }) }));
-};
-export default ViewCard;

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

@@ -1,3 +0,0 @@
-import { type FC } from 'react';
-declare const Home: FC;
-export default Home;

package/components/routes/home/index.js

@@ -1,122 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { DndContext, KeyboardSensor, PointerSensor, closestCenter, useSensor, useSensors } from '@dnd-kit/core';
-import { SortableContext, arrayMove, sortableKeyboardCoordinates } from '@dnd-kit/sortable';
-import { Cancel, Check, Close, Edit, OpenInNew } from '@mui/icons-material';
-import { Alert, AlertTitle, CircularProgress, Grid, IconButton, Stack, Typography } from '@mui/material';
-import api from '@cccsaurora/howler-ui/api';
-import { AppBrand } from '@cccsaurora/howler-ui/branding/AppBrand';
-import { useAppUser } from '@cccsaurora/howler-ui/commons/components/app/hooks';
-import PageCenter from '@cccsaurora/howler-ui/commons/components/pages/PageCenter';
-import CustomButton from '@cccsaurora/howler-ui/components/elements/addons/buttons/CustomButton';
-import { useMyLocalStorageItem } from '@cccsaurora/howler-ui/components/hooks/useMyLocalStorage';
-import useMyUserFunctions from '@cccsaurora/howler-ui/components/hooks/useMyUserFunctions';
-import dayjs from 'dayjs';
-import isEqual from 'lodash-es/isEqual';
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Link } from 'react-router-dom';
-import { StorageKey } from '@cccsaurora/howler-ui/utils/constants';
-import ErrorBoundary from '../ErrorBoundary';
-import AddNewCard from './AddNewCard';
-import AnalyticCard, {} from './AnalyticCard';
-import EntryWrapper from './EntryWrapper';
-import ViewCard, {} from './ViewCard';
-const LUCENE_DATE_FMT = 'YYYY-MM-DD[T]HH:mm:ss';
-const Home = () => {
-    const { t } = useTranslation();
-    const { user, setUser } = useAppUser();
-    const { setDashboard } = useMyUserFunctions();
-    const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
-    const [lastViewed, setLastViewed] = useMyLocalStorageItem(StorageKey.LAST_VIEW, dayjs().utc().format(LUCENE_DATE_FMT));
-    const [loading, setLoading] = useState(false);
-    const [isEditing, setIsEditing] = useState(false);
-    const [updatedHitTotal, setUpdatedHitTotal] = useState(0);
-    const [dashboard, setStateDashboard] = useState(user.dashboard ?? []);
-    const updateQuery = useMemo(() => `(howler.log.user:${user.username} OR howler.assignment:${user.username}) AND howler.log.timestamp:{${lastViewed} TO now} AND -howler.status:resolved`, [lastViewed, user.username]);
-    const getIdFromEntry = useCallback((entry) => {
-        const settings = JSON.parse(entry.config);
-        if (entry.type === 'analytic') {
-            return `${settings.analyticId}-${settings.type}`;
-        }
-        else if (entry.type === 'view') {
-            return settings.viewId;
-        }
-        else {
-            return 'unknown';
-        }
-    }, []);
-    const setLocalDashboard = useCallback((_dashboard) => {
-        setStateDashboard(_dashboard);
-    }, []);
-    const saveChanges = useCallback(async () => {
-        setLoading(true);
-        try {
-            setUser({
-                ...user,
-                dashboard
-            });
-            await setDashboard(dashboard ?? []);
-            setIsEditing(false);
-        }
-        finally {
-            setLoading(false);
-        }
-    }, [dashboard, setDashboard, setUser, user]);
-    const discardChanges = useCallback(() => {
-        setStateDashboard(user.dashboard);
-        setIsEditing(false);
-    }, [user.dashboard]);
-    const handleDragEnd = useCallback((event) => {
-        const { active, over } = event;
-        if (active.id !== over.id) {
-            const oldIndex = (dashboard ?? []).findIndex(entry => getIdFromEntry(entry) === active.id);
-            const newIndex = (dashboard ?? []).findIndex(entry => getIdFromEntry(entry) === over.id);
-            setLocalDashboard(arrayMove(dashboard, oldIndex, newIndex));
-        }
-    }, [dashboard, getIdFromEntry, setLocalDashboard]);
-    useEffect(() => {
-        api.search.hit
-            .post({
-            query: updateQuery,
-            rows: 0
-        })
-            .then(result => setUpdatedHitTotal(result.total));
-    }, [updateQuery]);
-    return (_jsx(PageCenter, { maxWidth: "1800px", textAlign: "left", height: "100%", children: _jsx(ErrorBoundary, { children: _jsxs(Stack, { direction: "column", spacing: 1, sx: { height: '100%' }, children: [_jsxs(Stack, { direction: "row", justifyContent: "end", spacing: 1, children: [isEditing && (_jsx(CustomButton, { variant: "outlined", size: "small", color: "error", startIcon: _jsx(Cancel, {}), onClick: discardChanges, children: t('cancel') })), _jsx(CustomButton, { variant: "outlined", size: "small", disabled: isEditing && isEqual(dashboard, user.dashboard), color: isEditing ? 'success' : 'primary', startIcon: isEditing ? loading ? _jsx(CircularProgress, { size: 20 }) : _jsx(Check, {}) : _jsx(Edit, {}), onClick: () => (!isEditing ? setIsEditing(true) : saveChanges()), children: t(isEditing ? 'save' : 'edit') })] }), updatedHitTotal > 0 && (_jsxs(Alert, { severity: "info", variant: "outlined", action: _jsxs(Stack, { spacing: 1, direction: "row", children: [_jsx(IconButton, { color: "info", component: Link, to: `/hits?query=${encodeURIComponent(updateQuery)}`, onClick: () => setLastViewed(dayjs().utc().format(LUCENE_DATE_FMT)), children: _jsx(OpenInNew, {}) }), _jsx(IconButton, { color: "info", onClick: () => {
-                                        setLastViewed(dayjs().utc().format(LUCENE_DATE_FMT));
-                                        setUpdatedHitTotal(0);
-                                    }, children: _jsx(Close, {}) })] }), children: [_jsx(AlertTitle, { children: t('route.home.alert.updated.title') }), t('route.home.alert.updated.description', { count: updatedHitTotal })] })), _jsx(DndContext, { sensors: sensors, collisionDetection: closestCenter, onDragEnd: handleDragEnd, children: _jsx(SortableContext, { items: (dashboard ?? []).map(entry => getIdFromEntry(entry)), children: _jsxs(Grid, { container: true, spacing: 1, alignItems: "stretch", sx: [
-                                    theme => ({
-                                        marginLeft: `${theme.spacing(-1)} !important`
-                                    }),
-                                    !dashboard?.length &&
-                                        !isEditing && {
-                                        height: '100%',
-                                        display: 'flex',
-                                        alignItems: 'center'
-                                    }
-                                ], children: [(dashboard ?? []).map(entry => {
-                                        if (entry.type === 'view') {
-                                            const settings = JSON.parse(entry.config);
-                                            return (_jsx(EntryWrapper, { editing: isEditing, id: settings.viewId, onDelete: () => setLocalDashboard((dashboard ?? []).filter(_entry => _entry.entry_id !== getIdFromEntry(entry))), children: _jsx(ViewCard, { ...settings }, entry.config) }, entry.entry_id));
-                                        }
-                                        else if (entry.type === 'analytic') {
-                                            const settings = JSON.parse(entry.config);
-                                            return (_jsx(EntryWrapper, { editing: isEditing, id: getIdFromEntry(entry), onDelete: () => setLocalDashboard((dashboard ?? []).filter(_entry => _entry.entry_id !== getIdFromEntry(entry))), children: _jsx(AnalyticCard, { ...settings }, entry.config) }, entry.entry_id));
-                                        }
-                                        else {
-                                            return null;
-                                        }
-                                    }), isEditing && (_jsx(AddNewCard, { dashboard: dashboard, addCard: newCard => setStateDashboard(_dashboard => [...(_dashboard ?? []), newCard]) })), !dashboard?.length && !isEditing && (_jsx(Grid, { item: true, xs: 12, children: _jsxs(Stack, { direction: "column", spacing: 2, sx: theme => ({
-                                                height: '60vh',
-                                                borderStyle: 'dashed',
-                                                borderColor: theme.palette.text.secondary,
-                                                borderWidth: '1rem',
-                                                borderRadius: '1rem',
-                                                opacity: 0.3,
-                                                justifyContent: 'center',
-                                                alignItems: 'center',
-                                                padding: 3
-                                            }), children: [_jsx(Typography, { variant: "h1", sx: { display: 'flex', alignItems: 'center' }, children: _jsxs(Stack, { direction: "row", spacing: 2.5, children: [_jsx(AppBrand, { application: "howler", variant: "logo", size: "large" }), _jsx("span", { children: t('route.home.title') })] }) }), _jsx(Typography, { variant: "h4", sx: { textAlign: 'center' }, children: t('route.home.description') })] }) }))] }) }) })] }) }) }));
-};
-export default Home;

package/components/routes/overviews/OverviewCard.d.ts

@@ -1,8 +0,0 @@
-import type { Overview } from '@cccsaurora/howler-ui/models/entities/generated/Overview';
-import type { FC } from 'react';
-declare const OverviewCard: FC<{
-    overview: Overview;
-    className?: string;
-    onDelete?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>, id: string) => void;
-}>;
-export default OverviewCard;

package/components/routes/overviews/OverviewCard.js

@@ -1,16 +0,0 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { Delete } from '@mui/icons-material';
-import { Card, IconButton, Stack, Tooltip, Typography } from '@mui/material';
-import FlexOne from '@cccsaurora/howler-ui/components/elements/addons/layout/FlexOne';
-import HowlerAvatar from '@cccsaurora/howler-ui/components/elements/display/HowlerAvatar';
-import { useTranslation } from 'react-i18next';
-const OverviewCard = ({ overview, className, onDelete }) => {
-    const { t } = useTranslation();
-    return (_jsx(Card, { variant: "outlined", sx: { p: 1, mb: 1 }, className: className, children: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, children: [_jsxs(Stack, { children: [_jsxs(Typography, { variant: "body1", children: [t(overview.analytic), " - ", t(overview.detection ?? 'all')] }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: _jsx("code", { children: _jsx("pre", { children: overview.content
-                                        .split('\n')
-                                        .filter(line => !!line)
-                                        .slice(0, 3)
-                                        .map(content => content.replace(/(.{,64}).+/, '$1'))
-                                        .join('\n') }) }) })] }), _jsx(FlexOne, {}), _jsx(HowlerAvatar, { sx: { height: '24px', width: '24px' }, userId: overview.owner }), onDelete && (_jsx(Tooltip, { title: t('route.overviews.manager.delete'), children: _jsx(IconButton, { onClick: e => onDelete(e, overview.overview_id), children: _jsx(Delete, {}) }) }))] }) }, overview.overview_id));
-};
-export default OverviewCard;

package/components/routes/overviews/OverviewEditor.d.ts

@@ -1,12 +0,0 @@
-import type { editor } from 'monaco-editor';
-interface OverviewEditorProps {
-    content: string;
-    setContent: (content: string) => void;
-    onMount?: () => void;
-    fontSize?: number;
-    height?: string;
-    width?: string;
-    editorOptions?: editor.IStandaloneEditorConstructionOptions;
-}
-declare const _default: import("react").NamedExoticComponent<OverviewEditorProps>;
-export default _default;