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

package/components/routes/overviews/startingTemplate.js

@@ -1,27 +0,0 @@
-import { useHelpers } from '@cccsaurora/howler-ui/components/elements/display/handlebars/helpers';
-import { useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import TEMPLATE_EN from './template/en.md';
-import TEMPLATE_FR from './template/fr.md';
-const TEMPLATES = {
-    en: TEMPLATE_EN,
-    fr: TEMPLATE_FR
-};
-export const useStartingTemplate = () => {
-    const helpers = useHelpers();
-    const { i18n } = useTranslation();
-    const helperText = useMemo(() => helpers
-        .map(helper => `
-### \`${helper.keyword}\`
-
-${helper.documentation[i18n.language]}
-
----
-`.trim())
-        .join('\n'), [helpers, i18n.language]);
-    return useMemo(() => `
-${TEMPLATES[i18n.language] ?? TEMPLATES.en}
-
-${helperText}
-`, [helperText, i18n.language]);
-};

package/components/routes/settings/AdminSection.d.ts

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

package/components/routes/settings/AdminSection.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import howlerPluginStore from '@cccsaurora/howler-ui/plugins/store';
-import { useTranslation } from 'react-i18next';
-import { usePluginStore } from 'react-pluggable';
-import SettingsSection from './SettingsSection';
-const AdminSection = () => {
-    const { t } = useTranslation();
-    const pluginStore = usePluginStore();
-    return (_jsx(SettingsSection, { title: t('page.settings.admin.title'), colSpan: 2, children: howlerPluginStore.plugins.map(plugin => pluginStore.executeFunction(`${plugin}.settings`, 'admin')) }));
-};
-export default AdminSection;

package/components/routes/settings/LocalSection.d.ts

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

package/components/routes/settings/LocalSection.js

@@ -1,26 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/* eslint-disable react/jsx-no-literals */
-import { List, TableChart, ViewComfy, ViewCompact, ViewModule } from '@mui/icons-material';
-import { MenuItem, Select, Stack, TableCell, TableRow, ToggleButton, ToggleButtonGroup, Typography } from '@mui/material';
-import { HitLayout } from '@cccsaurora/howler-ui/components/elements/hit/HitLayout';
-import { useMyLocalStorageItem } from '@cccsaurora/howler-ui/components/hooks/useMyLocalStorage';
-import howlerPluginStore from '@cccsaurora/howler-ui/plugins/store';
-import { useTranslation } from 'react-i18next';
-import { usePluginStore } from 'react-pluggable';
-import { StorageKey } from '@cccsaurora/howler-ui/utils/constants';
-import EditRow from '../../elements/EditRow';
-import SettingsSection from './SettingsSection';
-const CELL_SX = { borderBottom: 0, paddingBottom: 0.5 };
-const LocalSection = () => {
-    const { t } = useTranslation();
-    const pluginStore = usePluginStore();
-    const [compactJson, setCompactJson] = useMyLocalStorageItem(StorageKey.COMPACT_JSON, true);
-    const [flattenJson, setFlattenJson] = useMyLocalStorageItem(StorageKey.FLATTEN_JSON, false);
-    const [forceDrawer, setForceDrawer] = useMyLocalStorageItem(StorageKey.FORCE_DRAWER, false);
-    const [hitLayout, setHitLayout] = useMyLocalStorageItem(StorageKey.HIT_LAYOUT, false);
-    const [displayType, setDisplayType] = useMyLocalStorageItem(StorageKey.DISPLAY_TYPE, 'list');
-    const [pageCount, setPageCount] = useMyLocalStorageItem(StorageKey.PAGE_COUNT, 25);
-    const [searchWidth, setSearchWidth] = useMyLocalStorageItem(StorageKey.SEARCH_PANE_WIDTH, null);
-    return (_jsxs(SettingsSection, { title: t('page.settings.local.title'), colSpan: 3, children: [_jsx(EditRow, { titleKey: "page.settings.local.compact.json", descriptionKey: "page.settings.local.compact.json.description", value: compactJson, type: "checkbox", onEdit: async (value) => setCompactJson(JSON.parse(value)) }), _jsx(EditRow, { titleKey: "page.settings.local.flatten.json", descriptionKey: "page.settings.local.flatten.json.description", value: flattenJson, type: "checkbox", onEdit: async (value) => setFlattenJson(JSON.parse(value)) }), _jsx(EditRow, { titleKey: "page.settings.local.details.drawer", descriptionKey: "page.settings.local.details.drawer.description", value: forceDrawer, type: "checkbox", onEdit: async (value) => setForceDrawer(JSON.parse(value)) }), _jsx(EditRow, { titleKey: "page.settings.local.search.width", descriptionKey: "page.settings.local.search.width.description", value: searchWidth, type: "range", min: 400, max: Math.floor(window.innerWidth / 100) * 100, optional: true, onEdit: async (value) => setSearchWidth(value ? parseInt(value) : null) }), _jsxs(TableRow, { children: [_jsx(TableCell, { sx: CELL_SX, style: { whiteSpace: 'nowrap' }, children: t('page.settings.local.hits.layout') }), _jsx(TableCell, { sx: CELL_SX, colSpan: 2, align: "right", children: _jsxs(ToggleButtonGroup, { size: "small", value: hitLayout, exclusive: true, onChange: (_, value) => setHitLayout(value), children: [_jsx(ToggleButton, { value: HitLayout.DENSE, children: _jsxs(Stack, { direction: "row", spacing: 0.5, children: [_jsx(ViewCompact, {}), _jsx("span", { children: t('page.settings.local.hits.layout.dense') })] }) }), _jsx(ToggleButton, { value: HitLayout.NORMAL, children: _jsxs(Stack, { direction: "row", spacing: 0.5, children: [_jsx(ViewModule, {}), _jsx("span", { children: t('page.settings.local.hits.layout.normal') })] }) }), _jsx(ToggleButton, { value: HitLayout.COMFY, children: _jsxs(Stack, { direction: "row", spacing: 0.5, children: [_jsx(ViewComfy, {}), _jsx("span", { children: t('page.settings.local.hits.layout.comfy') })] }) })] }) })] }), _jsx(TableRow, { children: _jsx(TableCell, { colSpan: 3, sx: { paddingTop: '0 !important' }, children: _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('page.settings.local.hits.layout.description') }) }) }), _jsxs(TableRow, { children: [_jsx(TableCell, { sx: CELL_SX, style: { whiteSpace: 'nowrap' }, children: t('page.settings.local.hits.display_type') }), _jsx(TableCell, { sx: CELL_SX, colSpan: 2, align: "right", children: _jsxs(ToggleButtonGroup, { size: "small", value: displayType, exclusive: true, onChange: (_, value) => setDisplayType(value), children: [_jsx(ToggleButton, { value: "list", children: _jsxs(Stack, { direction: "row", spacing: 0.5, children: [_jsx(List, {}), _jsx("span", { children: t('page.settings.local.hits.display_type.list') })] }) }), _jsx(ToggleButton, { value: "grid", children: _jsxs(Stack, { direction: "row", spacing: 0.5, children: [_jsx(TableChart, {}), _jsx("span", { children: t('page.settings.local.hits.display_type.grid') })] }) })] }) })] }), _jsx(TableRow, { children: _jsx(TableCell, { colSpan: 3, sx: { paddingTop: '0 !important' }, children: _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('page.settings.local.hits.display_type.description') }) }) }), _jsxs(TableRow, { children: [_jsx(TableCell, { sx: CELL_SX, style: { whiteSpace: 'nowrap' }, children: t('page.settings.local.results.count') }), _jsx(TableCell, { sx: CELL_SX, colSpan: 2, align: "right", children: _jsxs(Select, { size: "small", sx: { minWidth: '75px', textAlign: 'left' }, value: pageCount, onChange: event => setPageCount(typeof event.target.value === 'string' ? parseInt(event.target.value) : event.target.value), children: [_jsx(MenuItem, { value: 5, children: "5" }), _jsx(MenuItem, { value: 10, children: "10" }), _jsx(MenuItem, { value: 25, children: "25" }), _jsx(MenuItem, { value: 50, children: "50" }), _jsx(MenuItem, { value: 75, children: "75" }), _jsx(MenuItem, { value: 100, children: "100" }), _jsx(MenuItem, { value: 150, children: "150" }), _jsx(MenuItem, { value: 250, children: "250" })] }) })] }), _jsx(TableRow, { children: _jsx(TableCell, { colSpan: 3, sx: { paddingTop: '0 !important' }, children: _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('page.settings.local.results.count.description') }) }) }), howlerPluginStore.plugins.map(plugin => pluginStore.executeFunction(`${plugin}.settings`, 'local'))] }));
-};
-export default LocalSection;

