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

package/components/elements/hit/HitComments.js

@@ -1,280 +0,0 @@
-import { jsxs, jsx, Fragment } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
-import { KeyboardArrowDown, Clear, Send } 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 { Accordion, AccordionSummary, Typography, AccordionDetails, Stack, Chip, TextField, AvatarGroup, IconButton, Skeleton } 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, useRef, useMemo, useEffect, 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 useMatchers from "../../app/hooks/useMatchers.js";
-import { SocketContext } from "../../app/providers/SocketProvider.js";
-import FlexOne from "../addons/layout/FlexOne.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 { useNavigate } 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 { sortByTimestamp, compareTimestamp } from "../../../utils/utils.js";
-import Comment from "../Comment.js";
-import HowlerAvatar from "../display/HowlerAvatar.js";
-import TypingIndicator from "../display/TypingIndicator.js";
-const MAX_LENGTH = 5e3;
-const HitComments = ({ hit, users }) => {
-  var _a, _b, _c, _d, _e, _f;
-  const { user } = useAppUser();
-  const { t } = useTranslation();
-  const navigate = useNavigate();
-  const { dispatchApi } = useMyApi();
-  const { addListener, removeListener, emit } = useContext(SocketContext);
-  const { getMatchingAnalytic } = useMatchers();
-  const [typers, setTypers] = useState([]);
-  const [loading, setLoading] = useState(false);
-  const [showClear, setShowClear] = useState(false);
-  const [length, setLength] = useState(0);
-  const [analyticId, setAnalyticId] = useState();
-  const [analyticComments, setAnalyticComments] = useState([]);
-  const [comments, setComments] = useState(sortByTimestamp((_a = hit == null ? void 0 : hit.howler) == null ? void 0 : _a.comment));
-  const input = useRef();
-  const handler = useMemo(
-    () => (data) => {
-      var _a2, _b2, _c2, _d2, _e2;
-      if (((_a2 = data.event) == null ? void 0 : _a2.action) === "typing" && ((_b2 = data.event) == null ? void 0 : _b2.username) !== user.username && !typers.includes((_c2 = data.event) == null ? void 0 : _c2.username)) {
-        setTypers([...typers, data.event.username]);
-      } else if (((_d2 = data.event) == null ? void 0 : _d2.action) === "stop_typing" && ((_e2 = data.event) == null ? void 0 : _e2.username) !== user.username) {
-        setTypers(typers.filter((typer) => typer !== data.event.username));
-      }
-    },
-    [typers, user.username]
-  );
-  useEffect(() => {
-    addListener("hitComments", handler);
-    return () => removeListener("hitComments");
-  }, [handler]);
-  useEffect(() => {
-    var _a2;
-    if ((_a2 = hit == null ? void 0 : hit.howler) == null ? void 0 : _a2.analytic) {
-      getMatchingAnalytic(hit).then((analytic) => {
-        setAnalyticId(analytic == null ? void 0 : analytic.analytic_id);
-        setAnalyticComments(sortByTimestamp((analytic == null ? void 0 : analytic.comment) ?? []));
-      });
-    }
-  }, [getMatchingAnalytic, (_b = hit == null ? void 0 : hit.howler) == null ? void 0 : _b.analytic]);
-  const onSubmit = useCallback(async () => {
-    var _a2;
-    if (!((_a2 = input.current) == null ? void 0 : _a2.value) || !hit || input.current.value.length > MAX_LENGTH) return;
-    setLoading(true);
-    try {
-      const result = await dispatchApi(api.hit.comments.post(hit.howler.id, input.current.value), {
-        showError: true,
-        throwError: true,
-        logError: false
-      });
-      setComments(sortByTimestamp(result.howler.comment));
-      input.current.value = "";
-      setShowClear(false);
-    } finally {
-      setLoading(false);
-    }
-  }, [dispatchApi, hit]);
-  const onFocus = useCallback(
-    () => {
-      var _a2;
-      return emit({
-        broadcast: true,
-        action: "typing",
-        id: (_a2 = hit == null ? void 0 : hit.howler) == null ? void 0 : _a2.id
-      });
-    },
-    [emit, (_c = hit == null ? void 0 : hit.howler) == null ? void 0 : _c.id]
-  );
-  const onBlur = useCallback(
-    () => {
-      var _a2;
-      return emit({
-        broadcast: true,
-        action: "stop_typing",
-        id: (_a2 = hit == null ? void 0 : hit.howler) == null ? void 0 : _a2.id
-      });
-    },
-    [emit, (_d = hit == null ? void 0 : hit.howler) == null ? void 0 : _d.id]
-  );
-  const onClear = useCallback(() => {
-    input.current.value = "";
-    setShowClear(false);
-  }, []);
-  const checkForSubmit = useCallback(
-    (e) => {
-      var _a2;
-      e.stopPropagation();
-      if ((_a2 = input.current) == null ? void 0 : _a2.value) {
-        setShowClear(true);
-        setLength(input.current.value.length);
-      }
-      if (e.ctrlKey && e.key === "Enter" && !loading) {
-        onSubmit();
-      }
-    },
-    [loading, onSubmit]
-  );
-  const checkLength = useCallback(() => {
-    var _a2;
-    return setLength((_a2 = input.current) == null ? void 0 : _a2.value.length);
-  }, []);
-  const handleDelete = useCallback(
-    async (commentId) => {
-      await dispatchApi(api.hit.comments.del(hit.howler.id, [commentId]), { throwError: true, showError: true });
-      setComments(comments.filter((cmt) => cmt.id !== commentId));
-    },
-    [comments, dispatchApi, (_e = hit == null ? void 0 : hit.howler) == null ? void 0 : _e.id]
-  );
-  const handleEdit = useCallback(
-    async (commentId, editValue) => {
-      await dispatchApi(api.hit.comments.put(hit.howler.id, commentId, editValue), {
-        throwError: true,
-        showError: true
-      });
-      setComments(comments.map((cmt) => cmt.id !== commentId ? cmt : { ...cmt, value: editValue }));
-    },
-    [comments, dispatchApi, (_f = hit == null ? void 0 : hit.howler) == null ? void 0 : _f.id]
-  );
-  const handleQuote = useCallback((value) => {
-    if (input.current) {
-      input.current.value = `${input.current.value.trimStart()}
-
-${value.split("\n").map((l) => "> " + l).join("\n")}
-
-`.trimStart();
-      setTimeout(() => {
-        input.current.focus();
-        input.current.selectionStart = input.current.selectionEnd = input.current.value.length;
-      }, 10);
-    }
-  }, []);
-  const handleReact = useCallback(
-    async (commentId, type) => {
-      if (type) {
-        await dispatchApi(api.hit.comments.react.put(hit.howler.id, commentId, type));
-        setComments(
-          comments.map(
-            (cmt) => cmt.id !== commentId ? cmt : { ...cmt, reactions: { ...(cmt == null ? void 0 : cmt.reactions) ?? {}, [user.username]: type } }
-          )
-        );
-      } else {
-        await dispatchApi(api.hit.comments.react.del(hit.howler.id, commentId));
-        setComments(
-          comments.map(
-            (cmt) => cmt.id !== commentId ? cmt : { ...cmt, reactions: { ...(cmt == null ? void 0 : cmt.reactions) ?? {}, [user.username]: void 0 } }
-          )
-        );
-      }
-    },
-    [comments, dispatchApi, hit == null ? void 0 : hit.howler.id, user.username]
-  );
-  useEffect(() => {
-    var _a2, _b2;
-    if ((_a2 = hit == null ? void 0 : hit.howler) == null ? void 0 : _a2.comment) {
-      setComments((_b2 = hit == null ? void 0 : hit.howler) == null ? void 0 : _b2.comment.slice().sort((a, b) => compareTimestamp(b.timestamp, a.timestamp)));
-    } else if (!hit) {
-      setComments([]);
-    }
-  }, [hit]);
-  const renderedAnalyticComments = useMemo(() => {
-    if (analyticComments.length < 1) {
-      return null;
-    }
-    const displayedComments = analyticComments.filter((c) => !c.detection || c.detection === (hit == null ? void 0 : hit.howler.detection));
-    return /* @__PURE__ */ jsxs(Accordion, { variant: "outlined", children: [
-      /* @__PURE__ */ jsx(AccordionSummary, { expandIcon: /* @__PURE__ */ jsx(KeyboardArrowDown, { fontSize: "small" }), children: /* @__PURE__ */ jsx(Typography, { variant: "body1", children: t("comments.analytic", { count: displayedComments.length }) }) }),
-      /* @__PURE__ */ jsx(AccordionDetails, { children: /* @__PURE__ */ jsx(Stack, { spacing: 1, children: displayedComments.map((c) => {
-        var _a2;
-        return /* @__PURE__ */ jsx(
-          Comment,
-          {
-            comment: c,
-            extra: /* @__PURE__ */ jsx(
-              Chip,
-              {
-                size: "small",
-                variant: "outlined",
-                onClick: () => navigate(
-                  "/analytics" + (analyticId ? `/${analyticId}?tab=comments` + (c.detection ? `&filter=${c.detection}` : "") : "")
-                ),
-                sx: (theme) => ({ marginLeft: "0 !important", mr: `${theme.spacing(2)} !important` }),
-                label: `${((_a2 = hit == null ? void 0 : hit.howler) == null ? void 0 : _a2.analytic) ?? "Analytic"}${c.detection ? " - " + c.detection : ""}`
-              }
-            ),
-            users
-          },
-          c.id
-        );
-      }) }) })
-    ] });
-  }, [analyticComments, analyticId, hit == null ? void 0 : hit.howler.analytic, hit == null ? void 0 : hit.howler.detection, navigate, t, users]);
-  const renderedComments = useMemo(
-    () => comments.map((c) => /* @__PURE__ */ jsx(
-      Comment,
-      {
-        comment: c,
-        users,
-        handleDelete: () => handleDelete(c.id),
-        handleEdit: (value) => handleEdit(c.id, value),
-        handleReact: (type) => handleReact(c.id, type),
-        handleQuote: () => handleQuote(c.value)
-      },
-      c.id
-    )),
-    [comments, handleDelete, handleEdit, handleQuote, handleReact, users]
-  );
-  return /* @__PURE__ */ jsxs(Stack, { sx: { py: 1, pr: 1 }, spacing: 1, children: [
-    hit && renderedAnalyticComments,
-    /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-      /* @__PURE__ */ jsx(HowlerAvatar, { userId: user.username }),
-      /* @__PURE__ */ jsx(
-        TextField,
-        {
-          inputProps: { sx: (theme) => ({ fontSize: theme.typography.body2.fontSize }) },
-          InputLabelProps: { shrink: false },
-          placeholder: t("comments.add"),
-          onKeyDown: checkForSubmit,
-          onChangeCapture: checkLength,
-          inputRef: input,
-          onFocus,
-          onBlur,
-          error: length > MAX_LENGTH,
-          fullWidth: true,
-          multiline: true
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs(Stack, { direction: "row", alignItems: "center", children: [
-      typers.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(AvatarGroup, { componentsProps: { additionalAvatar: { sx: { height: 24, width: 24, fontSize: "12px" } } }, children: typers.map((typer) => /* @__PURE__ */ jsx(HowlerAvatar, { userId: typer, sx: { height: 24, width: 24 } }, typer)) }),
-        /* @__PURE__ */ jsx(TypingIndicator, {})
-      ] }),
-      /* @__PURE__ */ jsx(FlexOne, {}),
-      length > 0.9 * MAX_LENGTH && /* @__PURE__ */ jsxs(Typography, { variant: "caption", sx: [{ opacity: 0.7, mr: 1 }, length > MAX_LENGTH && { color: "error.main" }], children: [
-        length,
-        "/",
-        MAX_LENGTH
-      ] }),
-      showClear && /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: onClear, disabled: loading, children: /* @__PURE__ */ jsx(Clear, { fontSize: "small" }) }),
-      /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: onSubmit, disabled: loading || length > MAX_LENGTH, children: /* @__PURE__ */ jsx(Send, { fontSize: "small" }) })
-    ] }),
-    hit ? renderedComments : /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-        /* @__PURE__ */ jsx(Skeleton, { width: 40, height: 40, variant: "circular" }),
-        /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: 80, variant: "rounded" })
-      ] }),
-      /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-        /* @__PURE__ */ jsx(Skeleton, { width: 40, height: 40, variant: "circular" }),
-        /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: 100, variant: "rounded" })
-      ] }),
-      /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-        /* @__PURE__ */ jsx(Skeleton, { width: 40, height: 40, variant: "circular" }),
-        /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: 80, variant: "rounded" })
-      ] })
-    ] })
-  ] });
-};
-export {
-  HitComments as default
-};

