@drodil/backstage-plugin-qeta-react 3.56.1 → 3.57.0

package/dist/components/Tooltips/CollectionTooltip.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionTooltip.esm.js","sources":["../../../src/components/Tooltips/CollectionTooltip.tsx"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { qetaApiRef } from '../../api';\nimport {\n  Collection,\n  removeMarkdownFormatting,\n  truncate,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation';\nimport { useCollectionsFollow } from '../../hooks/useCollectionsFollow';\nimport {\n  Box,\n  Button,\n  Grid,\n  Tooltip,\n  TooltipProps,\n  Typography,\n} from '@material-ui/core';\nimport LibraryBooksOutlined from '@material-ui/icons/LibraryBooksOutlined';\nimport PeopleAltOutlined from '@material-ui/icons/PeopleAltOutlined';\nimport Visibility from '@material-ui/icons/Visibility';\nimport VisibilityOff from '@material-ui/icons/VisibilityOff';\nimport { useTooltipStyles } from '../../hooks/useTooltipStyles';\nimport { Skeleton } from '@material-ui/lab';\n\nconst cache: Map<number, { data: Collection; timestamp: number }> = new Map();\nconst requestCache: Map<number, Promise<Collection | undefined>> = new Map();\nconst TTL = 5 * 60 * 1000;\n\nconst CollectionTooltipContent = ({\n  collectionId,\n  interactive,\n}: {\n  collectionId: number;\n  interactive: boolean;\n}) => {\n  const qetaApi = useApi(qetaApiRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const collections = useCollectionsFollow();\n  const [resp, setResp] = useState<undefined | Collection>();\n\n  useEffect(() => {\n    const cached = cache.get(collectionId);\n    if (cached && Date.now() - cached.timestamp < TTL) {\n      setResp(cached.data);\n      return;\n    }\n\n    if (requestCache.has(collectionId)) {\n      requestCache.get(collectionId)!.then(res => {\n        if (res) setResp(res);\n      });\n      return;\n    }\n\n    const promise = qetaApi.getCollection(collectionId).then(res => {\n      if (res) {\n        cache.set(collectionId, { data: res, timestamp: Date.now() });\n        return res;\n      }\n      return undefined;\n    });\n\n    requestCache.set(collectionId, promise);\n    promise.then(res => {\n      if (res) setResp(res);\n      requestCache.delete(collectionId);\n    });\n  }, [qetaApi, collectionId]);\n\n  if (!resp) {\n    return (\n      <Grid container style={{ padding: '0.5em', maxWidth: 300 }} spacing={1}>\n        <Grid item xs={12}>\n          <Skeleton variant=\"text\" width={150} height={24} />\n          <Skeleton variant=\"text\" width={100} height={20} />\n          <Skeleton\n            variant=\"rect\"\n            width={280}\n            height={60}\n            style={{ marginTop: 8 }}\n          />\n        </Grid>\n      </Grid>\n    );\n  }\n\n  return (\n    <Grid container style={{ padding: '0.5em', maxWidth: 300 }} spacing={1}>\n      <Grid item xs={12}>\n        <Box style={{ display: 'flex', alignItems: 'center' }}>\n          <LibraryBooksOutlined style={{ marginRight: '0.5em' }} />\n          <Typography variant=\"subtitle1\" style={{ fontWeight: 600 }}>\n            {resp.title}\n          </Typography>\n        </Box>\n      </Grid>\n      <Grid item xs={12}>\n        <Box display=\"flex\" flexWrap=\"wrap\" style={{ gap: '1em' }}>\n          <Box display=\"flex\" alignItems=\"center\">\n            <LibraryBooksOutlined\n              style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n            />\n            <Typography variant=\"caption\">\n              {t('common.posts', {\n                count: resp.postsCount ?? resp.posts?.length ?? 0,\n                itemType: 'post',\n              })}\n            </Typography>\n          </Box>\n          <Box display=\"flex\" alignItems=\"center\">\n            <PeopleAltOutlined\n              style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n            />\n            <Typography variant=\"caption\">\n              {t('common.followers', { count: resp.followers })}\n            </Typography>\n          </Box>\n        </Box>\n      </Grid>\n      {resp.description && (\n        <Grid item xs={12}>\n          <Typography variant=\"body2\" color=\"textSecondary\">\n            {truncate(removeMarkdownFormatting(resp.description), 150)}\n          </Typography>\n        </Grid>\n      )}\n      {interactive && !collections.loading && (\n        <Grid item xs={12}>\n          <Button\n            size=\"small\"\n            variant=\"outlined\"\n            color={\n              collections.isFollowingCollection(resp) ? 'secondary' : 'primary'\n            }\n            fullWidth\n            onClick={() => {\n              if (collections.isFollowingCollection(resp)) {\n                collections.unfollowCollection(resp);\n              } else {\n                collections.followCollection(resp);\n              }\n            }}\n            startIcon={\n              collections.isFollowingCollection(resp) ? (\n                <VisibilityOff />\n              ) : (\n                <Visibility />\n              )\n            }\n          >\n            {collections.isFollowingCollection(resp)\n              ? t('collectionButton.unfollow')\n              : t('collectionButton.follow')}\n          </Button>\n        </Grid>\n      )}\n    </Grid>\n  );\n};\n\nexport const CollectionTooltip = (\n  props: {\n    collectionId: number;\n    interactive?: boolean;\n  } & Omit<TooltipProps, 'title'>,\n) => {\n  const {\n    collectionId,\n    interactive = true,\n    children,\n    className,\n    ...tooltipProps\n  } = props;\n  const classes = useTooltipStyles();\n\n  return (\n    <Tooltip\n      title={\n        <CollectionTooltipContent\n          collectionId={collectionId}\n          interactive={interactive}\n        />\n      }\n      interactive={interactive}\n      arrow\n      classes={{\n        tooltip: classes.tooltip,\n        arrow: classes.tooltipArrow,\n        ...props.classes,\n      }}\n      className={className}\n      {...tooltipProps}\n    >\n      {children}\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Tooltips/EntityTooltip.esm.js