package/components/routes/settings/ProfileSection.d.ts

@@ -1,10 +0,0 @@
-import type { HowlerUser } from '@cccsaurora/howler-ui/models/entities/HowlerUser';
-import type { FC } from 'react';
-declare const ProfileSection: FC<{
-    user: HowlerUser;
-    editName?: (value: string) => Promise<void>;
-    addRole?: (role: string) => Promise<void>;
-    removeRole?: (role: string) => Promise<void>;
-    viewGroups: () => Promise<void>;
-}>;
-export default ProfileSection;

package/components/routes/settings/ProfileSection.js

@@ -1,53 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Add, Check, ChevronRight, Clear } from '@mui/icons-material';
-import { Chip, CircularProgress, Grid, TableCell, TableRow, Typography } from '@mui/material';
-import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
-import howlerPluginStore from '@cccsaurora/howler-ui/plugins/store';
-import { useCallback, useContext, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { usePluginStore } from 'react-pluggable';
-import { delay } from '@cccsaurora/howler-ui/utils/utils';
-import EditRow from '../../elements/EditRow';
-import SettingsSection from './SettingsSection';
-const ProfileSection = ({ user, editName, addRole, removeRole, viewGroups }) => {
-    const { t } = useTranslation();
-    const { config } = useContext(ApiConfigContext);
-    const pluginStore = usePluginStore();
-    const [loading, setLoading] = useState({});
-    const [loadingGroups, setLoadingGroups] = useState(false);
-    const wrapChange = useCallback(async (r, fn) => {
-        const delayedLoad = delay(250);
-        delayedLoad.then(() => {
-            setLoading({
-                ...loading,
-                [r]: true
-            });
-        });
-        try {
-            await fn(r);
-        }
-        finally {
-            delayedLoad.cancel();
-            setLoading({
-                ...loading,
-                [r]: false
-            });
-        }
-    }, [loading]);
-    const onViewGroups = useCallback(async () => {
-        setLoadingGroups(true);
-        try {
-            await viewGroups();
-        }
-        finally {
-            setLoadingGroups(false);
-        }
-    }, [viewGroups]);
-    return (_jsxs(SettingsSection, { title: t('page.settings.profile.title'), colSpan: 3, children: [_jsxs(TableRow, { children: [_jsx(TableCell, { style: { whiteSpace: 'nowrap' }, children: t('page.settings.profile.table.username') }), _jsx(TableCell, { width: "100%", colSpan: 2, children: user?.username })] }), _jsx(EditRow, { titleKey: "page.settings.profile.table.name", value: user?.name, onEdit: editName }), _jsxs(TableRow, { children: [_jsx(TableCell, { style: { whiteSpace: 'nowrap' }, children: t('page.settings.profile.table.email') }), _jsx(TableCell, { width: "100%", colSpan: 2, children: user?.email })] }), viewGroups && (_jsxs(_Fragment, { children: [_jsxs(TableRow, { onClick: onViewGroups, sx: theme => ({
-                            cursor: 'pointer',
-                            transitionProperty: 'background-color',
-                            transitionDuration: theme.transitions.duration.shortest + 'ms',
-                            '&:hover': { backgroundColor: 'rgba(128, 128, 128, 0.25)' }
-                        }), children: [_jsx(TableCell, { sx: { borderBottom: 0 }, style: { whiteSpace: 'nowrap' }, children: t('page.settings.profile.table.groups') }), _jsx(TableCell, { sx: { borderBottom: 0 }, align: "right", width: "100%", colSpan: 2, children: loadingGroups ? _jsx(CircularProgress, { size: 20 }) : _jsx(ChevronRight, { fontSize: "small" }) })] }), _jsx(TableRow, { children: _jsx(TableCell, { colSpan: 3, sx: { paddingTop: '0 !important' }, children: _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('page.settings.profile.table.groups.description') }) }) })] })), _jsxs(TableRow, { children: [_jsx(TableCell, { style: { whiteSpace: 'nowrap' }, children: t('page.settings.profile.table.roles') }), _jsx(TableCell, { width: "100%", colSpan: 2, children: _jsx(Grid, { container: true, direction: "row", spacing: 1, children: config?.lookups?.roles?.map((r) => (_jsx(Grid, { item: true, children: _jsx(Chip, { label: r.toLocaleLowerCase(), color: user?.roles?.includes(r) ? 'primary' : 'default', icon: loading[r] ? (_jsx(CircularProgress, { size: 24 })) : addRole && !user?.roles?.includes(r) ? (_jsx(Add, {})) : user?.roles?.includes(r) ? (removeRole ? null : (_jsx(Check, {}))) : (_jsx(Clear, {})), onClick: addRole && !user?.roles?.includes(r) ? () => wrapChange(r, addRole) : null, onDelete: removeRole && user?.roles?.includes(r) ? () => wrapChange(r, removeRole) : null }) }, r))) }) })] }), howlerPluginStore.plugins.map(plugin => pluginStore.executeFunction(`${plugin}.settings`, 'profile'))] }));
-};
-export default ProfileSection;

