@cccsaurora/howler-ui 2.14.0-dev.259 → 2.14.0-dev.263

package/components/routes/analytics/AnalyticNotebooks.js

@@ -0,0 +1,138 @@
+import { jsxs, jsx } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
+import { Plagiarism, Label, LinkRounded, Add, Delete } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+icons-material@5.18.0_@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18._b9cf98cd2d466d3b4f338d38bc895c0b/node_modules/@mui/icons-material/esm/index.js";
+import { Stack, Box, Grid, FormControl, InputLabel, Select, MenuItem, InputAdornment, TextField, IconButton, CircularProgress, Divider, Card, Typography, Tooltip } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18.3.23_react@18.3.1__@emotion_19a5ee0476da228d66b5ad5c143bb0c3/node_modules/@mui/material/index.js";
+import { a as api } from "../../../index-BPPnUdfP.js";
+import "../../../commons/components/app/AppContexts.js";
+import { useState, useCallback } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/index.js";
+import "../../../i18n.js";
+import "../../../commons/components/app/hooks/useAppSitemap.js";
+import { useAppUser } from "../../../commons/components/app/hooks/useAppUser.js";
+import FlexOne from "../../elements/addons/layout/FlexOne.js";
+import HowlerAvatar from "../../elements/display/HowlerAvatar.js";
+import HitNotebooks from "../../elements/hit/HitNotebooks.js";
+import useMyApi from "../../hooks/useMyApi.js";
+import { useTranslation } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react-i18next@14.1.3_i18next@23.16.8_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-i18next/dist/es/index.js";
+import { safeStringPropertyCompare } from "../../../utils/stringUtils.js";
+const AnalyticNotebooks = ({
+  analytic,
+  setAnalytic
+}) => {
+  var _a, _b;
+  const { t } = useTranslation();
+  const { dispatchApi } = useMyApi();
+  const { user } = useAppUser();
+  const [loading, setLoading] = useState(false);
+  const [formState, setFormState] = useState({
+    name: "",
+    link: "",
+    detection: ""
+  });
+  const onSubmit = useCallback(async () => {
+    setLoading(true);
+    try {
+      const result = await dispatchApi(
+        api.analytic.notebooks.post(analytic.analytic_id, { ...formState, value: formState.link }),
+        {
+          showError: true,
+          throwError: false,
+          logError: false
+        }
+      );
+      if (result) {
+        setFormState({
+          name: "",
+          link: "",
+          detection: ""
+        });
+        setAnalytic(result);
+      }
+    } finally {
+      setLoading(false);
+    }
+  }, [analytic, dispatchApi, formState, setAnalytic]);
+  const onDelete = useCallback(
+    async (id) => {
+      await dispatchApi(api.analytic.notebooks.del(analytic.analytic_id, [id]));
+      setAnalytic({ ...analytic, notebooks: analytic.notebooks.filter((n) => n.id !== id) });
+    },
+    [analytic, dispatchApi, setAnalytic]
+  );
+  return /* @__PURE__ */ jsxs(Stack, { direction: "column", py: 2, spacing: 1, children: [
+    /* @__PURE__ */ jsx(Box, { sx: { flexGrow: 1 }, children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 1, children: [
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, md: 2, children: /* @__PURE__ */ jsxs(FormControl, { fullWidth: true, children: [
+        /* @__PURE__ */ jsx(InputLabel, { id: "select-label", children: "Detection" }),
+        /* @__PURE__ */ jsxs(
+          Select,
+          {
+            labelId: "select-label",
+            label: "Detection",
+            value: formState.detection,
+            onChange: (ev) => {
+              setFormState({ ...formState, detection: ev.target.value });
+            },
+            startAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx(Plagiarism, {}) }),
+            children: [
+              /* @__PURE__ */ jsx(MenuItem, { value: "", children: t("analytic.notebook.dropdown.none") }),
+              (_a = analytic == null ? void 0 : analytic.detections) == null ? void 0 : _a.map((d) => /* @__PURE__ */ jsx(MenuItem, { value: d, children: d }, d))
+            ]
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, md: 2, children: /* @__PURE__ */ jsx(
+        TextField,
+        {
+          fullWidth: true,
+          label: t("analytic.notebook.name"),
+          value: formState.name,
+          onChange: (ev) => {
+            setFormState({ ...formState, name: ev.currentTarget.value });
+          },
+          InputProps: {
+            startAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx(Label, {}) })
+          }
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, md: 8, children: /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
+        /* @__PURE__ */ jsx(
+          TextField,
+          {
+            fullWidth: true,
+            label: t("analytic.notebook.link"),
+            value: formState.link,
+            onChange: (ev) => {
+              setFormState({ ...formState, link: ev.currentTarget.value });
+            },
+            InputProps: {
+              startAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx(LinkRounded, {}) })
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx(IconButton, { disabled: !formState.link || !formState.name, onClick: () => !loading && onSubmit(), children: loading ? /* @__PURE__ */ jsx(CircularProgress, {}) : /* @__PURE__ */ jsx(Add, {}) })
+      ] }) })
+    ] }) }),
+    /* @__PURE__ */ jsx(Divider, { orientation: "horizontal", flexItem: true }),
+    (_b = analytic == null ? void 0 : analytic.notebooks) == null ? void 0 : _b.sort(safeStringPropertyCompare("detection")).map((n) => {
+      var _a2;
+      return /* @__PURE__ */ jsx(Card, { variant: "outlined", sx: { p: 1, mb: 1 }, children: /* @__PURE__ */ jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, children: [
+        /* @__PURE__ */ jsx(
+          HowlerAvatar,
+          {
+            sx: { width: 24, height: 24, marginRight: "8px !important", marginLeft: "8px !important" },
+            userId: n.user
+          }
+        ),
+        /* @__PURE__ */ jsxs(Stack, { children: [
+          /* @__PURE__ */ jsx(Stack, { direction: "row", alignItems: "center", spacing: 1, children: /* @__PURE__ */ jsx(Typography, { variant: "body1", children: n.name }) }),
+          /* @__PURE__ */ jsx(Typography, { variant: "caption", children: /* @__PURE__ */ jsx("code", { children: n.value }) })
+        ] }),
+        /* @__PURE__ */ jsx(FlexOne, {}),
+        /* @__PURE__ */ jsx(Typography, { variant: "caption", children: n.detection ?? "" }),
+        /* @__PURE__ */ jsx(HitNotebooks, { analytic, selectedNotebook: n.name }),
+        ((n == null ? void 0 : n.user) === user.username || ((_a2 = user.roles) == null ? void 0 : _a2.includes("admin"))) && /* @__PURE__ */ jsx(Tooltip, { title: "Remove", children: /* @__PURE__ */ jsx(IconButton, { onClick: () => onDelete(n.id), children: /* @__PURE__ */ jsx(Delete, {}) }) })
+      ] }) }, n.id);
+    })
+  ] });
+};
+export {
+  AnalyticNotebooks as default
+};