@@ -0,0 +1,188 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { stringifyEntityRef } from '@backstage/catalog-model';
+import { useState, useEffect } from 'react';
+import { useApi } from '@backstage/core-plugin-api';
+import { useEntityPresentation } from '@backstage/plugin-catalog-react';
+import { qetaApiRef } from '../../api.esm.js';
+import 'react-use';
+import '@backstage/plugin-signals-react';
+import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
+import { qetaTranslationRef } from '../../translation.esm.js';
+import '../../hooks/useListItemStyles.esm.js';
+import { useEntityFollow } from '../../hooks/useEntityFollow.esm.js';
+import 'dataloader';
+import 'react-use/lib/useAsync';
+import '@backstage/plugin-permission-react';
+import '@drodil/backstage-plugin-qeta-common';
+import '@backstage/plugin-permission-common';
+import { Tooltip, Grid, Box, Typography, Button } from '@material-ui/core';
+import 'react-router-dom';
+import 'react-use/lib/useDebounce';
+import '../FilterPanel/FilterPanel.esm.js';
+import '../QetaContext/QetaContext.esm.js';
+import { Skeleton } from '@material-ui/lab';
+import VisibilityOff from '@material-ui/icons/VisibilityOff';
+import Visibility from '@material-ui/icons/Visibility';
+import HelpOutline from '@material-ui/icons/HelpOutline';
+import DescriptionOutlined from '@material-ui/icons/DescriptionOutlined';
+import PeopleAltOutlined from '@material-ui/icons/PeopleAltOutlined';
+import { useTooltipStyles } from '../../hooks/useTooltipStyles.esm.js';
+
+const cache = /* @__PURE__ */ new Map();
+const requestCache = /* @__PURE__ */ new Map();
+const TTL = 5 * 60 * 1e3;
+const EntityTooltipContent = ({
+  entity,
+  interactive
+}) => {
+  const entityRef = typeof entity === "string" ? entity : stringifyEntityRef(entity);
+  const qetaApi = useApi(qetaApiRef);
+  const { primaryTitle, secondaryTitle, Icon } = useEntityPresentation(entity);
+  const { t } = useTranslationRef(qetaTranslationRef);
+  const entitiesFollow = useEntityFollow();
+  const [resp, setResp] = useState();
+  useEffect(() => {
+    const cached = cache.get(entityRef);
+    if (cached && Date.now() - cached.timestamp < TTL) {
+      setResp(cached.data);
+      return;
+    }
+    if (requestCache.has(entityRef)) {
+      requestCache.get(entityRef)?.then((res) => {
+        if (res) setResp(res);
+      });
+      return;
+    }
+    const promise = qetaApi.getEntity(entityRef).then((res) => {
+      if (res) {
+        cache.set(entityRef, { data: res, timestamp: Date.now() });
+      }
+      return res || void 0;
+    });
+    requestCache.set(entityRef, promise);
+    promise.then((res) => {
+      if (res) setResp(res);
+      requestCache.delete(entityRef);
+    });
+  }, [qetaApi, entityRef]);
+  if (!resp) {
+    return /* @__PURE__ */ jsx(Grid, { container: true, style: { padding: "0.5em", maxWidth: 300 }, spacing: 1, children: /* @__PURE__ */ jsxs(Grid, { item: true, xs: 12, children: [
+      /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: 150, height: 24 }),
+      /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: 100, height: 20 }),
+      /* @__PURE__ */ jsx(
+        Skeleton,
+        {
+          variant: "rect",
+          width: 280,
+          height: 60,
+          style: { marginTop: 8 }
+        }
+      )
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxs(Grid, { container: true, style: { padding: "0.5em", maxWidth: 300 }, spacing: 1, children: [
+    /* @__PURE__ */ jsxs(Grid, { item: true, xs: 12, children: [
+      /* @__PURE__ */ jsxs(Box, { style: { display: "flex", alignItems: "center" }, children: [
+        Icon ? /* @__PURE__ */ jsx(Box, { marginRight: 1, display: "flex", alignItems: "center", children: /* @__PURE__ */ jsx(Icon, { fontSize: "small" }) }) : null,
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            variant: "subtitle1",
+            style: {
+              textOverflow: "ellipsis",
+              overflow: "hidden",
+              whiteSpace: "nowrap",
+              fontWeight: 600
+            },
+            children: primaryTitle
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(Typography, { variant: "subtitle2", color: "textSecondary", children: secondaryTitle })
+    ] }),
+    /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsxs(Box, { display: "flex", flexWrap: "wrap", style: { gap: "1em" }, children: [
+      /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+        /* @__PURE__ */ jsx(
+          HelpOutline,
+          {
+            style: { fontSize: "0.875rem", marginRight: "0.25em" }
+          }
+        ),
+        /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
+          resp.questionsCount,
+          " ",
+          t("common.questions")
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+        /* @__PURE__ */ jsx(
+          DescriptionOutlined,
+          {
+            style: { fontSize: "0.875rem", marginRight: "0.25em" }
+          }
+        ),
+        /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
+          resp.articlesCount,
+          " ",
+          t("common.articles")
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+        /* @__PURE__ */ jsx(
+          PeopleAltOutlined,
+          {
+            style: { fontSize: "0.875rem", marginRight: "0.25em" }
+          }
+        ),
+        /* @__PURE__ */ jsx(Typography, { variant: "caption", children: t("common.followers", { count: resp.followerCount }) })
+      ] })
+    ] }) }),
+    interactive && !entitiesFollow.loading && /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        size: "small",
+        variant: "outlined",
+        color: entitiesFollow.isFollowingEntity(entityRef) ? "secondary" : "primary",
+        fullWidth: true,
+        onClick: () => {
+          if (entitiesFollow.isFollowingEntity(entityRef)) {
+            entitiesFollow.unfollowEntity(entityRef);
+          } else {
+            entitiesFollow.followEntity(entityRef);
+          }
+        },
+        startIcon: entitiesFollow.isFollowingEntity(entityRef) ? /* @__PURE__ */ jsx(VisibilityOff, {}) : /* @__PURE__ */ jsx(Visibility, {}),
+        children: entitiesFollow.isFollowingEntity(entityRef) ? t("entityButton.unfollow") : t("entityButton.follow")
+      }
+    ) })
+  ] });
+};
+const EntityTooltip = (props) => {
+  const {
+    entity,
+    interactive = true,
+    children,
+    className,
+    ...tooltipProps
+  } = props;
+  const classes = useTooltipStyles();
+  return /* @__PURE__ */ jsx(
+    Tooltip,
+    {
+      title: /* @__PURE__ */ jsx(EntityTooltipContent, { entity, interactive }),
+      interactive,
+      arrow: true,
+      classes: {
+        tooltip: classes.tooltip,
+        arrow: classes.tooltipArrow,
+        ...props.classes
+      },
+      className,
+      ...tooltipProps,
+      children
+    }
+  );
+};
+
+export { EntityTooltip };
+//# sourceMappingURL=EntityTooltip.esm.js.map