package/components/routes/settings/SecuritySection.d.ts

@@ -1,10 +0,0 @@
-import type { HowlerUser } from '@cccsaurora/howler-ui/models/entities/HowlerUser';
-import type { FC } from 'react';
-declare const SecuritySection: FC<{
-    user: HowlerUser;
-    editPassword?: (password: string) => Promise<void>;
-    addApiKey?: () => void;
-    removeApiKey?: (apiKey: [string, string[], string]) => Promise<void>;
-    editQuota?: (quote?: string) => Promise<void>;
-}>;
-export default SecuritySection;

package/components/routes/settings/SecuritySection.js

@@ -1,31 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Add } from '@mui/icons-material';
-import { Chip, Grid, IconButton, TableCell, TableRow } from '@mui/material';
-import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
-import useMyLocalStorage from '@cccsaurora/howler-ui/components/hooks/useMyLocalStorage';
-import dayjs from 'dayjs';
-import howlerPluginStore from '@cccsaurora/howler-ui/plugins/store';
-import { useContext, useMemo } from 'react';
-import { Trans, useTranslation } from 'react-i18next';
-import { usePluginStore } from 'react-pluggable';
-import { StorageKey } from '@cccsaurora/howler-ui/utils/constants';
-import EditRow from '../../elements/EditRow';
-import SettingsSection from './SettingsSection';
-const APIKEY_LABELS = {
-    R: '@cccsaurora/howler-ui/apikey.read',
-    W: '@cccsaurora/howler-ui/apikey.write',
-    E: '@cccsaurora/howler-ui/apikey.extended',
-    I: '@cccsaurora/howler-ui/apikey.impersonate'
-};
-const SecuritySection = ({ user, editPassword, addApiKey, removeApiKey, editQuota }) => {
-    const { t } = useTranslation();
-    const { get } = useMyLocalStorage();
-    const { config } = useContext(ApiConfigContext);
-    const pluginStore = usePluginStore();
-    const isOAuth = useMemo(() => get(StorageKey.APP_TOKEN)?.includes('.'), [get]);
-    return (_jsxs(SettingsSection, { title: t('page.settings.security.title'), colSpan: 3, children: [!isOAuth && editPassword && (_jsx(EditRow, { titleKey: "page.settings.security.table.password", value: "\u25CF\u25CF\u25CF\u25CF\u25CF\u25CF\u25CF\u25CF\u25CF\u25CF\u25CF", onEdit: editPassword, type: "password" })), config?.configuration.auth.allow_apikeys && (_jsxs(TableRow, { sx: { cursor: 'pointer' }, children: [_jsx(TableCell, { style: { whiteSpace: 'nowrap' }, children: t('page.settings.security.table.apikeys') }), _jsx(TableCell, { width: "100%", children: _jsxs(Grid, { container: true, spacing: 1, children: [user?.apikeys?.map(apiKey => (_jsx(Grid, { item: true, children: _jsx(Chip, { label: apiKey[0].toLocaleLowerCase() +
-                                            (apiKey[1].length > 0
-                                                ? ` (${apiKey[1].map(permission => t(APIKEY_LABELS[permission])).join(', ')})`
-                                                : ''), style: { backgroundColor: dayjs.utc(apiKey[2]).isBefore(dayjs().utc()) ? 'orange' : 'default' }, onDelete: removeApiKey ? () => removeApiKey(apiKey) : null }) }, apiKey[0]))), user?.apikeys?.length < 1 && (_jsx(Grid, { item: true, children: _jsx(Trans, { i18nKey: "none" }) }))] }) }), _jsx(TableCell, { align: "right", children: addApiKey && (_jsx(IconButton, { onClick: addApiKey, children: _jsx(Add, { fontSize: "small" }) })) })] })), _jsx(EditRow, { titleKey: "page.settings.security.table.apiquota", descriptionKey: "page.settings.security.table.apiquota.description", value: user?.api_quota, validate: value => value && /^[0-9]*$/m.test(value.toString()), type: "number", onEdit: editQuota }), howlerPluginStore.plugins.map(plugin => pluginStore.executeFunction(`${plugin}.settings`, 'security'))] }));
-};
-export default SecuritySection;

