@cccsaurora/howler-ui 2.12.0-dev.168

package/components/elements/hit/outlines/DefaultOutline.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Info, Language, Lock, Person } from '@mui/icons-material';
+import { Box, IconButton, Tooltip, Typography } from '@mui/material';
+import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
+import PluginTypography from '@cccsaurora/howler-ui/components/elements/PluginTypography';
+import { get, isObject } from 'lodash-es';
+import React, { memo, useCallback, useContext } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router-dom';
+import { HitLayout } from '../HitLayout';
+const DefaultOutline = ({ hit, fields, template, layout = HitLayout.NORMAL, readonly = false }) => {
+    const { t } = useTranslation();
+    const { config } = useContext(ApiConfigContext);
+    const navigate = useNavigate();
+    const handleOpen = useCallback((event) => {
+        event.stopPropagation();
+        const params = {
+            analytic: hit.howler.analytic,
+            type: template?.type ?? 'personal'
+        };
+        if (template?.detection) {
+            params.detection = template.detection;
+        }
+        else if (!template && hit.howler.detection) {
+            params.detection = hit.howler.detection;
+        }
+        navigate('/templates/view?' +
+            Object.entries(params)
+                .map(([key, val]) => `${key}=${val}`)
+                .join('&'));
+    }, [hit.howler.analytic, hit.howler.detection, navigate, template]);
+    return (_jsxs(Box, { display: "grid", gridTemplateColumns: "auto 1fr", columnGap: 1, sx: { position: 'relative' }, children: [_jsx(IconButton, { size: "small", sx: { position: 'absolute', right: 0, top: 0 }, onClick: handleOpen, children: readonly ? ( // Built in template
+                _jsx(Tooltip, { title: t('route.templates.builtin'), children: _jsx(Lock, { fontSize: "small" }) })) : !template ? ( // No type specified => using the default
+                _jsx(Tooltip, { title: t('route.templates.default'), children: _jsx(Info, { fontSize: "small" }) })) : template.type === 'global' ? ( // Type is global => global template
+                _jsx(Tooltip, { title: t('route.templates.global'), children: _jsx(Language, { fontSize: "small" }) })) : (
+                // Finally, type isn't global => personal template
+                _jsx(Tooltip, { title: t('route.templates.personal'), children: _jsx(Person, { fontSize: "small" }) })) }), (fields ?? [])
+                .map(field => [field, get(hit, field)])
+                .map(([field, data]) => {
+                const displayedData = (Array.isArray(data) ? data.join(', ') : isObject(data) ? JSON.stringify(data) : data)?.toString();
+                if (!displayedData) {
+                    return null;
+                }
+                return (_jsxs(React.Fragment, { children: [_jsx(Tooltip, { title: (config.indexes.hit[field]?.description ?? t('none')).split('\n')[0], children: _jsxs(Typography, { variant: layout !== HitLayout.COMFY ? 'caption' : 'body1', fontWeight: "bold", children: [field, ":"] }) }), _jsx(PluginTypography, { context: "outline", variant: layout !== HitLayout.COMFY ? 'caption' : 'body1', whiteSpace: "normal", sx: { width: '100%', wordBreak: 'break-all' }, value: displayedData, children: displayedData })] }, field));
+            })] }));
+};
+export default memo(DefaultOutline);

package/components/elements/hit/outlines/al/AssemblyLineRules.d.ts

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