package/components/routes/analytics/AnalyticOverview.d.ts

@@ -0,0 +1,7 @@
+import { Analytic } from '@cccsaurora/howler-ui/models/entities/generated/Analytic';
+import { FC } from 'react';
+declare const AnalyticOverview: FC<{
+    analytic: Analytic;
+    setAnalytic: (a: Analytic) => void;
+}>;
+export default AnalyticOverview;

package/components/routes/analytics/AnalyticOverview.js

@@ -0,0 +1,103 @@
+import { jsxs, Fragment, jsx } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
+import { Check, Edit } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+icons-material@5.18.0_@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18._b9cf98cd2d466d3b4f338d38bc895c0b/node_modules/@mui/icons-material/esm/index.js";
+import { useTheme, useMediaQuery, Divider, Stack, Box, Typography, IconButton, CircularProgress, TextField, Skeleton, Alert, AlertTitle, Card, CardContent } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18.3.23_react@18.3.1__@emotion_19a5ee0476da228d66b5ad5c143bb0c3/node_modules/@mui/material/index.js";
+import { a as api } from "../../../index-BPPnUdfP.js";
+import "/home/runner/work/howler/howler/ui/node_modules/.pnpm/chartjs-adapter-dayjs-4@1.0.4_chart.js@4.5.0_dayjs@1.11.13/node_modules/chartjs-adapter-dayjs-4/dist/chartjs-adapter-dayjs-4.esm.js";
+import Markdown from "../../elements/display/Markdown.js";
+import useMyApi from "../../hooks/useMyApi.js";
+import useMySnackbar from "../../hooks/useMySnackbar.js";
+import { useState, useEffect, useCallback } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/index.js";
+import { useTranslation } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react-i18next@14.1.3_i18next@23.16.8_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-i18next/dist/es/index.js";
+import { sanitizeLuceneQuery } from "../../../utils/stringUtils.js";
+import Assessment from "./widgets/Assessment.js";
+import Created from "./widgets/Created.js";
+import Detection from "./widgets/Detection.js";
+import Escalation from "./widgets/Escalation.js";
+import Status from "./widgets/Status.js";
+const AnalyticOverview = ({
+  analytic,
+  setAnalytic
+}) => {
+  const { t } = useTranslation();
+  const theme = useTheme();
+  const { dispatchApi } = useMyApi();
+  const isMd = useMediaQuery(theme.breakpoints.down("md"));
+  const { showSuccessMessage } = useMySnackbar();
+  const [loading, setLoading] = useState(true);
+  const [markdownLoading, setMarkdownLoading] = useState(false);
+  const [editing, setEditing] = useState(false);
+  const [empty, setEmpty] = useState(false);
+  const [editValue, setEditValue] = useState("");
+  useEffect(() => {
+    if (!analytic) {
+      return;
+    }
+    setLoading(true);
+    api.search.count.hit.post({ query: `howler.analytic:"${sanitizeLuceneQuery(analytic.name)}"` }).then(({ count }) => setEmpty(!count)).finally(() => setLoading(false));
+  }, [analytic]);
+  const onEdit = useCallback(async () => {
+    try {
+      if (editing) {
+        setMarkdownLoading(true);
+        const result = await dispatchApi(api.analytic.put(analytic.analytic_id, { description: editValue }), {
+          showError: true,
+          throwError: true
+        });
+        setAnalytic(result);
+        showSuccessMessage(t("route.analytics.updated"));
+      } else {
+        setEditValue(analytic.description);
+      }
+    } finally {
+      setEditing(!editing);
+      setMarkdownLoading(false);
+    }
+  }, [analytic, dispatchApi, editValue, editing, setAnalytic, showSuccessMessage, t]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Divider, { flexItem: true, sx: { mt: 1 } }),
+    /* @__PURE__ */ jsxs(
+      Stack,
+      {
+        spacing: 2,
+        direction: isMd ? "column" : "row",
+        divider: /* @__PURE__ */ jsx(Divider, { orientation: isMd ? "horizontal" : "vertical", flexItem: true }),
+        sx: { flex: 1, "& > div": { flex: 1 } },
+        children: [
+          /* @__PURE__ */ jsxs(Box, { sx: { maxWidth: "50%", overflow: "auto" }, children: [
+            /* @__PURE__ */ jsxs(Typography, { variant: "h5", sx: { mt: 2, mb: 1, display: "flex", flexDirection: "row" }, children: [
+              t("route.analytics.overview.description"),
+              /* @__PURE__ */ jsx(IconButton, { sx: { marginLeft: "auto" }, disabled: markdownLoading, onClick: onEdit, children: markdownLoading ? /* @__PURE__ */ jsx(CircularProgress, { size: 20 }) : editing ? /* @__PURE__ */ jsx(Check, { fontSize: "small" }) : /* @__PURE__ */ jsx(Edit, { fontSize: "small" }) })
+            ] }),
+            editing ? /* @__PURE__ */ jsx(
+              TextField,
+              {
+                value: editValue,
+                onChange: (e) => setEditValue(e.target.value),
+                fullWidth: true,
+                multiline: true,
+                minRows: 30,
+                sx: { "& textarea": { fontFamily: "monospace", fontSize: 13 } }
+              }
+            ) : /* @__PURE__ */ jsx(Markdown, { md: analytic == null ? void 0 : analytic.description })
+          ] }),
+          /* @__PURE__ */ jsxs(Stack, { direction: "column", spacing: 2, children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "h5", sx: { mt: `${theme.spacing(2)} !important` }, children: t("route.analytics.overview.statistics") }),
+            loading ? /* @__PURE__ */ jsx(Skeleton, { variant: "rounded", width: "100%", height: "90px" }) : empty ? /* @__PURE__ */ jsxs(Alert, { variant: "outlined", severity: "warning", children: [
+              /* @__PURE__ */ jsx(AlertTitle, { children: t("route.analytics.overview.empty.title") }),
+              t("route.analytics.overview.empty.description")
+            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Created, { analytic }) }) }),
+              /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, { sx: { display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ jsx(Escalation, { analytic }) }) }),
+              /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Assessment, { analytic }) }) }),
+              /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Status, { analytic }) }) }),
+              /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Detection, { analytic }) }) })
+            ] })
+          ] })
+        ]
+      }
+    )
+  ] });
+};
+export {
+  AnalyticOverview as default
+};