package/components/elements/hit/HitDetails.d.ts

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

package/components/elements/hit/HitDetails.js

@@ -1,238 +0,0 @@
-import { jsxs, jsx } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.js";
-import { InfoOutlined, ArrowDropDown } 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, Box, Grid, Tooltip, Stack, Divider, Accordion, AccordionSummary, Typography, AccordionDetails, TextField } 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 { flatten } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/flat@6.0.1/node_modules/flat/index.js";
-import Fuse from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/fuse.js@7.1.0/node_modules/fuse.js/dist/fuse.mjs";
-import { isObject, uniq, isPlainObject, sortBy, isArray, max, isNull, isUndefined, isEmpty, groupBy, capitalize } from "/home/runner/work/howler/howler/ui/node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/lodash.js";
-import { memo, 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 Throttler from "../../../utils/Throttler.js";
-import PluginTypography from "../PluginTypography.js";
-const ListRenderer = memo(({ objKey: key, entries, maxKeyLength }) => {
-  const theme = useTheme();
-  const { t } = useTranslation();
-  const allPrimitives = useMemo(() => entries.every((entry) => !isObject(entry)), [entries]);
-  const uniqueEntries = useMemo(() => uniq(entries), [entries]);
-  const omittedDuplicates = useMemo(() => uniqueEntries.length !== entries.length, [entries, uniqueEntries]);
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      className: key.replace(/\./g, "_"),
-      display: allPrimitives ? "grid" : "flex",
-      sx: [
-        allPrimitives ? {
-          gridTemplateColumns: "40% 60%"
-        } : {
-          flexDirection: "column"
-        }
-      ],
-      overflow: "hidden",
-      maxWidth: "100%",
-      children: [
-        /* @__PURE__ */ jsx(
-          Box,
-          {
-            sx: {
-              display: "flex",
-              justifyContent: allPrimitives ? "end" : "start",
-              borderRight: allPrimitives ? "1px solid" : "none",
-              borderColor: theme.palette.divider,
-              pr: 1,
-              mr: 1
-            },
-            children: /* @__PURE__ */ jsx(
-              "code",
-              {
-                style: {
-                  marginTop: allPrimitives ? 0 : theme.spacing(2),
-                  marginBottom: allPrimitives ? 0 : theme.spacing(1)
-                },
-                children: allPrimitives ? key.padStart(maxKeyLength ?? key.length) : key
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsxs(Grid, { container: true, spacing: allPrimitives ? 1 : 4, ml: allPrimitives ? -1 : -4, overflow: "hidden", maxWidth: "100%", children: [
-          uniqueEntries.map((entry, index) => {
-            if (Array.isArray(entry)) {
-              return /* @__PURE__ */ jsx(Grid, { item: true, xs: "auto", maxWidth: "100%", children: /* @__PURE__ */ jsx(ListRenderer, { objKey: `${key}.${index}`, entries: entry }) }, index);
-            }
-            if (isPlainObject(entry)) {
-              return /* @__PURE__ */ jsx(Grid, { item: true, xs: "auto", maxWidth: "100%", minWidth: "350px", children: /* @__PURE__ */ jsx(ObjectRenderer, { parentKey: `${key}.${index}`, indent: true, data: entry }) }, index);
-            }
-            return /* @__PURE__ */ jsxs(
-              Grid,
-              {
-                item: true,
-                maxWidth: "100%",
-                className: `${key}_${index}`.replace(/\./g, "_"),
-                component: "code",
-                display: "flex",
-                flexDirection: "row",
-                children: [
-                  /* @__PURE__ */ jsx(
-                    PluginTypography,
-                    {
-                      context: "details",
-                      component: "code",
-                      style: { maxWidth: "100%", font: "inherit" },
-                      value: entry,
-                      field: key.replace(/\.[0-9]+/g, ""),
-                      children: entry
-                    }
-                  ),
-                  allPrimitives && index < uniqueEntries.length - 1 && /* @__PURE__ */ jsx("span", { children: "," })
-                ]
-              },
-              entry
-            );
-          }),
-          omittedDuplicates && /* @__PURE__ */ jsx(Grid, { item: true, display: "flex", alignItems: "center", children: /* @__PURE__ */ jsx(Tooltip, { title: t("duplicates.omitted"), children: /* @__PURE__ */ jsx(InfoOutlined, { sx: { fontSize: "20px", ml: 1 }, color: "disabled" }) }) })
-        ] })
-      ]
-    }
-  );
-});
-const ObjectRenderer = memo(
-  ({ data, parentKey, indent = false }) => {
-    const theme = useTheme();
-    const entries = useMemo(() => {
-      const unsorted = Object.entries(flatten(data, { safe: true })).map(([key, val]) => [key, val]);
-      const sortedAlphabetical = unsorted.map(([key]) => key).sort();
-      return sortBy(
-        unsorted,
-        ([key, val]) => sortedAlphabetical.indexOf(key) - // This pushes complex objects to the bottom of the list, so they are always rendered last.
-        // We check for if the value is a primitve, or if it's an array and every entry is a primitive.
-        (!isObject(val) || isArray(val) && val.every((entry) => !isObject(entry)) ? 1e4 : 0)
-      );
-    }, [data]);
-    const longestKey = useMemo(() => max(entries.map(([key]) => key.length)), [entries]);
-    return /* @__PURE__ */ jsxs(Stack, { direction: "row", overflow: "hidden", maxWidth: "100%", children: [
-      indent && /* @__PURE__ */ jsx(Divider, { orientation: "vertical", flexItem: true, sx: { borderColor: "primary.main", borderWidth: "2px" } }),
-      /* @__PURE__ */ jsx(Stack, { flex: 1, ml: 1, maxWidth: "100%", children: entries.filter(([__, val]) => !isNull(val) && !isUndefined(val) && !isEmpty(val)).map(([key, val]) => {
-        if (Array.isArray(val)) {
-          return /* @__PURE__ */ jsx(ListRenderer, { maxKeyLength: longestKey, objKey: key, entries: val }, key);
-        }
-        return /* @__PURE__ */ jsxs(
-          "code",
-          {
-            className: (parentKey ? `${parentKey}.${key}` : key).replace(/\./g, "_"),
-            style: {
-              display: "grid",
-              gridTemplateColumns: "40% 60%",
-              alignItems: "start",
-              maxWidth: "100%"
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                Box,
-                {
-                  display: "flex",
-                  justifyContent: "end",
-                  sx: {
-                    marginRight: theme.spacing(1),
-                    marginBottom: 0,
-                    marginTop: 0,
-                    borderRight: "1px solid",
-                    borderColor: theme.palette.divider,
-                    paddingRight: theme.spacing(1),
-                    height: "100%",
-                    wordWrap: "break-word"
-                  },
-                  children: /* @__PURE__ */ jsx("code", { style: { maxWidth: "100%" }, children: key })
-                }
-              ),
-              /* @__PURE__ */ jsx(Box, { display: "flex", alignItems: "start", children: /* @__PURE__ */ jsx(
-                PluginTypography,
-                {
-                  context: "details",
-                  component: "code",
-                  style: { maxWidth: "100%", font: "inherit" },
-                  value: val,
-                  field: (parentKey ? parentKey.concat(".", key) : key).replace(/\.[0-9]+/g, ""),
-                  children: val
-                }
-              ) })
-            ]
-          },
-          key
-        );
-      }) })
-    ] });
-  }
-);
-const Collapsible = memo(
-  ({ title, data, query }) => {
-    const throttler = useMemo(() => new Throttler(400), []);
-    const [scores, setScores] = useState([]);
-    const [results, setResults] = useState({});
-    const options = useMemo(() => Object.entries(data).map(([key, value]) => ({ key, value })), [data]);
-    const keys = useMemo(
-      () => options.flatMap((option) => isArray(option.value) ? Object.keys(flatten(option.value)) : []).map((key) => key.replace(/\d+/g, "value")).filter((key) => !!key),
-      [options]
-    );
-    const fuse = useMemo(
-      () => new Fuse(options, { includeScore: true, threshold: 0.4, keys: uniq(["key", "value", ...keys]) }),
-      [keys, options]
-    );
-    useEffect(() => {
-      if (!query) {
-        setResults(data);
-        setScores([]);
-        return;
-      }
-      throttler.debounce(() => {
-        const fuseResults = fuse.search(query);
-        setScores(fuseResults.map((result) => [result.item.key, result.score]));
-        setResults(fuseResults.reduce((acc, entry) => ({ ...acc, [entry.item.key]: entry.item.value }), {}));
-      });
-    }, [data, fuse, query, throttler]);
-    const styles = useMemo(
-      () => scores.map(([key, score]) => ({
-        [`& .${key.replace(/\./g, "_")}`]: {
-          opacity: 1 - Math.pow(score, 0.5),
-          fontWeight: score < 0.05 ? "bold" : "initial"
-        }
-      })),
-      [scores]
-    );
-    if (isEmpty(results)) {
-      return null;
-    }
-    return /* @__PURE__ */ jsxs(Accordion, { defaultExpanded: true, children: [
-      /* @__PURE__ */ jsx(AccordionSummary, { expandIcon: /* @__PURE__ */ jsx(ArrowDropDown, {}), children: /* @__PURE__ */ jsx(Typography, { children: title }) }),
-      /* @__PURE__ */ jsx(AccordionDetails, { children: /* @__PURE__ */ jsx(Stack, { spacing: 1, justifyContent: "stretch", sx: styles, children: /* @__PURE__ */ jsx(ObjectRenderer, { showParentKey: true, data: results }) }) })
-    ] });
-  }
-);
-const HitDetails = ({ hit }) => {
-  const { t } = useTranslation();
-  const [query, setQuery] = useState("");
-  const groups = useMemo(
-    () => groupBy(
-      Object.entries(flatten(hit ?? {}, { safe: true })).filter(
-        ([key, value]) => key.includes(".") && ["howler", "labels"].every((prefix) => !key.startsWith(prefix)) && !isEmpty(value)
-      ),
-      ([key]) => key.split(".")[0]
-    ),
-    [hit]
-  );
-  return /* @__PURE__ */ jsxs(Stack, { spacing: 1, children: [
-    /* @__PURE__ */ jsx(TextField, { value: query, onChange: (event) => setQuery(event.target.value), label: t("overview.search") }),
-    Object.entries(groups).map(([section, entries]) => {
-      return /* @__PURE__ */ jsx(
-        Collapsible,
-        {
-          query,
-          title: section.split("_").map((word) => capitalize(word)).join(" "),
-          data: Object.fromEntries(entries)
-        },
-        section
-      );
-    })
-  ] });
-};
-const HitDetails$1 = memo(HitDetails);
-export {
-  HitDetails$1 as default
-};

package/components/elements/hit/HitLabels.d.ts

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