package/components/elements/hit/outlines/al/AssemblyLineRules.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Lock } from '@mui/icons-material';
+import { Chip, Grid, Stack, Tooltip, Typography } from '@mui/material';
+import { get } from 'lodash-es';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+const TAGS = [
+    'assemblyline.antivirus',
+    'assemblyline.behaviour',
+    'assemblyline.heuristic',
+    'assemblyline.yara',
+    'assemblyline.attribution',
+    'assemblyline.mitre.tactic',
+    'assemblyline.mitre.technique'
+];
+const VERDICT_COLORS = {
+    malicious: 'error',
+    suspicious: 'warning',
+    info: 'info',
+    safe: 'primary'
+};
+const VERDICT_ORDER = ['malicious', 'suspicious', 'safe', 'info'];
+const ARRAY_LIMIT = 10;
+const sortByVerdict = (a, b) => {
+    return VERDICT_ORDER.indexOf(a.verdict) > VERDICT_ORDER.indexOf(b.verdict)
+        ? 1
+        : VERDICT_ORDER.indexOf(b.verdict) > VERDICT_ORDER.indexOf(a.verdict)
+            ? -1
+            : 0;
+};
+const AssemblyLineRules = ({ hit }) => {
+    const { t } = useTranslation();
+    const ipArr = (hit.related.ip ?? []).filter(e => !!e).slice(0, ARRAY_LIMIT);
+    const tagsArr = TAGS.map(each => get(hit, each))
+        .filter(tag => !!tag?.value)
+        .sort(sortByVerdict)
+        .slice(0, ARRAY_LIMIT);
+    return (_jsxs(Grid, { container: true, direction: "row", justifyContent: "center", sx: { position: 'relative' }, children: [_jsx(Tooltip, { title: t('route.templates.builtin'), children: _jsx(Lock, { fontSize: "small", sx: { position: 'absolute', right: 0, top: 0 } }) }), _jsx(Grid, { item: true, xs: 2, children: _jsxs(Typography, { variant: "caption", fontWeight: "bold", children: [t('outline.assemblyline.file_path'), ":"] }) }), _jsx(Grid, { item: true, xs: 10, children: _jsx(Typography, { variant: "caption", children: hit.file.path ?? t('unknown') }) }), _jsx(Grid, { item: true, xs: 2, children: _jsxs(Typography, { variant: "caption", fontWeight: "bold", children: [t('outline.assemblyline.last_modified'), ":"] }) }), _jsx(Grid, { item: true, xs: 10, children: _jsxs(Typography, { variant: "caption", children: [hit.cbs?.sharepoint?.modified?.user ?? t('unknown'), " ", t('using'), ' ', hit.cbs?.sharepoint?.modified?.application ?? t('unknown'), " ", t('on'), " ", hit.file?.mtime ?? t('unknown')] }) }), _jsx(Grid, { item: true, xs: 2, children: _jsxs(Typography, { variant: "caption", fontWeight: "bold", children: [t('outline.assemblyline.beacons'), ":"] }) }), _jsx(Grid, { item: true, xs: 10, children: _jsxs(Stack, { direction: "row", spacing: 0.5, sx: { mb: 0.5 }, children: [ipArr.map(analytic => {
+                            return (_jsx(Grid, { item: true, children: _jsx(Chip, { label: analytic, variant: "outlined", size: "small" }) }, analytic));
+                        }), ipArr.length < 1 && (_jsx(Grid, { item: true, children: _jsx(Chip, { label: t('none'), variant: "outlined", size: "small" }) }))] }) }), _jsx(Grid, { item: true, xs: 2, children: _jsxs(Typography, { variant: "caption", fontWeight: "bold", children: [t('outline.assemblyline.tags'), ":"] }) }), _jsx(Grid, { item: true, xs: 10, children: _jsxs(Stack, { direction: "row", spacing: 0.5, sx: { mb: 0.5 }, children: [tagsArr.map(analytic => {
+                            return (_jsx(Grid, { item: true, children: _jsx(Chip, { label: analytic?.value, color: analytic?.verdict in VERDICT_COLORS
+                                        ? VERDICT_COLORS[analytic?.verdict]
+                                        : 'error', variant: "outlined", size: "small" }) }, analytic?.value + analytic?.verdict + analytic?.type + analytic?.subtype));
+                        }), tagsArr.length < 1 && (_jsx(Grid, { item: true, children: _jsx(Chip, { label: t('none'), variant: "outlined", size: "small" }) }))] }) })] }));
+};
+export default memo(AssemblyLineRules);

package/components/elements/hit/related/PivotLink.d.ts

@@ -0,0 +1,10 @@
+import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
+import type { Pivot } from '@cccsaurora/howler-ui/models/entities/generated/Pivot';
+import { type FC } from 'react';
+export interface PivotLinkProps {
+    pivot: Pivot;
+    hit: Hit;
+    compact?: boolean;
+}
+declare const PivotLink: FC<PivotLinkProps>;
+export default PivotLink;