package/dist/components/Tooltips/EntityTooltip.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EntityTooltip.esm.js","sources":["../../../src/components/Tooltips/EntityTooltip.tsx"],"sourcesContent":["import { Entity, stringifyEntityRef } from '@backstage/catalog-model';\nimport { useEffect, useState } from 'react';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { useEntityPresentation } from '@backstage/plugin-catalog-react';\nimport { qetaApiRef } from '../../api';\nimport { EntityResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { useEntityFollow } from '../../hooks';\nimport {\n  Box,\n  Button,\n  Grid,\n  Tooltip,\n  TooltipProps,\n  Typography,\n} from '@material-ui/core';\nimport { Skeleton } from '@material-ui/lab';\nimport VisibilityOff from '@material-ui/icons/VisibilityOff';\nimport Visibility from '@material-ui/icons/Visibility';\nimport HelpOutline from '@material-ui/icons/HelpOutline';\nimport DescriptionOutlined from '@material-ui/icons/DescriptionOutlined';\nimport PeopleAltOutlined from '@material-ui/icons/PeopleAltOutlined';\nimport { qetaTranslationRef } from '../../translation';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { useTooltipStyles } from '../../hooks/useTooltipStyles';\n\nconst cache: Map<string, { data: EntityResponse; timestamp: number }> =\n  new Map();\nconst requestCache: Map<\n  string,\n  Promise<EntityResponse | undefined>\n> = new Map();\nconst TTL = 5 * 60 * 1000;\n\nconst EntityTooltipContent = ({\n  entity,\n  interactive,\n}: {\n  entity: Entity | string;\n  interactive: boolean;\n}) => {\n  const entityRef =\n    typeof entity === 'string' ? entity : stringifyEntityRef(entity);\n  const qetaApi = useApi(qetaApiRef);\n  const { primaryTitle, secondaryTitle, Icon } = useEntityPresentation(entity);\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const entitiesFollow = useEntityFollow();\n  const [resp, setResp] = useState<undefined | EntityResponse>();\n\n  useEffect(() => {\n    const cached = cache.get(entityRef);\n    if (cached && Date.now() - cached.timestamp < TTL) {\n      setResp(cached.data);\n      return;\n    }\n\n    if (requestCache.has(entityRef)) {\n      requestCache.get(entityRef)?.then(res => {\n        if (res) setResp(res);\n      });\n      return;\n    }\n\n    const promise = qetaApi.getEntity(entityRef).then(res => {\n      if (res) {\n        cache.set(entityRef, { data: res, timestamp: Date.now() });\n      }\n      return res || undefined;\n    });\n\n    requestCache.set(entityRef, promise);\n    promise.then(res => {\n      if (res) setResp(res);\n      requestCache.delete(entityRef);\n    });\n  }, [qetaApi, entityRef]);\n\n  if (!resp) {\n    return (\n      <Grid container style={{ padding: '0.5em', maxWidth: 300 }} spacing={1}>\n        <Grid item xs={12}>\n          <Skeleton variant=\"text\" width={150} height={24} />\n          <Skeleton variant=\"text\" width={100} height={20} />\n          <Skeleton\n            variant=\"rect\"\n            width={280}\n            height={60}\n            style={{ marginTop: 8 }}\n          />\n        </Grid>\n      </Grid>\n    );\n  }\n\n  return (\n    <Grid container style={{ padding: '0.5em', maxWidth: 300 }} spacing={1}>\n      <Grid item xs={12}>\n        <Box style={{ display: 'flex', alignItems: 'center' }}>\n          {Icon ? (\n            <Box marginRight={1} display=\"flex\" alignItems=\"center\">\n              <Icon fontSize=\"small\" />\n            </Box>\n          ) : null}\n          <Typography\n            variant=\"subtitle1\"\n            style={{\n              textOverflow: 'ellipsis',\n              overflow: 'hidden',\n              whiteSpace: 'nowrap',\n              fontWeight: 600,\n            }}\n          >\n            {primaryTitle}\n          </Typography>\n        </Box>\n        <Typography variant=\"subtitle2\" color=\"textSecondary\">\n          {secondaryTitle}\n        </Typography>\n      </Grid>\n      <Grid item xs={12}>\n        <Box display=\"flex\" flexWrap=\"wrap\" style={{ gap: '1em' }}>\n          <Box display=\"flex\" alignItems=\"center\">\n            <HelpOutline\n              style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n            />\n            <Typography variant=\"caption\">\n              {resp.questionsCount} {t('common.questions')}\n            </Typography>\n          </Box>\n          <Box display=\"flex\" alignItems=\"center\">\n            <DescriptionOutlined\n              style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n            />\n            <Typography variant=\"caption\">\n              {resp.articlesCount} {t('common.articles')}\n            </Typography>\n          </Box>\n          <Box display=\"flex\" alignItems=\"center\">\n            <PeopleAltOutlined\n              style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n            />\n            <Typography variant=\"caption\">\n              {t('common.followers', { count: resp.followerCount })}\n            </Typography>\n          </Box>\n        </Box>\n      </Grid>\n      {interactive && !entitiesFollow.loading && (\n        <Grid item xs={12}>\n          <Button\n            size=\"small\"\n            variant=\"outlined\"\n            color={\n              entitiesFollow.isFollowingEntity(entityRef)\n                ? 'secondary'\n                : 'primary'\n            }\n            fullWidth\n            onClick={() => {\n              if (entitiesFollow.isFollowingEntity(entityRef)) {\n                entitiesFollow.unfollowEntity(entityRef);\n              } else {\n                entitiesFollow.followEntity(entityRef);\n              }\n            }}\n            startIcon={\n              entitiesFollow.isFollowingEntity(entityRef) ? (\n                <VisibilityOff />\n              ) : (\n                <Visibility />\n              )\n            }\n          >\n            {entitiesFollow.isFollowingEntity(entityRef)\n              ? t('entityButton.unfollow')\n              : t('entityButton.follow')}\n          </Button>\n        </Grid>\n      )}\n    </Grid>\n  );\n};\n\nexport const EntityTooltip = (\n  props: {\n    entity: Entity | string;\n    interactive?: boolean;\n  } & Omit<TooltipProps, 'title'>,\n) => {\n  const {\n    entity,\n    interactive = true,\n    children,\n    className,\n    ...tooltipProps\n  } = props;\n  const classes = useTooltipStyles();\n\n  return (\n    <Tooltip\n      title={<EntityTooltipContent entity={entity} interactive={interactive} />}\n      interactive={interactive}\n      arrow\n      classes={{\n        tooltip: classes.tooltip,\n        arrow: classes.tooltipArrow,\n        ...props.classes,\n      }}\n      className={className}\n      {...tooltipProps}\n    >\n      {children}\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAM,KAAA,uBACA,GAAI,EAAA;AACV,MAAM,YAAA,uBAGE,GAAI,EAAA;AACZ,MAAM,GAAA,GAAM,IAAI,EAAK,GAAA,GAAA;AAErB,MAAM,uBAAuB,CAAC;AAAA,EAC5B,MAAA;AAAA,EACA;AACF,CAGM,KAAA;AACJ,EAAA,MAAM,YACJ,OAAO,MAAA,KAAW,QAAW,GAAA,MAAA,GAAS,mBAAmB,MAAM,CAAA;AACjE,EAAM,MAAA,OAAA,GAAU,OAAO,UAAU,CAAA;AACjC,EAAA,MAAM,EAAE,YAAc,EAAA,cAAA,EAAgB,IAAK,EAAA,GAAI,sBAAsB,MAAM,CAAA;AAC3E,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,MAAM,iBAAiB,eAAgB,EAAA;AACvC,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,QAAqC,EAAA;AAE7D,EAAA,SAAA,CAAU,MAAM;AACd,IAAM,MAAA,MAAA,GAAS,KAAM,CAAA,GAAA,CAAI,SAAS,CAAA;AAClC,IAAA,IAAI,UAAU,IAAK,CAAA,GAAA,EAAQ,GAAA,MAAA,CAAO,YAAY,GAAK,EAAA;AACjD,MAAA,OAAA,CAAQ,OAAO,IAAI,CAAA;AACnB,MAAA;AAAA;AAGF,IAAI,IAAA,YAAA,CAAa,GAAI,CAAA,SAAS,CAAG,EAAA;AAC/B,MAAA,YAAA,CAAa,GAAI,CAAA,SAAS,CAAG,EAAA,IAAA,CAAK,CAAO,GAAA,KAAA;AACvC,QAAI,IAAA,GAAA,UAAa,GAAG,CAAA;AAAA,OACrB,CAAA;AACD,MAAA;AAAA;AAGF,IAAA,MAAM,UAAU,OAAQ,CAAA,SAAA,CAAU,SAAS,CAAA,CAAE,KAAK,CAAO,GAAA,KAAA;AACvD,MAAA,IAAI,GAAK,EAAA;AACP,QAAM,KAAA,CAAA,GAAA,CAAI,WAAW,EAAE,IAAA,EAAM,KAAK,SAAW,EAAA,IAAA,CAAK,GAAI,EAAA,EAAG,CAAA;AAAA;AAE3D,MAAA,OAAO,GAAO,IAAA,KAAA,CAAA;AAAA,KACf,CAAA;AAED,IAAa,YAAA,CAAA,GAAA,CAAI,WAAW,OAAO,CAAA;AACnC,IAAA,OAAA,CAAQ,KAAK,CAAO,GAAA,KAAA;AAClB,MAAI,IAAA,GAAA,UAAa,GAAG,CAAA;AACpB,MAAA,YAAA,CAAa,OAAO,SAAS,CAAA;AAAA,KAC9B,CAAA;AAAA,GACA,EAAA,CAAC,OAAS,EAAA,SAAS,CAAC,CAAA;AAEvB,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IAAA,2BACG,IAAK,EAAA,EAAA,SAAA,EAAS,MAAC,KAAO,EAAA,EAAE,SAAS,OAAS,EAAA,QAAA,EAAU,GAAI,EAAA,EAAG,SAAS,CACnE,EAAA,QAAA,kBAAA,IAAA,CAAC,QAAK,IAAI,EAAA,IAAA,EAAC,IAAI,EACb,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,YAAS,OAAQ,EAAA,MAAA,EAAO,KAAO,EAAA,GAAA,EAAK,QAAQ,EAAI,EAAA,CAAA;AAAA,0BAChD,QAAS,EAAA,EAAA,OAAA,EAAQ,QAAO,KAAO,EAAA,GAAA,EAAK,QAAQ,EAAI,EAAA,CAAA;AAAA,sBACjD,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,OAAQ,EAAA,MAAA;AAAA,UACR,KAAO,EAAA,GAAA;AAAA,UACP,MAAQ,EAAA,EAAA;AAAA,UACR,KAAA,EAAO,EAAE,SAAA,EAAW,CAAE;AAAA;AAAA;AACxB,KAAA,EACF,CACF,EAAA,CAAA;AAAA;AAIJ,EAAA,uBACG,IAAA,CAAA,IAAA,EAAA,EAAK,SAAS,EAAA,IAAA,EAAC,KAAO,EAAA,EAAE,OAAS,EAAA,OAAA,EAAS,QAAU,EAAA,GAAA,EAAO,EAAA,OAAA,EAAS,CACnE,EAAA,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,EAAA,EAAI,EACb,EAAA,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,OAAI,KAAO,EAAA,EAAE,SAAS,MAAQ,EAAA,UAAA,EAAY,UACxC,EAAA,QAAA,EAAA;AAAA,QAAA,IAAA,mBACE,GAAA,CAAA,GAAA,EAAA,EAAI,WAAa,EAAA,CAAA,EAAG,OAAQ,EAAA,MAAA,EAAO,UAAW,EAAA,QAAA,EAC7C,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EAAK,QAAS,EAAA,OAAA,EAAQ,GACzB,CACE,GAAA,IAAA;AAAA,wBACJ,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,OAAQ,EAAA,WAAA;AAAA,YACR,KAAO,EAAA;AAAA,cACL,YAAc,EAAA,UAAA;AAAA,cACd,QAAU,EAAA,QAAA;AAAA,cACV,UAAY,EAAA,QAAA;AAAA,cACZ,UAAY,EAAA;AAAA,aACd;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA;AACH,OACF,EAAA,CAAA;AAAA,0BACC,UAAW,EAAA,EAAA,OAAA,EAAQ,WAAY,EAAA,KAAA,EAAM,iBACnC,QACH,EAAA,cAAA,EAAA;AAAA,KACF,EAAA,CAAA;AAAA,wBACC,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,EAAA,EAAI,IACb,QAAC,kBAAA,IAAA,CAAA,GAAA,EAAA,EAAI,OAAQ,EAAA,MAAA,EAAO,UAAS,MAAO,EAAA,KAAA,EAAO,EAAE,GAAA,EAAK,OAChD,EAAA,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,GAAI,EAAA,EAAA,OAAA,EAAQ,MAAO,EAAA,UAAA,EAAW,QAC7B,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,WAAA;AAAA,UAAA;AAAA,YACC,KAAO,EAAA,EAAE,QAAU,EAAA,UAAA,EAAY,aAAa,QAAS;AAAA;AAAA,SACvD;AAAA,wBACA,IAAA,CAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,SACjB,EAAA,QAAA,EAAA;AAAA,UAAK,IAAA,CAAA,cAAA;AAAA,UAAe,GAAA;AAAA,UAAE,EAAE,kBAAkB;AAAA,SAC7C,EAAA;AAAA,OACF,EAAA,CAAA;AAAA,sBACC,IAAA,CAAA,GAAA,EAAA,EAAI,OAAQ,EAAA,MAAA,EAAO,YAAW,QAC7B,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,mBAAA;AAAA,UAAA;AAAA,YACC,KAAO,EAAA,EAAE,QAAU,EAAA,UAAA,EAAY,aAAa,QAAS;AAAA;AAAA,SACvD;AAAA,wBACA,IAAA,CAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,SACjB,EAAA,QAAA,EAAA;AAAA,UAAK,IAAA,CAAA,aAAA;AAAA,UAAc,GAAA;AAAA,UAAE,EAAE,iBAAiB;AAAA,SAC3C,EAAA;AAAA,OACF,EAAA,CAAA;AAAA,sBACC,IAAA,CAAA,GAAA,EAAA,EAAI,OAAQ,EAAA,MAAA,EAAO,YAAW,QAC7B,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,iBAAA;AAAA,UAAA;AAAA,YACC,KAAO,EAAA,EAAE,QAAU,EAAA,UAAA,EAAY,aAAa,QAAS;AAAA;AAAA,SACvD;AAAA,wBACA,GAAA,CAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,SACjB,EAAA,QAAA,EAAA,CAAA,CAAE,kBAAoB,EAAA,EAAE,KAAO,EAAA,IAAA,CAAK,aAAc,EAAC,CACtD,EAAA;AAAA,OACF,EAAA;AAAA,KAAA,EACF,CACF,EAAA,CAAA;AAAA,IACC,WAAA,IAAe,CAAC,cAAe,CAAA,OAAA,wBAC7B,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,EAAA,EAAI,EACb,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAK,EAAA,OAAA;AAAA,QACL,OAAQ,EAAA,UAAA;AAAA,QACR,KACE,EAAA,cAAA,CAAe,iBAAkB,CAAA,SAAS,IACtC,WACA,GAAA,SAAA;AAAA,QAEN,SAAS,EAAA,IAAA;AAAA,QACT,SAAS,MAAM;AACb,UAAI,IAAA,cAAA,CAAe,iBAAkB,CAAA,SAAS,CAAG,EAAA;AAC/C,YAAA,cAAA,CAAe,eAAe,SAAS,CAAA;AAAA,WAClC,MAAA;AACL,YAAA,cAAA,CAAe,aAAa,SAAS,CAAA;AAAA;AACvC,SACF;AAAA,QACA,SAAA,EACE,eAAe,iBAAkB,CAAA,SAAS,oBACvC,GAAA,CAAA,aAAA,EAAA,EAAc,CAEf,mBAAA,GAAA,CAAC,UAAW,EAAA,EAAA,CAAA;AAAA,QAIf,QAAA,EAAA,cAAA,CAAe,kBAAkB,SAAS,CAAA,GACvC,EAAE,uBAAuB,CAAA,GACzB,EAAE,qBAAqB;AAAA;AAAA,KAE/B,EAAA;AAAA,GAEJ,EAAA,CAAA;AAEJ,CAAA;AAEa,MAAA,aAAA,GAAgB,CAC3B,KAIG,KAAA;AACH,EAAM,MAAA;AAAA,IACJ,MAAA;AAAA,IACA,WAAc,GAAA,IAAA;AAAA,IACd,QAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AACJ,EAAA,MAAM,UAAU,gBAAiB,EAAA;AAEjC,EACE,uBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,KAAO,kBAAA,GAAA,CAAC,oBAAqB,EAAA,EAAA,MAAA,EAAgB,WAA0B,EAAA,CAAA;AAAA,MACvE,WAAA;AAAA,MACA,KAAK,EAAA,IAAA;AAAA,MACL,OAAS,EAAA;AAAA,QACP,SAAS,OAAQ,CAAA,OAAA;AAAA,QACjB,OAAO,OAAQ,CAAA,YAAA;AAAA,QACf,GAAG,KAAM,CAAA;AAAA,OACX;AAAA,MACA,SAAA;AAAA,MACC,GAAG,YAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ;;;;"}

package/dist/components/Tooltips/PostTooltip.esm.js

@@ -0,0 +1,257 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Tooltip, Grid, Typography, Box, Avatar } from '@material-ui/core';
+import { truncate, removeMarkdownFormatting } from '@drodil/backstage-plugin-qeta-common';
+import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
+import { qetaTranslationRef } from '../../translation.esm.js';
+import { useApi } from '@backstage/core-plugin-api';
+import { qetaApiRef } from '../../api.esm.js';
+import 'react-use';
+import { useState, useEffect } from 'react';
+import '@backstage/plugin-signals-react';
+import '../../hooks/useListItemStyles.esm.js';
+import { useUserInfo } from '../../hooks/useEntityAuthor.esm.js';
+import 'react-use/lib/useAsync';
+import '@backstage/plugin-permission-react';
+import '@backstage/plugin-permission-common';
+import 'react-router-dom';
+import 'react-use/lib/useDebounce';
+import '../FilterPanel/FilterPanel.esm.js';
+import '../QetaContext/QetaContext.esm.js';
+import 'dataloader';
+import { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip/RelativeTimeWithTooltip.esm.js';
+import ThumbUpOutlined from '@material-ui/icons/ThumbUpOutlined';
+import VisibilityOutlined from '@material-ui/icons/VisibilityOutlined';
+import QuestionAnswerOutlined from '@material-ui/icons/QuestionAnswerOutlined';
+import ChatBubbleOutline from '@material-ui/icons/ChatBubbleOutline';
+import CheckCircleOutline from '@material-ui/icons/CheckCircleOutline';
+import { useTooltipStyles } from '../../hooks/useTooltipStyles.esm.js';
+import { Skeleton } from '@material-ui/lab';
+
+const cache = /* @__PURE__ */ new Map();
+const requestCache = /* @__PURE__ */ new Map();
+const TTL = 5 * 60 * 1e3;
+const PostTooltipContent = ({
+  post: propsPost,
+  id
+}) => {
+  const { t } = useTranslationRef(qetaTranslationRef);
+  const qetaApi = useApi(qetaApiRef);
+  const [post, setPost] = useState(propsPost);
+  useEffect(() => {
+    if (propsPost) {
+      setPost(propsPost);
+      return;
+    }
+    if (id) {
+      const cached = cache.get(id.toString());
+      if (cached && Date.now() - cached.timestamp < TTL) {
+        setPost(cached.data);
+        return;
+      }
+      const strId = id.toString();
+      if (requestCache.has(strId)) {
+        requestCache.get(strId).then((res) => {
+          if (res) setPost(res);
+        });
+        return;
+      }
+      const promise = qetaApi.getPost(id).then((res) => {
+        if (res) {
+          cache.set(strId, { data: res, timestamp: Date.now() });
+          return res;
+        }
+        return void 0;
+      });
+      requestCache.set(strId, promise);
+      promise.then((res) => {
+        if (res) setPost(res);
+        requestCache.delete(strId);
+      });
+    }
+  }, [propsPost, id, qetaApi]);
+  const { name, initials, user } = useUserInfo(
+    post?.author ?? "",
+    post?.anonymous ?? false
+  );
+  if (!post) {
+    return /* @__PURE__ */ jsx(Grid, { container: true, style: { padding: "0.5em", maxWidth: 300 }, spacing: 1, children: /* @__PURE__ */ jsxs(Grid, { item: true, xs: 12, children: [
+      /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: 200, height: 24 }),
+      /* @__PURE__ */ jsx(
+        Skeleton,
+        {
+          variant: "circle",
+          width: 20,
+          height: 20,
+          style: { display: "inline-block", marginRight: 8 }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Skeleton,
+        {
+          variant: "text",
+          width: 100,
+          height: 20,
+          style: { display: "inline-block" }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Skeleton,
+        {
+          variant: "rect",
+          width: 280,
+          height: 80,
+          style: { marginTop: 8 }
+        }
+      )
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxs(Grid, { container: true, style: { padding: "0.5em", maxWidth: 300 }, spacing: 1, children: [
+    /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
+      Typography,
+      {
+        variant: "subtitle1",
+        style: {
+          fontWeight: 600,
+          marginBottom: "0.5em"
+        },
+        children: post.title
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsxs(
+      Box,
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          marginBottom: "0.5em"
+        },
+        children: [
+          /* @__PURE__ */ jsx(Box, { style: { display: "inline-block", marginRight: "0.5em" }, children: /* @__PURE__ */ jsx(
+            Avatar,
+            {
+              src: user?.spec?.profile?.picture,
+              alt: name,
+              variant: "rounded",
+              style: { width: "20px", height: "20px" },
+              children: initials
+            }
+          ) }),
+          /* @__PURE__ */ jsx(Typography, { variant: "body2", style: { marginRight: "0.5em" }, children: name }),
+          /* @__PURE__ */ jsx(
+            Typography,
+            {
+              variant: "caption",
+              color: "textSecondary",
+              style: { marginTop: "0.2em" },
+              children: /* @__PURE__ */ jsx(RelativeTimeWithTooltip, { value: post.created })
+            }
+          )
+        ]
+      }
+    ) }),
+    post.tags && post.tags.length > 0 && /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "textSecondary", children: post.tags.map((tag) => `#${tag}`).join(" ") }) }),
+    post.content && /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "textSecondary", children: truncate(removeMarkdownFormatting(post.content), 150) }) }),
+    /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsxs(
+      Box,
+      {
+        display: "flex",
+        alignItems: "center",
+        flexWrap: "wrap",
+        style: { gap: "0.5em" },
+        children: [
+          /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+            /* @__PURE__ */ jsx(
+              ThumbUpOutlined,
+              {
+                style: { fontSize: "0.875rem", marginRight: "0.25em" }
+              }
+            ),
+            /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
+              post.score,
+              " ",
+              t("common.votes", {})
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+            /* @__PURE__ */ jsx(
+              VisibilityOutlined,
+              {
+                style: { fontSize: "0.875rem", marginRight: "0.25em" }
+              }
+            ),
+            /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
+              post.views,
+              " ",
+              t("common.views", {})
+            ] })
+          ] }),
+          post.type === "question" && /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+            /* @__PURE__ */ jsx(
+              QuestionAnswerOutlined,
+              {
+                style: { fontSize: "0.875rem", marginRight: "0.25em" }
+              }
+            ),
+            /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
+              post.answersCount,
+              " ",
+              t("common.answers", {})
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+            /* @__PURE__ */ jsx(
+              ChatBubbleOutline,
+              {
+                style: { fontSize: "0.875rem", marginRight: "0.25em" }
+              }
+            ),
+            /* @__PURE__ */ jsxs(Typography, { variant: "caption", children: [
+              post.commentsCount,
+              " ",
+              t("common.comments", {})
+            ] })
+          ] }),
+          post.correctAnswer && /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", color: "success.main", children: [
+            /* @__PURE__ */ jsx(
+              CheckCircleOutline,
+              {
+                style: { fontSize: "0.875rem", marginRight: "0.25em" }
+              }
+            ),
+            /* @__PURE__ */ jsx(Typography, { variant: "caption", children: t("questionPage.correctAnswer", {}) })
+          ] })
+        ]
+      }
+    ) })
+  ] });
+};
+const PostTooltip = (props) => {
+  const {
+    post: propsPost,
+    id,
+    interactive = true,
+    children,
+    className,
+    ...tooltipProps
+  } = props;
+  const classes = useTooltipStyles();
+  return /* @__PURE__ */ jsx(
+    Tooltip,
+    {
+      title: /* @__PURE__ */ jsx(PostTooltipContent, { post: propsPost, id }),
+      interactive,
+      arrow: true,
+      classes: {
+        tooltip: classes.tooltip,
+        arrow: classes.tooltipArrow,
+        ...props.classes
+      },
+      className,
+      ...tooltipProps,
+      children
+    }
+  );
+};
+
+export { PostTooltip };
+//# sourceMappingURL=PostTooltip.esm.js.map