package/components/routes/settings/Settings.d.ts

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

package/components/routes/settings/Settings.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAppUser } from '@cccsaurora/howler-ui/commons/components/app/hooks';
-import UserPageWrapper from '@cccsaurora/howler-ui/components/elements/display/UserPageWrapper';
-import useMyLocalStorage from '@cccsaurora/howler-ui/components/hooks/useMyLocalStorage';
-import useMyUserFunctions from '@cccsaurora/howler-ui/components/hooks/useMyUserFunctions';
-import { useCallback, useMemo } from 'react';
-import { StorageKey } from '@cccsaurora/howler-ui/utils/constants';
-import AdminSection from './AdminSection';
-import LocalSection from './LocalSection';
-import ProfileSection from './ProfileSection';
-import SecuritySection from './SecuritySection';
-const Settings = () => {
-    const { user: currentUser, setUser } = useAppUser();
-    const { editName, editPassword, editQuota, addApiKey, removeApiKey, addRole, removeRole, viewGroups } = useMyUserFunctions();
-    const { get } = useMyLocalStorage();
-    const isOAuth = useMemo(() => get(StorageKey.APP_TOKEN)?.includes('.'), [get]);
-    const currentUserWrapper = useCallback((fn) => {
-        return async (value) => setUser(await fn(currentUser, value));
-    }, [currentUser, setUser]);
-    return (_jsxs(UserPageWrapper, { user: currentUser, children: [_jsx(ProfileSection, { user: currentUser, editName: !isOAuth && currentUserWrapper(editName), addRole: currentUser.is_admin && !isOAuth && currentUserWrapper(addRole), removeRole: currentUser.is_admin && !isOAuth && currentUserWrapper(removeRole), viewGroups: viewGroups }), _jsx(SecuritySection, { user: currentUser, editPassword: editPassword, addApiKey: addApiKey, removeApiKey: currentUserWrapper(removeApiKey), editQuota: currentUser.is_admin && currentUserWrapper(editQuota) }), _jsx(LocalSection, {}), currentUser.roles.includes('admin') && _jsx(AdminSection, {})] }));
-};
-export default Settings;