package/components/elements/hit/related/PivotLink.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon } from '@iconify/react/dist/iconify.js';
+import { Skeleton } from '@mui/material';
+import Handlebars from 'handlebars';
+import { isEmpty } from 'lodash-es';
+import { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { usePluginStore } from 'react-pluggable';
+import { flattenDeep } from '@cccsaurora/howler-ui/utils/utils';
+import RelatedLink from './RelatedLink';
+const PivotLink = ({ pivot, hit, compact = false }) => {
+    const { i18n } = useTranslation();
+    const pluginStore = usePluginStore();
+    const flatHit = useMemo(() => flattenDeep(hit ?? {}), [hit]);
+    const href = useMemo(() => {
+        if (!pivot || pivot.format !== 'link' || !flatHit || isEmpty(flatHit)) {
+            return '';
+        }
+        const templateObject = Object.fromEntries(pivot.mappings.map(mapping => {
+            const result = [mapping.key];
+            if (mapping.field === 'custom') {
+                result.push(mapping.custom_value);
+            }
+            else if (Array.isArray(flatHit[mapping.field])) {
+                result.push(flatHit[mapping.field][0]);
+            }
+            else {
+                result.push(flatHit[mapping.field]);
+            }
+            return result;
+        }));
+        return Handlebars.compile(pivot.value)(templateObject);
+    }, [flatHit, pivot]);
+    if (href) {
+        return (_jsx(RelatedLink, { title: pivot.label[i18n.language], href: href, compact: compact, children: _jsx(Icon, { fontSize: "1.5rem", icon: pivot.icon }) }));
+    }
+    const pluginPivot = pluginStore.executeFunction(`pivot.${pivot.format}`, { pivot, hit, compact });
+    if (pluginPivot) {
+        return pluginPivot;
+    }
+    return _jsx(Skeleton, { variant: "rounded" });
+};
+export default PivotLink;

package/components/elements/hit/related/RelatedLink.d.ts

@@ -0,0 +1,8 @@
+import React, { type PropsWithChildren } from 'react';
+declare const RelatedLink: React.FC<PropsWithChildren<{
+    icon?: string;
+    title?: string;
+    href?: string;
+    compact?: boolean;
+}>>;
+export default RelatedLink;

package/components/elements/hit/related/RelatedLink.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar, Stack, Typography } from '@mui/material';
+import { useAppTheme } from '@cccsaurora/howler-ui/commons/components/app/hooks';
+import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
+import HowlerCard from '@cccsaurora/howler-ui/components/elements/display/HowlerCard';
+import React, { useContext, useMemo } from 'react';
+import { Link } from 'react-router-dom';
+const RelatedLink = ({ icon, title, href, compact = false, children }) => {
+    const { config } = useContext(ApiConfigContext);
+    const { isDark } = useAppTheme();
+    const _icon = useMemo(() => {
+        if (icon) {
+            const app = config.configuration.ui.apps.find(a => a.name.toLowerCase() === icon?.toLowerCase());
+            if (app) {
+                return app[`img_${isDark ? 'd' : 'l'}`];
+            }
+        }
+        return icon;
+    }, [config.configuration.ui.apps, icon, isDark]);
+    return (_jsx(HowlerCard, { variant: compact ? 'outlined' : 'elevation', onClick: () => window.open(href), sx: [
+            theme => ({
+                cursor: 'pointer',
+                backgroundColor: 'transparent',
+                transition: theme.transitions.create(['border-color']),
+                '&:hover': { borderColor: 'primary.main', '& a': { textDecoration: 'underline' } },
+                '& > div': {
+                    height: '100%'
+                },
+                '& a': { textDecoration: 'none', color: 'text.primary' }
+            }),
+            !compact && { border: 'thin solid', borderColor: 'transparent' }
+        ], children: _jsxs(Stack, { direction: "row", p: compact ? 0.5 : 1, spacing: 1, alignItems: "center", children: [children || (_jsx(Avatar, { variant: "rounded", alt: title ?? href, src: _icon, sx: [
+                        theme => ({
+                            width: theme.spacing(compact ? 4 : 6),
+                            height: theme.spacing(compact ? 4 : 6),
+                            '& img': {
+                                objectFit: 'contain'
+                            }
+                        }),
+                        !_icon && { backgroundColor: 'transparent' }
+                    ], children: _icon })), _jsx(Typography, { component: Link, to: href, onClick: e => e.stopPropagation(), children: title ?? href })] }) }, href));
+};
+export default RelatedLink;

package/components/elements/view/ViewTitle.d.ts