package/dist/components/Tooltips/PostTooltip.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PostTooltip.esm.js","sources":["../../../src/components/Tooltips/PostTooltip.tsx"],"sourcesContent":["import {\n  Avatar,\n  Box,\n  Grid,\n  Tooltip,\n  TooltipProps,\n  Typography,\n} from '@material-ui/core';\nimport {\n  Post,\n  removeMarkdownFormatting,\n  truncate,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation';\nimport { useUserInfo } from '../../hooks';\nimport { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip';\nimport ThumbUpOutlined from '@material-ui/icons/ThumbUpOutlined';\nimport VisibilityOutlined from '@material-ui/icons/VisibilityOutlined';\nimport QuestionAnswerOutlined from '@material-ui/icons/QuestionAnswerOutlined';\nimport ChatBubbleOutline from '@material-ui/icons/ChatBubbleOutline';\nimport CheckCircleOutline from '@material-ui/icons/CheckCircleOutline';\nimport { useEffect, useState } from 'react';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { qetaApiRef } from '../../api';\nimport { useTooltipStyles } from '../../hooks/useTooltipStyles';\nimport { Skeleton } from '@material-ui/lab';\n\nconst cache: Map<string, { data: Post; timestamp: number }> = new Map();\nconst requestCache: Map<string, Promise<Post | undefined>> = new Map();\nconst TTL = 5 * 60 * 1000;\n\nconst PostTooltipContent = ({\n  post: propsPost,\n  id,\n}: {\n  post?: Post;\n  id?: string | number;\n}) => {\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const qetaApi = useApi(qetaApiRef);\n  const [post, setPost] = useState<Post | undefined>(propsPost);\n\n  useEffect(() => {\n    if (propsPost) {\n      setPost(propsPost);\n      return;\n    }\n\n    if (id) {\n      const cached = cache.get(id.toString());\n      if (cached && Date.now() - cached.timestamp < TTL) {\n        setPost(cached.data);\n        return;\n      }\n\n      const strId = id.toString();\n      if (requestCache.has(strId)) {\n        requestCache.get(strId)!.then(res => {\n          if (res) setPost(res);\n        });\n        return;\n      }\n\n      const promise = qetaApi.getPost(id).then(res => {\n        if (res) {\n          cache.set(strId, { data: res, timestamp: Date.now() });\n          return res;\n        }\n        return undefined;\n      });\n\n      requestCache.set(strId, promise);\n      promise.then(res => {\n        if (res) setPost(res);\n        requestCache.delete(strId);\n      });\n    }\n  }, [propsPost, id, qetaApi]);\n\n  const { name, initials, user } = useUserInfo(\n    post?.author ?? '',\n    post?.anonymous ?? false,\n  );\n\n  if (!post) {\n    return (\n      <Grid container style={{ padding: '0.5em', maxWidth: 300 }} spacing={1}>\n        <Grid item xs={12}>\n          <Skeleton variant=\"text\" width={200} height={24} />\n          <Skeleton\n            variant=\"circle\"\n            width={20}\n            height={20}\n            style={{ display: 'inline-block', marginRight: 8 }}\n          />\n          <Skeleton\n            variant=\"text\"\n            width={100}\n            height={20}\n            style={{ display: 'inline-block' }}\n          />\n          <Skeleton\n            variant=\"rect\"\n            width={280}\n            height={80}\n            style={{ marginTop: 8 }}\n          />\n        </Grid>\n      </Grid>\n    );\n  }\n\n  return (\n    <Grid container style={{ padding: '0.5em', maxWidth: 300 }} spacing={1}>\n      <Grid item xs={12}>\n        <Typography\n          variant=\"subtitle1\"\n          style={{\n            fontWeight: 600,\n            marginBottom: '0.5em',\n          }}\n        >\n          {post.title}\n        </Typography>\n      </Grid>\n\n      <Grid item xs={12}>\n        <Box\n          style={{\n            display: 'flex',\n            alignItems: 'center',\n            marginBottom: '0.5em',\n          }}\n        >\n          <Box style={{ display: 'inline-block', marginRight: '0.5em' }}>\n            <Avatar\n              src={user?.spec?.profile?.picture}\n              alt={name}\n              variant=\"rounded\"\n              style={{ width: '20px', height: '20px' }}\n            >\n              {initials}\n            </Avatar>\n          </Box>\n          <Typography variant=\"body2\" style={{ marginRight: '0.5em' }}>\n            {name}\n          </Typography>\n          <Typography\n            variant=\"caption\"\n            color=\"textSecondary\"\n            style={{ marginTop: '0.2em' }}\n          >\n            <RelativeTimeWithTooltip value={post.created} />\n          </Typography>\n        </Box>\n      </Grid>\n\n      {post.tags && post.tags.length > 0 && (\n        <Grid item xs={12}>\n          <Typography variant=\"caption\" color=\"textSecondary\">\n            {post.tags.map(tag => `#${tag}`).join(' ')}\n          </Typography>\n        </Grid>\n      )}\n\n      {post.content && (\n        <Grid item xs={12}>\n          <Typography variant=\"body2\" color=\"textSecondary\">\n            {truncate(removeMarkdownFormatting(post.content), 150)}\n          </Typography>\n        </Grid>\n      )}\n\n      <Grid item xs={12}>\n        <Box\n          display=\"flex\"\n          alignItems=\"center\"\n          flexWrap=\"wrap\"\n          style={{ gap: '0.5em' }}\n        >\n          <Box display=\"flex\" alignItems=\"center\">\n            <ThumbUpOutlined\n              style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n            />\n            <Typography variant=\"caption\">\n              {post.score} {t('common.votes', {})}\n            </Typography>\n          </Box>\n\n          <Box display=\"flex\" alignItems=\"center\">\n            <VisibilityOutlined\n              style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n            />\n            <Typography variant=\"caption\">\n              {post.views} {t('common.views', {})}\n            </Typography>\n          </Box>\n\n          {post.type === 'question' && (\n            <Box display=\"flex\" alignItems=\"center\">\n              <QuestionAnswerOutlined\n                style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n              />\n              <Typography variant=\"caption\">\n                {post.answersCount} {t('common.answers', {})}\n              </Typography>\n            </Box>\n          )}\n\n          <Box display=\"flex\" alignItems=\"center\">\n            <ChatBubbleOutline\n              style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n            />\n            <Typography variant=\"caption\">\n              {post.commentsCount} {t('common.comments', {})}\n            </Typography>\n          </Box>\n\n          {post.correctAnswer && (\n            <Box display=\"flex\" alignItems=\"center\" color=\"success.main\">\n              <CheckCircleOutline\n                style={{ fontSize: '0.875rem', marginRight: '0.25em' }}\n              />\n              <Typography variant=\"caption\">\n                {t('questionPage.correctAnswer', {})}\n              </Typography>\n            </Box>\n          )}\n        </Box>\n      </Grid>\n    </Grid>\n  );\n};\n\nexport const PostTooltip = (\n  props: {\n    post?: Post;\n    id?: string | number;\n    interactive?: boolean;\n  } & Omit<TooltipProps, 'title'>,\n) => {\n  const {\n    post: propsPost,\n    id,\n    interactive = true,\n    children,\n    className,\n    ...tooltipProps\n  } = props;\n  const classes = useTooltipStyles();\n\n  return (\n    <Tooltip\n      title={<PostTooltipContent post={propsPost} id={id} />}\n      interactive={interactive}\n      arrow\n      classes={{\n        tooltip: classes.tooltip,\n        arrow: classes.tooltipArrow,\n        ...props.classes,\n      }}\n      className={className}\n      {...tooltipProps}\n    >\n      {children}\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":"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"}