package/components/routes/settings/SettingsSection.d.ts

@@ -1,7 +0,0 @@
-import type { FC, ReactNode } from 'react';
-declare const SettingsSection: FC<{
-    title: string;
-    colSpan: number;
-    children: ReactNode;
-}>;
-export default SettingsSection;

package/components/routes/settings/SettingsSection.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Paper, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography } from '@mui/material';
-const SettingsSection = ({ title, colSpan, children }) => {
-    return (_jsx(TableContainer, { sx: {
-            '& table tr:last-child td': {
-                borderBottom: 0
-            }
-        }, component: Paper, children: _jsxs(Table, { "aria-label": title, children: [_jsx(TableHead, { children: _jsx(TableRow, { children: _jsx(TableCell, { colSpan: colSpan, children: _jsx(Typography, { variant: "h6", children: title }) }) }) }), _jsx(TableBody, { children: children })] }) }));
-};
-export default SettingsSection;

package/components/routes/templates/TemplateCard.d.ts

@@ -1,7 +0,0 @@
-import type { Template } from '@cccsaurora/howler-ui/models/entities/generated/Template';
-import type { FC } from 'react';
-declare const TemplateCard: FC<{
-    template: Template;
-    className?: string;
-}>;
-export default TemplateCard;

package/components/routes/templates/TemplateCard.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Language, Lock, Person } from '@mui/icons-material';
-import { Card, Divider, Stack, Tooltip, Typography } from '@mui/material';
-import { useTranslation } from 'react-i18next';
-const TemplateCard = ({ template, className }) => {
-    const { t } = useTranslation();
-    return (_jsx(Card, { variant: "outlined", sx: { p: 1, mb: 1 }, className: className, children: _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(Tooltip, { title: t(`route.templates.manager.${template.type}`), children: {
-                        readonly: _jsx(Lock, {}),
-                        global: _jsx(Language, {}),
-                        personal: _jsx(Person, {})
-                    }[template.type] }), _jsx(Divider, { orientation: "vertical", flexItem: true }), _jsxs(Stack, { children: [_jsxs(Typography, { variant: "body1", children: [t(template.analytic), " - ", t(template.detection ?? 'all')] }), template.keys.map(key => (_jsx(Typography, { variant: "caption", sx: { ml: 1 }, children: _jsx("code", { children: key }) }, template.template_id + key)))] })] }) }, template.template_id));
-};
-export default TemplateCard;

package/components/routes/templates/TemplateDnD.d.ts

@@ -1,8 +0,0 @@
-import type { FC } from 'react';
-declare const TemplateDnD: FC<{
-    field?: any;
-    data?: any;
-    onRemove: (field: string) => void;
-    tooltipTitle: any;
-}>;
-export default TemplateDnD;

package/components/routes/templates/TemplateDnD.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useSortable } from '@dnd-kit/sortable';
-import { CSS } from '@dnd-kit/utilities';
-import { Delete, DragHandle } from '@mui/icons-material';
-import { IconButton, Stack, Tooltip, Typography } from '@mui/material';
-import { useTranslation } from 'react-i18next';
-const TemplateDnD = ({ field, data, onRemove, tooltipTitle }) => {
-    const { t } = useTranslation();
-    const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: field });
-    return (_jsxs(Stack, { direction: "row", spacing: 1, ref: setNodeRef, style: { transition, transform: CSS.Transform.toString(transform) }, children: [_jsx(Tooltip, { title: t('button.drag'), ...attributes, ...listeners, children: _jsx(IconButton, { size: "medium", onClick: () => onRemove(field), children: _jsx(DragHandle, { fontSize: "medium" }) }) }), _jsx(Tooltip, { title: tooltipTitle, sx: { alignContent: 'center' }, children: _jsxs(Typography, { variant: "body1", fontWeight: "bold", children: [field, ":"] }) }), _jsx(Typography, { variant: "body1", whiteSpace: "normal", sx: { width: '100%', wordBreak: 'break-all', alignContent: 'center' }, children: data }), _jsx(Tooltip, { title: t('button.delete'), children: _jsx(IconButton, { size: "medium", onClick: () => onRemove(field), sx: { marginLeft: 'auto' }, children: _jsx(Delete, { fontSize: "medium" }) }) })] }));
-};
-export default TemplateDnD;