@@ -0,0 +1,10 @@
+import { type FC } from 'react';
+interface ViewTitleProps {
+    title?: string;
+    type?: string;
+    query?: string;
+    sort?: string;
+    span?: string;
+}
+export declare const ViewTitle: FC<ViewTitleProps>;
+export {};

package/components/elements/view/ViewTitle.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ArrowDownward, ArrowUpward, Language, Lock, Person } from '@mui/icons-material';
+import { Chip, Stack, Tooltip, Typography } from '@mui/material';
+import { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { convertLuceneToDate } from '@cccsaurora/howler-ui/utils/utils';
+export const ViewTitle = ({ title, type, query, sort, span }) => {
+    const { t } = useTranslation();
+    const spanLabel = useMemo(() => {
+        if (!span) {
+            return '';
+        }
+        if (span.includes(':')) {
+            return t(convertLuceneToDate(span));
+        }
+        else {
+            return t(span);
+        }
+    }, [span, t]);
+    return (_jsxs(Stack, { children: [_jsxs(Stack, { direction: "row", alignItems: "start", spacing: 1, children: [_jsx(Tooltip, { title: t(`route.views.manager.${type}`), children: {
+                            readonly: _jsx(Lock, { fontSize: "small" }),
+                            global: _jsx(Language, { fontSize: "small" }),
+                            personal: _jsx(Person, { fontSize: "small" })
+                        }[type] }), _jsx(Typography, { variant: "body1", children: t(title) })] }), _jsx(Typography, { variant: "caption", children: _jsx("code", { children: query }) }), (sort || span) && (_jsxs(Stack, { direction: "row", sx: { mt: 1 }, spacing: 1, children: [sort?.split(',').map(_sort => (_jsx(Chip, { size: "small", label: _sort.split(' ')[0], icon: _sort.endsWith('desc') ? _jsx(ArrowDownward, {}) : _jsx(ArrowUpward, {}) }, _sort.split(' ')[0]))), spanLabel && _jsx(Chip, { size: "small", label: spanLabel })] }))] }));
+};

package/components/hooks/useHitActions.d.ts

@@ -0,0 +1,14 @@
+import type { ActionButton } from '@cccsaurora/howler-ui/components/elements/hit/actions/SharedComponents';
+import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
+export declare const MANAGE_OPTIONS: Partial<ActionButton>[];
+declare const useHitActions: (_hits: Hit | Hit[]) => {
+    availableTransitions: ActionButton[];
+    canVote: boolean;
+    canAssess: boolean;
+    loading: boolean;
+    manage: (transition: string) => Promise<void>;
+    assess: (assessment: string, skipRationale?: boolean) => Promise<void>;
+    vote: (v: string) => Promise<void>;
+    selectedVote: string;
+};
+export default useHitActions;

package/components/hooks/useHitActions.js

@@ -0,0 +1,191 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import api from '@cccsaurora/howler-ui/api';
+import { useAppUser } from '@cccsaurora/howler-ui/commons/components/app/hooks';
+import AssignUserDrawer from '@cccsaurora/howler-ui/components/app/drawers/AssignUserDrawer';
+import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
+import { AppDrawerContext } from '@cccsaurora/howler-ui/components/app/providers/AppDrawerProvider';
+import { HitContext } from '@cccsaurora/howler-ui/components/app/providers/HitProvider';
+import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
+import RationaleModal from '@cccsaurora/howler-ui/components/elements/display/modals/RationaleModal';
+import { useCallback, useContext, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useContextSelector } from 'use-context-selector';
+import useMyApi from './useMyApi';
+import useMySnackbar from './useMySnackbar';
+export const MANAGE_OPTIONS = [
+    { type: 'action', name: 'release', key: 'R', i18nKey: `hit.details.actions.action.release` },
+    { type: 'action', name: 'assign_to_other', key: 'T', i18nKey: `hit.details.actions.action.assign_to_other` },
+    { type: 'action', name: 'start', key: 'Y', i18nKey: `hit.details.actions.action.start` },
+    { type: 'action', name: 'pause', key: 'U', i18nKey: `hit.details.actions.action.pause` },
+    { type: 'action', name: 'resume', key: 'I', i18nKey: `hit.details.actions.action.resume` },
+    { type: 'action', name: 'assign_to_me', key: 'O', i18nKey: `hit.details.actions.action.assign_to_me` },
+    { type: 'action', name: 're_evaluate', key: 'P', i18nKey: `hit.details.actions.action.re_evaluate` },
+    { type: 'action', name: 'demote', key: '-', i18nKey: `hit.details.actions.action.demote` },
+    { type: 'action', name: 'promote', key: '+', i18nKey: `hit.details.actions.action.promote` }
+];
+const useHitActions = (_hits) => {
+    const { t } = useTranslation();
+    const config = useContext(ApiConfigContext);
+    const { user } = useAppUser();
+    const drawer = useContext(AppDrawerContext);
+    const { showModal } = useContext(ModalContext);
+    const { showWarningMessage } = useMySnackbar();
+    const { dispatchApi } = useMyApi();
+    const updateHit = useContextSelector(HitContext, ctx => ctx.updateHit);
+    const [loading, setLoading] = useState(false);
+    const hits = useMemo(() => (Array.isArray(_hits) ? _hits : [_hits]).filter(_hit => !!_hit), [_hits]);
+    const canVote = useMemo(() => hits.every(hit => hit?.howler.assignment !== user.username || hit?.howler.status === 'in-progress'), [hits, user.username]);
+    const canAssess = useMemo(() => hits.every(hit => !(['on-hold', 'resolved'].includes(hit?.howler.status) && hit?.howler.assignment === user.username)), [hits, user.username]);
+    const selectedVote = useMemo(() => {
+        if (hits.length !== 1) {
+            return '';
+        }
+        const hit = hits[0];
+        return hit?.howler.votes.benign.includes(user.email)
+            ? 'benign'
+            : hit?.howler.votes.malicious.includes(user.email)
+                ? 'malicious'
+                : hit?.howler.votes.obscure.includes(user.email)
+                    ? 'obscure'
+                    : '';
+    }, [hits, user.email]);
+    const onAssign = useCallback(() => new Promise((res, rej) => {
+        let done = false;
+        drawer.open({
+            titleKey: 'hit.details.actions.assign',
+            children: (_jsx(AssignUserDrawer, { skipSubmit: true, ids: hits.map(hit => hit.howler.id), assignment: (hits.every(hit => hit.howler.assignment === hits[0].howler.assignment) &&
+                    hits[0]?.howler.assessment) ||
+                    'unassigned', onAssigned: h => {
+                    done = true;
+                    drawer.close();
+                    res(h);
+                } })),
+            onClosed: () => {
+                if (!done) {
+                    rej('unassigned');
+                }
+            }
+        });
+    }), [drawer, hits]);
+    const vote = useCallback(async (v) => {
+        if (v !== selectedVote) {
+            setLoading(true);
+            try {
+                await Promise.all(hits.map(async (hit) => {
+                    const _vote = () => api.hit.transition.post(hit?.howler.id, { transition: 'vote', data: { vote: v, email: user.email } });
+                    const updatedHit = await dispatchApi(_vote(), {
+                        onConflict: async () => {
+                            await api.hit.get(hit?.howler.id);
+                            const newResult = await _vote();
+                            updateHit(newResult);
+                        }
+                    });
+                    if (updatedHit) {
+                        updateHit(updatedHit);
+                    }
+                }));
+            }
+            finally {
+                setLoading(false);
+            }
+        }
+    }, [dispatchApi, hits, selectedVote, updateHit, user.email]);
+    const assess = useCallback(async (assessment, skipRationale = false) => {
+        const rationale = skipRationale
+            ? t('rationale.default', { assessment })
+            : await new Promise(res => {
+                showModal(_jsx(RationaleModal, { onSubmit: _rationale => {
+                        res(_rationale);
+                    } }));
+            });
+        await Promise.all(hits.map(async (hit) => {
+            if (assessment !== hit?.howler.assessment) {
+                setLoading(true);
+                try {
+                    const update = () => api.hit.transition.post(hit?.howler.id, { transition: 'assess', data: { assessment, rationale } });
+                    const updatedHit = await dispatchApi(update(), {
+                        onConflict: async () => {
+                            const updatedData = await api.hit.get(hit?.howler.id);
+                            if (!updatedData.howler.assessment) {
+                                const result = await update();
+                                updateHit(result);
+                            }
+                            else {
+                                updateHit(updatedData);
+                                showWarningMessage(t('hit.actions.conflict.assess'));
+                            }
+                        }
+                    });
+                    if (updatedHit) {
+                        updateHit(updatedHit);
+                    }
+                }
+                finally {
+                    setLoading(false);
+                }
+            }
+        }));
+    }, [dispatchApi, hits, showModal, showWarningMessage, t, updateHit]);
+    const manage = useCallback(async (transition) => {
+        setLoading(true);
+        try {
+            const data = {};
+            if (transition === 'assign_to_other') {
+                data.assignee = await onAssign();
+            }
+            await Promise.all(hits.map(async (hit) => {
+                const update = () => api.hit.transition.post(hit?.howler.id, { transition, data });
+                const updatedHit = await dispatchApi(update(), {
+                    onConflict: async () => {
+                        const updatedData = await api.hit.get(hit?.howler.id);
+                        updateHit(updatedData);
+                        showWarningMessage(t('hit.actions.conflict.manage'));
+                    }
+                });
+                if (updatedHit && updateHit) {
+                    updateHit(updatedHit);
+                }
+            }));
+        }
+        catch (e) {
+            if (e !== 'unassigned') {
+                throw e;
+            }
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [dispatchApi, hits, onAssign, showWarningMessage, t, updateHit]);
+    const availableTransitions = useMemo(() => MANAGE_OPTIONS.filter(option => {
+        const name = option.name.toLowerCase();
+        // Is this option one that is valid for the current state?
+        return hits.every(hit => config.config.lookups?.transitions[hit?.howler.status]?.includes(name) &&
+            // If we are assigning or voting, the hit can't be assigned to the current user
+            ((name !== 'assign_to_me' && name !== 'vote') || hit?.howler.assignment !== user.username) &&
+            // If we are running any of these actions, the current user must be assigned the hit
+            ((name !== 'release' && name !== 'start' && name !== 'resume' && name !== 'pause') ||
+                hit?.howler.assignment === user.username) &&
+            // If we're promoting, it has to be a hit
+            (name !== 'promote' || hit?.howler.escalation === 'hit') &&
+            // If we're demoting, it has to be an alert
+            (name !== 'demote' || hit?.howler.escalation === 'alert'));
+    }).map(option => ({
+        ...option,
+        actionFunction: () => {
+            if (!loading) {
+                manage(option.name.toLowerCase());
+            }
+        }
+    })), [config.config.lookups?.transitions, hits, loading, manage, user.username]);
+    return {
+        availableTransitions,
+        canVote,
+        canAssess,
+        loading,
+        manage,
+        assess,
+        vote,
+        selectedVote
+    };
+};
+export default useHitActions;

package/components/hooks/useHitSelection.d.ts

@@ -0,0 +1,8 @@
+import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
+import type React from 'react';
+declare const useHitSelection: () => {
+    lastSelected: string;
+    setLastSelected: React.Dispatch<React.SetStateAction<string>>;
+    onClick: (e: React.MouseEvent<HTMLDivElement>, hit: Hit) => void;
+};
+export default useHitSelection;

package/components/hooks/useHitSelection.js

@@ -0,0 +1,78 @@
+import { useAppBreadcrumbs } from '@cccsaurora/howler-ui/commons/components/app/hooks';
+import { HitContext } from '@cccsaurora/howler-ui/components/app/providers/HitProvider';
+import { HitSearchContext } from '@cccsaurora/howler-ui/components/app/providers/HitSearchProvider';
+import { ParameterContext } from '@cccsaurora/howler-ui/components/app/providers/ParameterProvider';
+import useMySitemap from '@cccsaurora/howler-ui/components/hooks/useMySitemap';
+import { useCallback, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useContextSelector } from 'use-context-selector';
+const useHitSelection = () => {
+    const navigate = useNavigate();
+    const { setItems } = useAppBreadcrumbs();
+    const { routes } = useMySitemap();
+    const response = useContextSelector(HitSearchContext, ctx => ctx.response);
+    const selectedHits = useContextSelector(HitContext, ctx => ctx.selectedHits);
+    const addHitToSelection = useContextSelector(HitContext, ctx => ctx.addHitToSelection);
+    const removeHitFromSelection = useContextSelector(HitContext, ctx => ctx.removeHitFromSelection);
+    const clearSelectedHits = useContextSelector(HitContext, ctx => ctx.clearSelectedHits);
+    const setSelected = useContextSelector(ParameterContext, ctx => ctx.setSelected);
+    const [lastSelected, setLastSelected] = useState(null);
+    const onClick = useCallback((e, hit) => {
+        setLastSelected(hit.howler.id);
+        if (e.ctrlKey) {
+            document.getSelection().removeAllRanges();
+            if (selectedHits.some(_hit => _hit.howler.id === hit.howler.id)) {
+                removeHitFromSelection(hit.howler.id);
+            }
+            else {
+                addHitToSelection(hit.howler.id);
+            }
+            e.stopPropagation();
+            return;
+        }
+        if (e.shiftKey) {
+            document.getSelection().removeAllRanges();
+            if (selectedHits.length < 1) {
+                addHitToSelection(hit.howler.id);
+            }
+            else if (lastSelected) {
+                const lastSelectedIndex = response?.items.findIndex(_hit => _hit.howler.id === lastSelected);
+                const currentIndex = response?.items.findIndex(_hit => _hit.howler.id === hit.howler.id);
+                const lowerBound = lastSelectedIndex < currentIndex ? lastSelectedIndex : currentIndex;
+                const upperBound = lastSelectedIndex > currentIndex ? lastSelectedIndex : currentIndex;
+                for (let i = lowerBound; i <= upperBound; i++) {
+                    addHitToSelection(response.items[i]?.howler.id);
+                }
+            }
+            e.stopPropagation();
+            return;
+        }
+        if (hit.howler.is_bundle) {
+            const searchRoute = routes.find(_route => _route.path.startsWith(location.pathname.replace(/^(\/.*)\/.+/, '$1')));
+            const newBreadcrumb = {
+                ...searchRoute,
+                path: location.pathname + location.search
+            };
+            setItems([{ route: newBreadcrumb, matcher: null }]);
+            navigate(`/bundles/${hit.howler.id}?span=date.range.all&query=howler.id%3A*&offset=0`);
+            clearSelectedHits(hit.howler.id);
+        }
+        else {
+            clearSelectedHits(hit.howler.id);
+            setSelected(hit.howler.id);
+        }
+    }, [
+        addHitToSelection,
+        clearSelectedHits,
+        lastSelected,
+        navigate,
+        removeHitFromSelection,
+        response,
+        routes,
+        selectedHits,
+        setItems,
+        setSelected
+    ]);
+    return { lastSelected, setLastSelected, onClick };
+};
+export default useHitSelection;

package/components/hooks/useMyApi.d.ts

@@ -0,0 +1,10 @@
+type DispatchApiConfig = {
+    throwError?: boolean;
+    logError?: boolean;
+    showError?: boolean;
+    onConflict?: () => Promise<void>;
+};
+declare const useMyApi: () => {
+    dispatchApi: <R>(apiCall: Promise<R>, config?: DispatchApiConfig) => Promise<R>;
+};
+export default useMyApi;

package/components/hooks/useMyApi.js

@@ -0,0 +1,43 @@
+import useMySnackbar from '@cccsaurora/howler-ui/components/hooks/useMySnackbar';
+import { useCallback, useMemo } from 'react';
+const DEFAULT_CONFIG = {
+    throwError: true,
+    logError: false,
+    showError: true,
+    onConflict: null
+};
+const useMyApi = () => {
+    const { showErrorMessage } = useMySnackbar();
+    const dispatchApi = useCallback(
+    // eslint-disable-next-line comma-spacing
+    async (apiCall, config = DEFAULT_CONFIG) => {
+        const { throwError, logError, showError, onConflict } = { ...DEFAULT_CONFIG, ...config };
+        try {
+            const response = await apiCall;
+            return response;
+        }
+        catch (error) {
+            if (error instanceof Error) {
+                if (onConflict && [409, 412].includes(error.cause?.api_status_code)) {
+                    onConflict();
+                    return null;
+                }
+                if (showError) {
+                    showErrorMessage(error.message);
+                }
+                if (logError) {
+                    // eslint-disable-next-line no-console
+                    console.error(error);
+                }
+                if (throwError) {
+                    throw error;
+                }
+            }
+            return null;
+        }
+    }, [showErrorMessage]);
+    return useMemo(() => ({
+        dispatchApi
+    }), [dispatchApi]);
+};
+export default useMyApi;