package/components/routes/analytics/AnalyticOverviews.d.ts

@@ -0,0 +1,6 @@
+import { Analytic } from '@cccsaurora/howler-ui/models/entities/generated/Analytic';
+import { FC } from 'react';
+declare const AnalyticOverviews: FC<{
+    analytic: Analytic;
+}>;
+export default AnalyticOverviews;

package/components/routes/analytics/AnalyticOverviews.js

@@ -0,0 +1,72 @@
+import { jsx, jsxs } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
+import { Article } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+icons-material@5.18.0_@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18._b9cf98cd2d466d3b4f338d38bc895c0b/node_modules/@mui/icons-material/esm/index.js";
+import { useMediaQuery, Skeleton, Stack, Fab, Typography, Box } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18.3.23_react@18.3.1__@emotion_19a5ee0476da228d66b5ad5c143bb0c3/node_modules/@mui/material/index.js";
+import "/home/runner/work/howler/howler/ui/node_modules/.pnpm/chartjs-adapter-dayjs-4@1.0.4_chart.js@4.5.0_dayjs@1.11.13/node_modules/chartjs-adapter-dayjs-4/dist/chartjs-adapter-dayjs-4.esm.js";
+import AppListEmpty from "../../../commons/components/display/AppListEmpty.js";
+import { OverviewContext } from "../../app/providers/OverviewProvider.js";
+import { useContext, useMemo, useState, useEffect } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/index.js";
+import { useTranslation } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react-i18next@14.1.3_i18next@23.16.8_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-i18next/dist/es/index.js";
+import { Link } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react-router-dom@6.30.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-router-dom/dist/index.js";
+import OverviewCard from "../overviews/OverviewCard.js";
+const AnalyticOverviews = ({ analytic }) => {
+  const { t } = useTranslation();
+  const isNarrow = useMediaQuery("(max-width: 1800px)");
+  const { getOverviews, overviews } = useContext(OverviewContext);
+  const matchingOverviews = useMemo(
+    () => overviews.filter((_overview) => _overview.analytic === (analytic == null ? void 0 : analytic.name)),
+    [analytic == null ? void 0 : analytic.name, overviews]
+  );
+  const [loading, setLoading] = useState(false);
+  useEffect(() => {
+    setLoading(true);
+    getOverviews().finally(() => setLoading(false));
+  }, [getOverviews]);
+  if (!analytic) {
+    return /* @__PURE__ */ jsx(Skeleton, { variant: "rounded", width: "100%", sx: { minHeight: "300px", mt: 2 } });
+  }
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 1, position: "relative", children: [
+    /* @__PURE__ */ jsxs(
+      Fab,
+      {
+        component: Link,
+        to: `/overviews/view?analytic=${analytic.name}`,
+        variant: "extended",
+        size: "large",
+        color: "primary",
+        sx: (theme) => ({
+          textTransform: "none",
+          position: isNarrow ? "fixed" : "absolute",
+          right: isNarrow ? theme.spacing(2) : `calc(100% + ${theme.spacing(5)})`,
+          whiteSpace: "nowrap",
+          ...isNarrow ? { bottom: theme.spacing(1) } : { top: theme.spacing(2) }
+        }),
+        children: [
+          /* @__PURE__ */ jsx(Article, { sx: { mr: 1 } }),
+          /* @__PURE__ */ jsx(Typography, { children: t("route.overviews.create") })
+        ]
+      }
+    ),
+    loading && /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: "175px" }),
+    !loading && matchingOverviews.length < 1 && /* @__PURE__ */ jsx(AppListEmpty, {}),
+    matchingOverviews.map((overview) => /* @__PURE__ */ jsx(
+      Box,
+      {
+        component: Link,
+        to: `/overviews/view?analytic=${overview.analytic}${overview.detection ? "&template=" + overview.detection : ""}`,
+        sx: (theme) => ({
+          textDecoration: "none",
+          "& > .MuiCard-root": {
+            cursor: "pointer",
+            transition: theme.transitions.create("border-color"),
+            "&:hover": { borderColor: "primary.main" }
+          }
+        }),
+        children: /* @__PURE__ */ jsx(OverviewCard, { overview })
+      },
+      overview.overview_id
+    ))
+  ] });
+};
+export {
+  AnalyticOverviews as default
+};