package/components/routes/templates/TemplateEditor.d.ts

@@ -1,9 +0,0 @@
-import { type Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
-declare const _default: import("react").MemoExoticComponent<({ hit, fields, setFields, onRemove, onAdd }: {
-    hit: Hit;
-    fields: string[];
-    setFields: (displayFields: string[]) => void;
-    onRemove: (field: string) => void;
-    onAdd: (field: string) => void;
-}) => import("react/jsx-runtime").JSX.Element>;
-export default _default;

package/components/routes/templates/TemplateEditor.js

@@ -1,55 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { closestCorners, DndContext } from '@dnd-kit/core';
-import { arrayMove, SortableContext } from '@dnd-kit/sortable';
-import { Add } from '@mui/icons-material';
-import { Button, Stack, Typography } from '@mui/material';
-import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
-import { FieldContext } from '@cccsaurora/howler-ui/components/app/providers/FieldProvider';
-import Phrase from '@cccsaurora/howler-ui/components/elements/addons/search/phrase/Phrase';
-import { get, isObject } from 'lodash-es';
-import {} from '@cccsaurora/howler-ui/models/entities/generated/Hit';
-import { memo, useCallback, useContext, useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import TemplateDnD from './TemplateDnD';
-const TemplateEditor = ({ hit, fields, setFields, onRemove, onAdd }) => {
-    const { t } = useTranslation();
-    const { config } = useContext(ApiConfigContext);
-    const { getHitFields } = useContext(FieldContext);
-    const [phrase, setPhrase] = useState('');
-    const [suggestions, setSuggestions] = useState([]);
-    const tryAddField = useCallback(() => {
-        if (suggestions.includes(phrase)) {
-            if (!fields.includes(phrase)) {
-                onAdd(phrase);
-                setPhrase('');
-            }
-        }
-    }, [fields, onAdd, phrase, suggestions]);
-    const checkForActions = useCallback((e) => {
-        if (e.isEnter) {
-            tryAddField();
-        }
-    }, [tryAddField]);
-    useEffect(() => {
-        getHitFields().then(suggestionFields => setSuggestions(suggestionFields.map(f => f.key)));
-    }, [getHitFields]);
-    const handleDragEnd = useCallback((event) => {
-        const { active, over } = event;
-        if (active.id !== over.id) {
-            const oldIndex = (fields ?? []).findIndex(entry => entry === active.id);
-            const newIndex = (fields ?? []).findIndex(entry => entry === over.id);
-            setFields(arrayMove(fields, oldIndex, newIndex));
-        }
-    }, [fields, setFields]);
-    return (_jsxs(Stack, { spacing: 1, width: "100%", alignItems: "stretch", children: [_jsx(DndContext, { collisionDetection: closestCorners, onDragEnd: handleDragEnd, children: _jsx(SortableContext, { items: (fields ?? []).map(entry => entry), children: fields.map(field => {
-                        let data = get(hit, field);
-                        if (!data) {
-                            data = 'N/A';
-                        }
-                        else if (isObject(data)) {
-                            data = JSON.stringify(data);
-                        }
-                        return (_jsx(TemplateDnD, { field: field, data: data, onRemove: onRemove, tooltipTitle: (config.indexes.hit[field].description ?? t('none')).split('\n')[0] }, field));
-                    }) }) }), _jsxs(Stack, { direction: "row", sx: { '& > div': { flex: 1 } }, spacing: 1, children: [_jsx(Phrase, { suggestions: suggestions, value: phrase, onChange: setPhrase, onKeyDown: checkForActions, size: "small" }), _jsx(Button, { variant: "outlined", size: "small", sx: { marginLeft: 'auto' }, startIcon: _jsx(Add, { fontSize: "small" }), disabled: !suggestions.includes(phrase) || fields.includes(phrase), onClick: tryAddField, children: t('button.add') })] }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('route.templates.prompt') })] }));
-};
-export default memo(TemplateEditor);

package/components/routes/templates/TemplateViewer.d.ts

@@ -1,2 +0,0 @@
-declare const TemplateViewer: () => import("react/jsx-runtime").JSX.Element;
-export default TemplateViewer;

package/components/routes/templates/TemplateViewer.js

@@ -1,156 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Autocomplete, Button, CircularProgress, Divider, FormControl, LinearProgress, Stack, TextField, ToggleButton, ToggleButtonGroup, Tooltip } from '@mui/material';
-import api from '@cccsaurora/howler-ui/api';
-import PageCenter from '@cccsaurora/howler-ui/commons/components/pages/PageCenter';
-import TemplateEditor from '@cccsaurora/howler-ui/components/routes/templates/TemplateEditor';
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Check, Delete, SsidChart } from '@mui/icons-material';
-import AppInfoPanel from '@cccsaurora/howler-ui/commons/components/display/AppInfoPanel';
-import { DEFAULT_FIELDS } from '@cccsaurora/howler-ui/components/elements/hit/HitOutline';
-import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
-import isEqual from 'lodash-es/isEqual';
-import { useSearchParams } from 'react-router-dom';
-import hitsData from '@cccsaurora/howler-ui/utils/hit.json';
-import { sanitizeLuceneQuery } from '@cccsaurora/howler-ui/utils/stringUtils';
-const TemplateViewer = () => {
-    const { t } = useTranslation();
-    const [params, setParams] = useSearchParams();
-    const { dispatchApi } = useMyApi();
-    const [templateList, setTemplateList] = useState([]);
-    const [selectedTemplate, setSelectedTemplate] = useState(null);
-    const [displayFields, setDisplayFields] = useState([]);
-    const [analytics, setAnalytics] = useState([]);
-    const [detections, setDetections] = useState([]);
-    const [analytic, setAnalytic] = useState(params.get('analytic') ?? '');
-    const [detection, setDetection] = useState(params.get('detection') ?? 'ANY');
-    const [type, setType] = useState((params.get('type') ?? 'personal').replace('readonly', 'global'));
-    const [loading, setLoading] = useState(false);
-    const [templateLoading, setTemplateLoading] = useState(false);
-    useEffect(() => {
-        setLoading(true);
-        dispatchApi(api.search.analytic.post({ query: 'analytic_id:*', rows: 1000 }), {
-            logError: false,
-            showError: true,
-            throwError: true
-        })
-            .finally(() => setLoading(false))
-            .then(result => result.items)
-            .then(_analytics => {
-            if (!_analytics.some(_analytic => _analytic.name.toLowerCase() === analytic.toLowerCase())) {
-                setAnalytic('');
-            }
-            setAnalytics(_analytics);
-        });
-        dispatchApi(api.template.get()).then(setTemplateList);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [analytic, dispatchApi]);
-    useEffect(() => {
-        if (!analytic) {
-            return;
-        }
-        setLoading(true);
-        dispatchApi(api.search.grouped.hit.post('howler.detection', {
-            limit: 0,
-            query: `howler.analytic:"${sanitizeLuceneQuery(analytic)}"`
-        }), {
-            logError: false,
-            showError: true,
-            throwError: true
-        })
-            .finally(() => setLoading(false))
-            .then(result => result.items.map(i => i.value))
-            .then(_detections => {
-            if (_detections.length < 1) {
-                setDetection('ANY');
-            }
-            if (detection && !_detections.includes(detection)) {
-                setDetection('ANY');
-            }
-            setDetections(_detections);
-        });
-    }, [analytic, detection, dispatchApi, params, setParams, type]);
-    useEffect(() => {
-        if (analytic && detection) {
-            const template = (templateList ?? []).find(_template => _template.analytic === analytic &&
-                ((detection === 'ANY' && !_template.detection) || _template.detection === detection) &&
-                _template.type === type);
-            if (template) {
-                setSelectedTemplate(template);
-                setDisplayFields(template.keys);
-            }
-            else {
-                setSelectedTemplate(null);
-                setDisplayFields(DEFAULT_FIELDS);
-            }
-        }
-    }, [analytic, detection, templateList, type]);
-    useEffect(() => {
-        if (analytic) {
-            params.set('analytic', analytic);
-        }
-        else {
-            params.delete('analytic');
-        }
-        if (detection && detection !== 'ANY') {
-            params.set('detection', detection);
-        }
-        else {
-            params.delete('detection');
-        }
-        params.set('type', type);
-        params.sort();
-        setParams(params, {
-            replace: true
-        });
-    }, [analytic, detection, params, setParams, type]);
-    const exampleHit = useMemo(() => {
-        const _hit = hitsData.GET[Object.keys(hitsData.GET)[0]];
-        if (analytic) {
-            _hit.howler.analytic = analytic;
-        }
-        return { ..._hit };
-    }, [analytic]);
-    const onDelete = useCallback(async () => {
-        await dispatchApi(api.template.del(selectedTemplate.template_id), {
-            logError: false,
-            showError: true,
-            throwError: false
-        });
-        setSelectedTemplate(null);
-        setDisplayFields(DEFAULT_FIELDS);
-    }, [dispatchApi, selectedTemplate?.template_id]);
-    const onSave = useCallback(async () => {
-        if (analytic && detection) {
-            try {
-                setTemplateLoading(true);
-                const result = await dispatchApi(selectedTemplate
-                    ? api.template.put(selectedTemplate.template_id, displayFields)
-                    : api.template.post({
-                        analytic,
-                        detection: detection !== 'ANY' ? detection : null,
-                        type,
-                        keys: displayFields
-                    }), {
-                    logError: false,
-                    showError: true,
-                    throwError: true
-                });
-                setSelectedTemplate(result);
-                const newList = [result, ...templateList];
-                setTemplateList(newList.filter((v1, i) => newList.findIndex(v2 => v1.template_id === v2.template_id) === i));
-            }
-            finally {
-                setTemplateLoading(false);
-            }
-        }
-    }, [analytic, detection, dispatchApi, displayFields, selectedTemplate, templateList, type]);
-    const analyticOrDetectionMissing = useMemo(() => !analytic || !detection, [analytic, detection]);
-    const noFieldChange = useMemo(() => displayFields.length < 1 || isEqual(selectedTemplate?.keys ?? DEFAULT_FIELDS, displayFields), [displayFields, selectedTemplate?.keys]);
-    return (_jsxs(PageCenter, { maxWidth: "1500px", textAlign: "left", height: "100%", children: [_jsx(LinearProgress, { sx: { mb: 1, opacity: +loading } }), _jsxs(Stack, { direction: "column", spacing: 2, divider: _jsx(Divider, { orientation: "horizontal", flexItem: true }), height: "100%", children: [_jsxs(Stack, { direction: "row", spacing: 2, mb: 2, alignItems: "stretch", children: [_jsx(FormControl, { sx: { flex: 1, maxWidth: '450px' }, children: _jsx(Autocomplete, { id: "analytic", options: analytics.sort((a, b) => a.name.toLowerCase().localeCompare(b.name.toLowerCase())), getOptionLabel: option => option.name, value: analytics.find(a => a.name === analytic) || null, onChange: (__, newValue) => setAnalytic(newValue ? newValue.name : ''), renderInput: autocompleteAnalyticParams => (_jsx(TextField, { ...autocompleteAnalyticParams, label: t('route.templates.analytic'), size: "small" })) }) }), !(detections?.length < 2 && detections[0]?.toLowerCase() === 'rule') ? (_jsx(FormControl, { sx: { flex: 1, maxWidth: '300px' }, disabled: !analytic, children: _jsx(Autocomplete, { id: "detection", options: ['ANY', ...detections.sort()], getOptionLabel: option => option, value: detection ?? '', onChange: (__, newValue) => setDetection(newValue), renderInput: autocompleteDetectionParams => (_jsx(TextField, { ...autocompleteDetectionParams, label: t('route.templates.detection'), size: "small" })) }) })) : (_jsx(Tooltip, { title: t('route.templates.rule.explanation'), children: _jsx(SsidChart, { color: "info", sx: { alignSelf: 'center' } }) })), _jsxs(ToggleButtonGroup, { sx: { display: 'grid', gridTemplateColumns: '1fr 1fr' }, size: "small", exclusive: true, value: type, disabled: analyticOrDetectionMissing, onChange: (__, _type) => {
-                                    if (_type) {
-                                        setType(_type);
-                                    }
-                                }, children: [_jsx(ToggleButton, { sx: { flex: 1 }, value: "personal", "aria-label": "personal", children: t('route.templates.personal') }), _jsx(ToggleButton, { sx: { flex: 1 }, value: "global", "aria-label": "global", children: t('route.templates.global') })] }), selectedTemplate && (_jsx(Button, { variant: "outlined", startIcon: _jsx(Delete, {}), onClick: onDelete, children: t('button.delete') })), _jsx(Button, { variant: "outlined", disabled: analyticOrDetectionMissing || noFieldChange, startIcon: templateLoading ? _jsx(CircularProgress, { size: 16 }) : _jsx(Check, {}), onClick: onSave, children: t(!analyticOrDetectionMissing && !noFieldChange ? 'button.save' : 'button.saved') })] }), analyticOrDetectionMissing ? (_jsx(AppInfoPanel, { i18nKey: "route.templates.select", sx: { width: '100%', alignSelf: 'start' } })) : (_jsx(TemplateEditor, { hit: exampleHit, fields: displayFields, setFields: setDisplayFields, onAdd: field => setDisplayFields([...displayFields, field]), onRemove: field => setDisplayFields(displayFields.filter(f => f !== field)) }))] })] }));
-};
-export default TemplateViewer;

package/components/routes/templates/Templates.d.ts

@@ -1,2 +0,0 @@
-declare const Templates: () => import("react/jsx-runtime").JSX.Element;
-export default Templates;