package/components/routes/analytics/AnalyticSearch.d.ts

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

package/components/routes/analytics/AnalyticSearch.js

@@ -0,0 +1,233 @@
+import { jsx, jsxs, Fragment } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
+import { SsidChart, Star, StarBorder } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+icons-material@5.18.0_@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18._b9cf98cd2d466d3b4f338d38bc895c0b/node_modules/@mui/icons-material/esm/index.js";
+import { useTheme, Card, CardHeader, Stack, Tooltip, Divider, AvatarGroup, IconButton, CardContent, Grid, Chip, Typography, InputAdornment } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18.3.23_react@18.3.1__@emotion_19a5ee0476da228d66b5ad5c143bb0c3/node_modules/@mui/material/index.js";
+import { a as api } from "../../../index-BPPnUdfP.js";
+import "../../../commons/components/app/AppContexts.js";
+import { useContext, useState, useCallback, useEffect } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/index.js";
+import "../../../i18n.js";
+import "../../../commons/components/app/hooks/useAppSitemap.js";
+import { useAppUser } from "../../../commons/components/app/hooks/useAppUser.js";
+import useLocalStorageItem from "../../../commons/components/utils/hooks/useLocalStorageItem.js";
+import FlexOne from "../../elements/addons/layout/FlexOne.js";
+import "../../../TuiList-D7-CH2oS.js";
+import TuiListProvider, { TuiListMethodContext } from "../../elements/addons/lists/TuiListProvider.js";
+import HowlerAvatar from "../../elements/display/HowlerAvatar.js";
+import ItemManager from "../../elements/display/ItemManager.js";
+import useMyApi from "../../hooks/useMyApi.js";
+import { useMyLocalStorageItem } from "../../hooks/useMyLocalStorage.js";
+import { useTranslation } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react-i18next@14.1.3_i18next@23.16.8_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-i18next/dist/es/index.js";
+import { useNavigate, useSearchParams } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react-router-dom@6.30.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-router-dom/dist/index.js";
+import { StorageKey } from "../../../utils/constants.js";
+import { sanitizeLuceneQuery } from "../../../utils/stringUtils.js";
+const AnalyticSearchBase = () => {
+  var _a, _b;
+  const theme = useTheme();
+  const navigate = useNavigate();
+  const { t } = useTranslation();
+  const { dispatchApi } = useMyApi();
+  const { load } = useContext(TuiListMethodContext);
+  const [searchParams, setSearchParams] = useSearchParams();
+  const pageCount = useMyLocalStorageItem(StorageKey.PAGE_COUNT, 25)[0];
+  const appUser = useAppUser();
+  const [onlyRules, setOnlyRules] = useLocalStorageItem(StorageKey.ONLY_RULES, 0);
+  const [searching, setSearching] = useState(false);
+  const [hasError, setHasError] = useState(false);
+  const [phrase, setPhrase] = useState(searchParams.get("phrase") || "");
+  const [offset, setOffset] = useState(parseInt(searchParams.get("offset")) || 0);
+  const [response, setResponse] = useState(null);
+  const addFavourite = useCallback(
+    async (analytic) => {
+      await dispatchApi(api.analytic.favourite.post(analytic.analytic_id));
+      appUser.setUser({
+        ...appUser.user,
+        favourite_analytics: [...appUser.user.favourite_analytics, analytic.analytic_id]
+      });
+    },
+    [appUser, dispatchApi]
+  );
+  const removeFavourite = useCallback(
+    async (analytic) => {
+      await dispatchApi(api.analytic.favourite.del(analytic.analytic_id));
+      appUser.setUser({
+        ...appUser.user,
+        favourite_analytics: appUser.user.favourite_analytics.filter((v) => v !== analytic.analytic_id)
+      });
+    },
+    [appUser, dispatchApi]
+  );
+  const onSearch = useCallback(async () => {
+    setSearching(true);
+    setHasError(false);
+    if (phrase) {
+      searchParams.set("phrase", phrase);
+    } else {
+      searchParams.delete("phrase");
+    }
+    setSearchParams(searchParams, { replace: true });
+    try {
+      const sanitizedPhrase = sanitizeLuceneQuery(phrase);
+      const _response = await dispatchApi(
+        api.search.analytic.post({
+          query: `name:*${sanitizedPhrase}* OR detections:*${sanitizedPhrase}*` + (onlyRules > 0 ? " AND _exists_:rule_type" : onlyRules < 0 ? " AND -_exists_:rule_type" : ""),
+          rows: pageCount,
+          offset
+        })
+      );
+      setResponse(_response);
+      load(_response.items.map((u) => ({ id: u.analytic_id, item: u })));
+    } catch (e) {
+      setHasError(true);
+    } finally {
+      setSearching(false);
+    }
+  }, [dispatchApi, load, offset, onlyRules, pageCount, phrase, searchParams, setSearchParams]);
+  const onPageChange = useCallback(
+    (_offset) => {
+      if (_offset !== offset) {
+        searchParams.set("offset", _offset.toString());
+        setSearchParams(searchParams, { replace: true });
+        setOffset(_offset);
+      }
+    },
+    [offset, searchParams, setSearchParams]
+  );
+  const onFavourite = useCallback(
+    async (event, analytic) => {
+      var _a2;
+      event.preventDefault();
+      event.stopPropagation();
+      if ((_a2 = appUser.user) == null ? void 0 : _a2.favourite_analytics.includes(analytic.analytic_id)) {
+        await dispatchApi(removeFavourite(analytic));
+      } else {
+        await dispatchApi(addFavourite(analytic));
+      }
+    },
+    [addFavourite, (_a = appUser.user) == null ? void 0 : _a.favourite_analytics, dispatchApi, removeFavourite]
+  );
+  useEffect(
+    () => {
+      onSearch();
+      if (!searchParams.has("offset")) {
+        searchParams.set("offset", "0");
+        setSearchParams(searchParams, { replace: true });
+      }
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [onlyRules]
+  );
+  useEffect(() => {
+    if ((response == null ? void 0 : response.total) <= offset) {
+      setOffset(0);
+      searchParams.set("offset", "0");
+      setSearchParams(searchParams, { replace: true });
+    }
+  }, [offset, response == null ? void 0 : response.total, searchParams, setSearchParams]);
+  useEffect(() => {
+    if (!searching) {
+      onSearch();
+    }
+  }, [offset]);
+  const renderer = useCallback(
+    ({ item }, classRenderer) => {
+      var _a2, _b2, _c;
+      const filteredContributors = (item.item.contributors ?? []).filter(
+        (contributor) => contributor !== item.item.owner
+      );
+      return /* @__PURE__ */ jsxs(
+        Card,
+        {
+          onClick: () => navigate(`/analytics/${item.item.analytic_id}`),
+          variant: "outlined",
+          className: classRenderer(),
+          sx: {
+            "&:hover": { borderColor: "primary.main" },
+            transitionProperty: "border-color",
+            cursor: "pointer",
+            mt: 1
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              CardHeader,
+              {
+                title: /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
+                  /* @__PURE__ */ jsx("span", { children: item.item.name }),
+                  item.item.rule_type && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(Tooltip, { title: t("route.analytics.rule"), children: /* @__PURE__ */ jsx(SsidChart, { color: "info" }) }),
+                    /* @__PURE__ */ jsx(
+                      "code",
+                      {
+                        style: {
+                          fontSize: ".55em",
+                          backgroundColor: theme.palette.background.paper,
+                          padding: theme.spacing(0.5),
+                          borderRadius: theme.shape.borderRadius,
+                          border: `thin solid ${theme.palette.divider}`
+                        },
+                        children: item.item.rule_type
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsx(FlexOne, {}),
+                  /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, sx: { mt: 1 }, children: [
+                    item.item.owner && /* @__PURE__ */ jsx(HowlerAvatar, { sx: { width: 24, height: 24 }, userId: item.item.owner }),
+                    filteredContributors.length > 0 && /* @__PURE__ */ jsx(Divider, { orientation: "vertical", flexItem: true }),
+                    /* @__PURE__ */ jsx(AvatarGroup, { children: filteredContributors.map((contributor) => /* @__PURE__ */ jsx(HowlerAvatar, { sx: { width: 24, height: 24 }, userId: contributor }, contributor)) })
+                  ] }),
+                  /* @__PURE__ */ jsx(Tooltip, { title: t("button.pin"), children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: (e) => onFavourite(e, item.item), children: ((_b2 = (_a2 = appUser.user) == null ? void 0 : _a2.favourite_analytics) == null ? void 0 : _b2.includes(item.item.analytic_id)) ? /* @__PURE__ */ jsx(Star, {}) : /* @__PURE__ */ jsx(StarBorder, {}) }) })
+                ] })
+              }
+            ),
+            ((_c = item.item.detections) == null ? void 0 : _c.length) > 0 && /* @__PURE__ */ jsx(CardContent, { sx: { paddingTop: 0 }, children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 0.5, sx: { marginTop: `${theme.spacing(-0.5)} !important` }, children: [
+              item.item.detections.slice(0, 5).map((d) => /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(Chip, { size: "small", variant: "outlined", label: d }) }, d)),
+              item.item.detections.length > 5 && /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
+                Tooltip,
+                {
+                  title: /* @__PURE__ */ jsx(Stack, { children: item.item.detections.slice(5).map((d) => /* @__PURE__ */ jsx("span", { children: d }, d)) }),
+                  children: /* @__PURE__ */ jsx(Chip, { size: "small", variant: "outlined", label: `+ ${item.item.detections.length - 5}` })
+                }
+              ) })
+            ] }) })
+          ]
+        },
+        item.item.name
+      );
+    },
+    [(_b = appUser.user) == null ? void 0 : _b.favourite_analytics, navigate, onFavourite, t, theme]
+  );
+  return /* @__PURE__ */ jsx(
+    ItemManager,
+    {
+      onSearch,
+      onPageChange,
+      phrase,
+      setPhrase,
+      hasError,
+      searching,
+      searchAdornment: /* @__PURE__ */ jsx(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx(
+        Tooltip,
+        {
+          title: t(
+            `route.analytics.search.filter.rules.${onlyRules < 0 ? "hide" : onlyRules > 0 ? "show" : "toggle"}`
+          ),
+          children: /* @__PURE__ */ jsx(IconButton, { onClick: () => setOnlyRules((onlyRules + 2) % 3 - 1), children: /* @__PURE__ */ jsx(
+            SsidChart,
+            {
+              color: onlyRules < 0 ? "error" : onlyRules > 0 ? "info" : "inherit",
+              sx: { transition: theme.transitions.create(["color"]) }
+            }
+          ) })
+        }
+      ) }),
+      aboveSearch: /* @__PURE__ */ jsx(Typography, { sx: { fontStyle: "italic", color: theme.palette.text.disabled, mb: 0.5 }, variant: "body2", children: t("route.analytics.search.prompt") }),
+      renderer,
+      response,
+      searchPrompt: "route.analytics.manager.search"
+    }
+  );
+};
+const AnalyticSearch = () => {
+  return /* @__PURE__ */ jsx(TuiListProvider, { children: /* @__PURE__ */ jsx(AnalyticSearchBase, {}) });
+};
+export {
+  AnalyticSearch as default
+};

package/components/routes/analytics/AnalyticTemplates.d.ts

@@ -0,0 +1,6 @@
+import { Analytic } from '@cccsaurora/howler-ui/models/entities/generated/Analytic';
+import { FC } from 'react';
+declare const AnalyticTemplates: FC<{
+    analytic: Analytic;
+}>;
+export default AnalyticTemplates;

package/components/routes/analytics/AnalyticTemplates.js

@@ -0,0 +1,70 @@
+import { jsx, jsxs } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
+import { Article } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+icons-material@5.18.0_@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18._b9cf98cd2d466d3b4f338d38bc895c0b/node_modules/@mui/icons-material/esm/index.js";
+import { useMediaQuery, Skeleton, Stack, Fab, Typography, Box } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/@mui+material@5.18.0_@emotion+react@11.14.0_@types+react@18.3.23_react@18.3.1__@emotion_19a5ee0476da228d66b5ad5c143bb0c3/node_modules/@mui/material/index.js";
+import { a as api } from "../../../index-BPPnUdfP.js";
+import "/home/runner/work/howler/howler/ui/node_modules/.pnpm/chartjs-adapter-dayjs-4@1.0.4_chart.js@4.5.0_dayjs@1.11.13/node_modules/chartjs-adapter-dayjs-4/dist/chartjs-adapter-dayjs-4.esm.js";
+import AppListEmpty from "../../../commons/components/display/AppListEmpty.js";
+import useMyApi from "../../hooks/useMyApi.js";
+import { useState, useEffect } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/index.js";
+import { useTranslation } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react-i18next@14.1.3_i18next@23.16.8_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-i18next/dist/es/index.js";
+import { Link } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react-router-dom@6.30.1_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-router-dom/dist/index.js";
+import TemplateCard from "../templates/TemplateCard.js";
+const AnalyticTemplates = ({ analytic }) => {
+  const { t } = useTranslation();
+  const isNarrow = useMediaQuery("(max-width: 1800px)");
+  const { dispatchApi } = useMyApi();
+  const [templates, setTemplates] = useState([]);
+  const [loading, setLoading] = useState(false);
+  useEffect(() => {
+    setLoading(true);
+    dispatchApi(api.template.get()).then((_templates) => _templates.filter((_template) => _template.analytic === (analytic == null ? void 0 : analytic.name))).then(setTemplates).finally(() => setLoading(false));
+  }, [analytic == null ? void 0 : analytic.name, dispatchApi]);
+  if (!analytic) {
+    return /* @__PURE__ */ jsx(Skeleton, { variant: "rounded", width: "100%", sx: { minHeight: "300px", mt: 2 } });
+  }
+  return /* @__PURE__ */ jsxs(Stack, { spacing: 1, position: "relative", children: [
+    /* @__PURE__ */ jsxs(
+      Fab,
+      {
+        component: Link,
+        to: `/templates/view?analytic=${analytic.name}`,
+        variant: "extended",
+        size: "large",
+        color: "primary",
+        sx: (theme) => ({
+          textTransform: "none",
+          position: isNarrow ? "fixed" : "absolute",
+          right: isNarrow ? theme.spacing(2) : `calc(100% + ${theme.spacing(5)})`,
+          whiteSpace: "nowrap",
+          ...isNarrow ? { bottom: theme.spacing(1) } : { top: theme.spacing(2) }
+        }),
+        children: [
+          /* @__PURE__ */ jsx(Article, { sx: { mr: 1 } }),
+          /* @__PURE__ */ jsx(Typography, { children: t("route.templates.create") })
+        ]
+      }
+    ),
+    loading && /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: "175px" }),
+    !loading && templates.length < 1 && /* @__PURE__ */ jsx(AppListEmpty, {}),
+    templates.map((template) => /* @__PURE__ */ jsx(
+      Box,
+      {
+        component: Link,
+        to: `/templates/view?analytic=${template.analytic}${template.detection ? "&template=" + template.detection : ""}&type=${template.type}`,
+        sx: (theme) => ({
+          textDecoration: "none",
+          "& > .MuiCard-root": {
+            cursor: "pointer",
+            transition: theme.transitions.create("border-color"),
+            "&:hover": { borderColor: "primary.main" }
+          }
+        }),
+        children: /* @__PURE__ */ jsx(TemplateCard, { template })
+      },
+      template.template_id
+    ))
+  ] });
+};
+export {
+  AnalyticTemplates as default
+};