@drodil/backstage-plugin-qeta-react 3.52.5 → 3.53.0

package/dist/components/AnswersContainer/AnswersContainer.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnswersContainer.esm.js","sources":["../../../src/components/AnswersContainer/AnswersContainer.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport useDebounce from 'react-use/lib/useDebounce';\nimport { useSearchParams } from 'react-router-dom';\nimport { EntityRefLink } from '@backstage/plugin-catalog-react';\nimport { useAnalytics } from '@backstage/core-plugin-api';\nimport { filterTags } from '@drodil/backstage-plugin-qeta-common';\nimport { getFiltersWithDateRange } from '../../utils/utils';\nimport {\n  AnswerFilters,\n  FilterKey,\n  filterKeys,\n  FilterPanel,\n} from '../FilterPanel/FilterPanel';\nimport { AnswerList } from './AnswerList';\nimport { useQetaApi } from '../../hooks';\nimport { SearchBar } from '../SearchBar/SearchBar';\nimport { Box, Button, Collapse, Grid, Typography } from '@material-ui/core';\nimport FilterList from '@material-ui/icons/FilterList';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\n\nexport interface AnswersContainerProps {\n  tags?: string[];\n  author?: string;\n  entity?: string;\n  showFilters?: boolean;\n  showTitle?: boolean;\n  title?: string;\n}\n\nexport type AnswerFilterChange = {\n  key: keyof AnswerFilters;\n  value?: AnswerFilters[keyof AnswerFilters];\n};\n\nconst EXPANDED_LOCAL_STORAGE_KEY = 'qeta-answer-filters-expanded';\n\nexport const AnswersContainer = (props: AnswersContainerProps) => {\n  const { tags, author, entity, showFilters, showTitle, title } = props;\n  const analytics = useAnalytics();\n  const [page, setPage] = useState(1);\n  const [answersPerPage, setAnswersPerPage] = useState(25);\n  const [showFilterPanel, setShowFilterPanel] = useState(\n    localStorage.getItem(EXPANDED_LOCAL_STORAGE_KEY) === 'true',\n  );\n  const [answers, setAnswers] = useState<any[]>([]);\n  const [hasMore, setHasMore] = useState(true);\n  const [total, setTotal] = useState(0);\n  const [searchParams, setSearchParams] = useSearchParams();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [filters, setFilters] = useState<AnswerFilters>({\n    order: 'desc',\n    orderBy: 'created',\n    searchQuery: '',\n    dateRange: '',\n    entities: entity ? [entity] : undefined,\n    tags: tags ?? [],\n    noVotes: 'false',\n  });\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  useEffect(() => {\n    localStorage.setItem(\n      EXPANDED_LOCAL_STORAGE_KEY,\n      showFilterPanel ? 'true' : 'false',\n    );\n  }, [showFilterPanel]);\n\n  const onFilterChange = (\n    changes: AnswerFilterChange | AnswerFilterChange[],\n  ) => {\n    const changesArray = Array.isArray(changes) ? changes : [changes];\n    setPage(1);\n    setAnswers([]);\n    setFilters(prev => {\n      const newValue = { ...prev };\n      for (const { key, value } of changesArray) {\n        (newValue as any)[key] = value;\n      }\n      return newValue;\n    });\n    setSearchParams(prev => {\n      const newValue = prev;\n      for (const { key, value } of changesArray) {\n        if (!value || value === 'false') {\n          newValue.delete(key);\n        } else if (Array.isArray(value)) {\n          if (value.length === 0) {\n            newValue.delete(key);\n          } else {\n            newValue.set(key, value.join(','));\n          }\n        } else if (value.length > 0) {\n          newValue.set(key, value);\n        } else {\n          newValue.delete(key);\n        }\n      }\n      return newValue;\n    });\n  };\n\n  const onSearchQueryChange = (query: string) => {\n    setPage(1);\n    setAnswers([]);\n    if (query) {\n      analytics.captureEvent('qeta_search', query);\n    }\n    setSearchQuery(query);\n  };\n\n  useDebounce(\n    () => {\n      if (filters.searchQuery !== searchQuery) {\n        setPage(1);\n        setAnswers([]);\n        setFilters({ ...filters, searchQuery: searchQuery });\n      }\n    },\n    400,\n    [searchQuery],\n  );\n\n  useEffect(() => {\n    let filtersApplied = false;\n    searchParams.forEach((value, key) => {\n      try {\n        if (key === 'page') {\n          const pv = Number.parseInt(value, 10);\n          if (pv > 0) {\n            setPage(pv);\n          } else {\n            setPage(1);\n            setAnswers([]);\n          }\n        } else if (key === 'answersPerPage') {\n          const qpp = Number.parseInt(value, 10);\n          if (qpp > 0) setAnswersPerPage(qpp);\n        } else if (filterKeys.includes(key as FilterKey)) {\n          filtersApplied = true;\n          if (key === 'tags') {\n            filters.tags = filterTags(value.split(',')) ?? [];\n          } else if (key === 'entities') {\n            filters.entities = value.split(',');\n          } else {\n            (filters as any)[key] = value;\n          }\n        }\n      } catch (_e) {\n        // NOOP\n      }\n    });\n    setFilters(filters);\n    if (filtersApplied) {\n      setShowFilterPanel(true);\n    }\n  }, [searchParams, filters]);\n\n  const {\n    value: response,\n    loading,\n    error,\n  } = useQetaApi(\n    api => {\n      return api.getAnswers({\n        limit: answersPerPage,\n        offset: (page - 1) * answersPerPage,\n        author,\n        ...(getFiltersWithDateRange(filters) as any),\n      });\n    },\n    [page, filters, answersPerPage],\n  );\n\n  useEffect(() => {\n    if (response) {\n      if (page === 1) {\n        setAnswers(response.answers);\n      } else {\n        setAnswers(prev => [...prev, ...response.answers]);\n      }\n      setHasMore(response.answers.length >= answersPerPage);\n      setTotal(response.total);\n    }\n  }, [response, page, answersPerPage]);\n\n  const combinedResponse = response\n    ? {\n        ...response,\n        answers: page === 1 && !loading ? response.answers : answers,\n        total,\n      }\n    : undefined;\n\n  let shownTitle = title;\n  let link = undefined;\n  if (author) {\n    shownTitle = `${t('answerContainer.title.answersBy')} `;\n    link = <EntityRefLink entityRef={author} hideIcon defaultKind=\"user\" />;\n  } else if (entity) {\n    shownTitle = `${t('answerContainer.title.answersAbout')} `;\n    link = <EntityRefLink entityRef={entity} />;\n  } else if (tags) {\n    shownTitle = t('answerContainer.title.answersTagged', {\n      tags: tags.join(', '),\n    });\n  }\n\n  return (\n    <Box className=\"qetaAnswersContainer\">\n      {showTitle && (\n        <Box mb={3}>\n          <Grid container alignItems=\"center\" justifyContent=\"space-between\">\n            <Grid item>\n              <Typography\n                variant=\"h5\"\n                className=\"qetaAnswersContainerTitle\"\n                style={{ fontWeight: 500, paddingBottom: 2 }}\n              >\n                {shownTitle} {link}\n              </Typography>\n            </Grid>\n          </Grid>\n        </Box>\n      )}\n      <Grid container alignItems=\"flex-end\" justifyContent=\"space-between\">\n        <Grid item xs={12} md={4}>\n          <SearchBar\n            onSearch={onSearchQueryChange}\n            label={t('answerContainer.search.label')}\n            loading={loading}\n          />\n        </Grid>\n      </Grid>\n      {response && (\n        <Box mt={2} mb={2}>\n          <Grid container alignItems=\"center\" justifyContent=\"space-between\">\n            <Grid item>\n              <Typography\n                variant=\"h6\"\n                className=\"qetaAnswersContainerAnswerCount\"\n                style={{ fontWeight: 500, paddingBottom: 2 }}\n              >\n                {t('common.answersCount', { count: response?.total ?? 0 })}\n              </Typography>\n            </Grid>\n            {(showFilters ?? true) && (\n              <Grid item>\n                <Button\n                  onClick={() => {\n                    setShowFilterPanel(!showFilterPanel);\n                  }}\n                  className=\"qetaAnswerContainerFilterPanelBtn\"\n                  startIcon={<FilterList />}\n                >\n                  {t('filterPanel.filterButton')}\n                </Button>\n              </Grid>\n            )}\n          </Grid>\n        </Box>\n      )}\n      {(showFilters ?? true) && (\n        <Collapse in={showFilterPanel}>\n          <FilterPanel<AnswerFilters>\n            onChange={onFilterChange}\n            filters={filters}\n          />\n        </Collapse>\n      )}\n\n      <AnswerList\n        loading={loading}\n        error={error}\n        response={combinedResponse}\n        entity={entity}\n        entityPage={entity !== undefined}\n        tags={tags}\n        hasMore={hasMore}\n        loadNextPage={() => setPage(prev => prev + 1)}\n      />\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"AnswersContainer.esm.js","sources":["../../../src/components/AnswersContainer/AnswersContainer.tsx"],"sourcesContent":["import { AnswerResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { EntityRefLink } from '@backstage/plugin-catalog-react';\nimport { getFiltersWithDateRange } from '../../utils/utils';\nimport { AnswerFilters } from '../FilterPanel/FilterPanel';\nimport {\n  QetaEntityContainer,\n  QetaEntityContainerProps,\n} from '../QetaEntityContainer/QetaEntityContainer';\nimport { AnswerListItem } from './AnswerListItem';\nimport { AnswersGridItem } from './AnswersGridItem';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation';\n\nexport interface AnswersContainerProps {\n  tags?: string[];\n  author?: string;\n  entity?: string;\n  showFilters?: boolean;\n  showTitle?: boolean;\n  title?: string;\n  prefix?: string;\n}\n\nexport const AnswersContainer = (props: AnswersContainerProps) => {\n  const { tags, author, entity, showFilters, title, showTitle, prefix } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const fetchAnswers: QetaEntityContainerProps<\n    AnswerResponse,\n    AnswerFilters\n  >['fetch'] = async (api, limit, offset, filters) => {\n    return api\n      .getAnswers({\n        limit,\n        offset,\n        author,\n        ...(getFiltersWithDateRange(filters) as any),\n      })\n      .then(response => ({\n        items: response.answers,\n        total: response.total,\n      }));\n  };\n\n  let resolvedTitle: React.ReactNode = title;\n  if (author) {\n    resolvedTitle = (\n      <>\n        {t('answerContainer.title.answersBy', {})}{' '}\n        <EntityRefLink entityRef={author} hideIcon defaultKind=\"user\" />\n      </>\n    );\n  } else if (entity) {\n    resolvedTitle = (\n      <>\n        {t('answerContainer.title.answersAbout', {})}{' '}\n        <EntityRefLink entityRef={entity} />\n      </>\n    );\n  } else if (tags) {\n    resolvedTitle = t('answerContainer.title.answersTagged', {\n      tags: tags.join(', '),\n    });\n  }\n\n  return (\n    <QetaEntityContainer<AnswerResponse, AnswerFilters>\n      prefix={prefix ?? 'answers'}\n      fetch={fetchAnswers}\n      renderListItem={(answer: AnswerResponse) => (\n        <AnswerListItem answer={answer} entity={entity} />\n      )}\n      renderGridItem={(answer: AnswerResponse) => (\n        <AnswersGridItem answer={answer} entity={entity} />\n      )}\n      defaultView=\"list\"\n      filterPanelProps={\n        showFilters ?? true\n          ? {\n              answerFilters: true,\n            }\n          : undefined\n      }\n      initialFilters={{\n        order: 'desc',\n        orderBy: 'created',\n        searchQuery: '',\n        dateRange: '',\n        entities: entity ? [entity] : undefined,\n        tags: tags ?? [],\n        noVotes: 'false',\n      }}\n      filterKeys={[\n        'orderBy',\n        'searchQuery',\n        'dateRange',\n        'noVotes',\n        'tags',\n        'entities',\n      ]}\n      title={showTitle ? resolvedTitle : undefined}\n      defaultPageSize={25}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAuBa,MAAA,gBAAA,GAAmB,CAAC,KAAiC,KAAA;AAChE,EAAM,MAAA,EAAE,MAAM,MAAQ,EAAA,MAAA,EAAQ,aAAa,KAAO,EAAA,SAAA,EAAW,QAAW,GAAA,KAAA;AACxE,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAA,MAAM,YAGO,GAAA,OAAO,GAAK,EAAA,KAAA,EAAO,QAAQ,OAAY,KAAA;AAClD,IAAA,OAAO,IACJ,UAAW,CAAA;AAAA,MACV,KAAA;AAAA,MACA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,GAAI,wBAAwB,OAAO;AAAA,KACpC,CACA,CAAA,IAAA,CAAK,CAAa,QAAA,MAAA;AAAA,MACjB,OAAO,QAAS,CAAA,OAAA;AAAA,MAChB,OAAO,QAAS,CAAA;AAAA,KAChB,CAAA,CAAA;AAAA,GACN;AAEA,EAAA,IAAI,aAAiC,GAAA,KAAA;AACrC,EAAA,IAAI,MAAQ,EAAA;AACV,IAAA,aAAA,mBAEK,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,MAAE,CAAA,CAAA,iCAAA,EAAmC,EAAE,CAAA;AAAA,MAAG,GAAA;AAAA,0BAC1C,aAAc,EAAA,EAAA,SAAA,EAAW,QAAQ,QAAQ,EAAA,IAAA,EAAC,aAAY,MAAO,EAAA;AAAA,KAChE,EAAA,CAAA;AAAA,aAEO,MAAQ,EAAA;AACjB,IAAA,aAAA,mBAEK,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,MAAE,CAAA,CAAA,oCAAA,EAAsC,EAAE,CAAA;AAAA,MAAG,GAAA;AAAA,sBAC9C,GAAA,CAAC,aAAc,EAAA,EAAA,SAAA,EAAW,MAAQ,EAAA;AAAA,KACpC,EAAA,CAAA;AAAA,aAEO,IAAM,EAAA;AACf,IAAA,aAAA,GAAgB,EAAE,qCAAuC,EAAA;AAAA,MACvD,IAAA,EAAM,IAAK,CAAA,IAAA,CAAK,IAAI;AAAA,KACrB,CAAA;AAAA;AAGH,EACE,uBAAA,GAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACC,QAAQ,MAAU,IAAA,SAAA;AAAA,MAClB,KAAO,EAAA,YAAA;AAAA,MACP,gBAAgB,CAAC,MAAA,qBACd,GAAA,CAAA,cAAA,EAAA,EAAe,QAAgB,MAAgB,EAAA,CAAA;AAAA,MAElD,gBAAgB,CAAC,MAAA,qBACd,GAAA,CAAA,eAAA,EAAA,EAAgB,QAAgB,MAAgB,EAAA,CAAA;AAAA,MAEnD,WAAY,EAAA,MAAA;AAAA,MACZ,gBAAA,EACE,eAAe,IACX,GAAA;AAAA,QACE,aAAe,EAAA;AAAA,OAEjB,GAAA,KAAA,CAAA;AAAA,MAEN,cAAgB,EAAA;AAAA,QACd,KAAO,EAAA,MAAA;AAAA,QACP,OAAS,EAAA,SAAA;AAAA,QACT,WAAa,EAAA,EAAA;AAAA,QACb,SAAW,EAAA,EAAA;AAAA,QACX,QAAU,EAAA,MAAA,GAAS,CAAC,MAAM,CAAI,GAAA,KAAA,CAAA;AAAA,QAC9B,IAAA,EAAM,QAAQ,EAAC;AAAA,QACf,OAAS,EAAA;AAAA,OACX;AAAA,MACA,UAAY,EAAA;AAAA,QACV,SAAA;AAAA,QACA,aAAA;AAAA,QACA,WAAA;AAAA,QACA,SAAA;AAAA,QACA,MAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,KAAA,EAAO,YAAY,aAAgB,GAAA,KAAA,CAAA;AAAA,MACnC,eAAiB,EAAA;AAAA;AAAA,GACnB;AAEJ;;;;"}

package/dist/components/AnswersContainer/AnswersGridItem.esm.js

@@ -0,0 +1,167 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState } from 'react';
+import DOMPurify from 'dompurify';
+import { truncate, removeMarkdownFormatting } from '@drodil/backstage-plugin-qeta-common';
+import { useRouteRef } from '@backstage/core-plugin-api';
+import { questionRouteRef } from '../../routes.esm.js';
+import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
+import { qetaTranslationRef } from '../../translation.esm.js';
+import { makeStyles, Card, CardContent, Typography, Box, Tooltip } from '@material-ui/core';
+import numeral from 'numeral';
+import ThumbUp from '@material-ui/icons/ThumbUp';
+import CheckCircle from '@material-ui/icons/CheckCircle';
+import { AuthorBox } from '../AuthorBox/AuthorBox.esm.js';
+import { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities.esm.js';
+import { ClickableLink } from '../Utility/ClickableLink.esm.js';
+
+const useStyles = makeStyles((theme) => ({
+  card: {
+    height: "100%",
+    display: "flex",
+    flexDirection: "column",
+    cursor: "pointer",
+    position: "relative",
+    "&:hover::after": {
+      content: '""',
+      position: "absolute",
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      backgroundColor: "currentColor",
+      opacity: theme.palette.action.hoverOpacity || 0.04,
+      borderRadius: theme.shape.borderRadius,
+      pointerEvents: "none"
+    }
+  },
+  contentContainer: {
+    padding: theme.spacing(2),
+    height: "100%",
+    display: "flex",
+    flexDirection: "column"
+  },
+  title: {
+    fontWeight: 700,
+    fontSize: "1.1rem",
+    color: theme.palette.text.primary,
+    marginBottom: theme.spacing(1),
+    display: "-webkit-box",
+    WebkitLineClamp: 2,
+    WebkitBoxOrient: "vertical",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    lineHeight: 1.2
+  },
+  content: {
+    color: theme.palette.text.secondary,
+    margin: theme.spacing(1, 0),
+    display: "-webkit-box",
+    WebkitLineClamp: 3,
+    WebkitBoxOrient: "vertical",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    fontSize: "0.9rem",
+    flexGrow: 1
+  },
+  footer: {
+    display: "flex",
+    flexDirection: "column",
+    gap: theme.spacing(2),
+    marginTop: "auto"
+  },
+  metaContainer: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.spacing(2)
+  },
+  metaItem: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.spacing(0.5),
+    color: theme.palette.text.secondary,
+    fontSize: "0.875rem"
+  },
+  metaItemActive: {
+    color: theme.palette.success.main
+  },
+  metaIcon: {
+    fontSize: 18
+  }
+}));
+function formatShortNumber(num) {
+  return num >= 1e3 ? numeral(num).format("0.0 a") : num.toString();
+}
+const AnswersGridItem = (props) => {
+  const { answer, entity } = props;
+  const [score] = useState(answer.score);
+  const { t } = useTranslationRef(qetaTranslationRef);
+  const classes = useStyles();
+  const questionRoute = useRouteRef(questionRouteRef);
+  const href = entity ? `${questionRoute({
+    id: answer.postId.toString(10)
+  })}?entity=${entity}#answer_${answer.id}` : `${questionRoute({
+    id: answer.postId.toString(10)
+  })}#answer_${answer.id}`;
+  return /* @__PURE__ */ jsx(Card, { className: classes.card, children: /* @__PURE__ */ jsx(ClickableLink, { href, ariaLabel: answer.post?.title ?? "", children: /* @__PURE__ */ jsxs(CardContent, { className: classes.contentContainer, children: [
+    /* @__PURE__ */ jsx(Typography, { component: "div", className: classes.title, children: t("answer.questionTitle", {
+      question: answer.post?.title ?? ""
+    }) }),
+    /* @__PURE__ */ jsx(
+      Typography,
+      {
+        variant: "body2",
+        component: "div",
+        className: classes.content,
+        children: /* @__PURE__ */ jsx(
+          "span",
+          {
+            dangerouslySetInnerHTML: {
+              __html: DOMPurify.sanitize(
+                truncate(removeMarkdownFormatting(answer.content), 200)
+              )
+            }
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: classes.footer, children: [
+      /* @__PURE__ */ jsxs(
+        Box,
+        {
+          display: "flex",
+          justifyContent: "space-between",
+          alignItems: "center",
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: classes.metaContainer, children: [
+              /* @__PURE__ */ jsx(Tooltip, { title: t("common.votesCount", { count: score }), arrow: true, children: /* @__PURE__ */ jsxs("div", { className: classes.metaItem, children: [
+                /* @__PURE__ */ jsx(ThumbUp, { className: classes.metaIcon }),
+                /* @__PURE__ */ jsx("span", { children: formatShortNumber(score) })
+              ] }) }),
+              answer.correct && /* @__PURE__ */ jsx(Tooltip, { title: t("authorBox.correctAnswer"), arrow: true, children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: `${classes.metaItem} ${classes.metaItemActive}`,
+                  children: /* @__PURE__ */ jsx(CheckCircle, { className: classes.metaIcon })
+                }
+              ) })
+            ] }),
+            /* @__PURE__ */ jsx(
+              AuthorBox,
+              {
+                userEntityRef: answer.author,
+                time: answer.created,
+                label: t("answer.answeredTime"),
+                anonymous: answer.anonymous,
+                compact: true
+              }
+            )
+          ]
+        }
+      ),
+      answer.post && /* @__PURE__ */ jsx(Box, { display: "flex", flexWrap: "wrap", style: { gap: "4px" }, children: /* @__PURE__ */ jsx(TagsAndEntities, { entity: answer.post }) })
+    ] })
+  ] }) }) });
+};
+
+export { AnswersGridItem };
+//# sourceMappingURL=AnswersGridItem.esm.js.map

package/dist/components/AnswersContainer/AnswersGridItem.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnswersGridItem.esm.js","sources":["../../../src/components/AnswersContainer/AnswersGridItem.tsx"],"sourcesContent":["import { useState } from 'react';\nimport DOMPurify from 'dompurify';\nimport {\n  AnswerResponse,\n  removeMarkdownFormatting,\n  truncate,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { questionRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation';\nimport {\n  Box,\n  Card,\n  CardContent,\n  makeStyles,\n  Tooltip,\n  Typography,\n} from '@material-ui/core';\nimport numeral from 'numeral';\nimport ThumbUp from '@material-ui/icons/ThumbUp';\nimport CheckCircle from '@material-ui/icons/CheckCircle';\nimport { AuthorBox } from '../AuthorBox/AuthorBox';\nimport { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities';\nimport { ClickableLink } from '../Utility/ClickableLink';\n\nexport interface AnswersGridItemProps {\n  answer: AnswerResponse;\n  entity?: string;\n}\n\nconst useStyles = makeStyles(theme => ({\n  card: {\n    height: '100%',\n    display: 'flex',\n    flexDirection: 'column',\n    cursor: 'pointer',\n    position: 'relative',\n    '&:hover::after': {\n      content: '\"\"',\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      right: 0,\n      bottom: 0,\n      backgroundColor: 'currentColor',\n      opacity: theme.palette.action.hoverOpacity || 0.04,\n      borderRadius: theme.shape.borderRadius,\n      pointerEvents: 'none',\n    },\n  },\n  contentContainer: {\n    padding: theme.spacing(2),\n    height: '100%',\n    display: 'flex',\n    flexDirection: 'column',\n  },\n  title: {\n    fontWeight: 700,\n    fontSize: '1.1rem',\n    color: theme.palette.text.primary,\n    marginBottom: theme.spacing(1),\n    display: '-webkit-box',\n    WebkitLineClamp: 2,\n    WebkitBoxOrient: 'vertical',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    lineHeight: 1.2,\n  },\n  content: {\n    color: theme.palette.text.secondary,\n    margin: theme.spacing(1, 0),\n    display: '-webkit-box',\n    WebkitLineClamp: 3,\n    WebkitBoxOrient: 'vertical',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    fontSize: '0.9rem',\n    flexGrow: 1,\n  },\n  footer: {\n    display: 'flex',\n    flexDirection: 'column',\n    gap: theme.spacing(2),\n    marginTop: 'auto',\n  },\n  metaContainer: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(2),\n  },\n  metaItem: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(0.5),\n    color: theme.palette.text.secondary,\n    fontSize: '0.875rem',\n  },\n  metaItemActive: {\n    color: theme.palette.success.main,\n  },\n  metaIcon: {\n    fontSize: 18,\n  },\n}));\n\nfunction formatShortNumber(num: number): string {\n  return num >= 1000 ? numeral(num).format('0.0 a') : num.toString();\n}\n\nexport const AnswersGridItem = (props: AnswersGridItemProps) => {\n  const { answer, entity } = props;\n  const [score] = useState(answer.score);\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const classes = useStyles();\n\n  const questionRoute = useRouteRef(questionRouteRef);\n\n  const href = entity\n    ? `${questionRoute({\n        id: answer.postId.toString(10),\n      })}?entity=${entity}#answer_${answer.id}`\n    : `${questionRoute({\n        id: answer.postId.toString(10),\n      })}#answer_${answer.id}`;\n\n  return (\n    <Card className={classes.card}>\n      <ClickableLink href={href} ariaLabel={answer.post?.title ?? ''}>\n        <CardContent className={classes.contentContainer}>\n          <Typography component=\"div\" className={classes.title}>\n            {t('answer.questionTitle', {\n              question: answer.post?.title ?? '',\n            })}\n          </Typography>\n\n          <Typography\n            variant=\"body2\"\n            component=\"div\"\n            className={classes.content}\n          >\n            <span\n              dangerouslySetInnerHTML={{\n                __html: DOMPurify.sanitize(\n                  truncate(removeMarkdownFormatting(answer.content), 200),\n                ),\n              }}\n            />\n          </Typography>\n\n          <div className={classes.footer}>\n            <Box\n              display=\"flex\"\n              justifyContent=\"space-between\"\n              alignItems=\"center\"\n            >\n              <div className={classes.metaContainer}>\n                <Tooltip title={t('common.votesCount', { count: score })} arrow>\n                  <div className={classes.metaItem}>\n                    <ThumbUp className={classes.metaIcon} />\n                    <span>{formatShortNumber(score)}</span>\n                  </div>\n                </Tooltip>\n                {answer.correct && (\n                  <Tooltip title={t('authorBox.correctAnswer')} arrow>\n                    <div\n                      className={`${classes.metaItem} ${classes.metaItemActive}`}\n                    >\n                      <CheckCircle className={classes.metaIcon} />\n                    </div>\n                  </Tooltip>\n                )}\n              </div>\n              <AuthorBox\n                userEntityRef={answer.author}\n                time={answer.created}\n                label={t('answer.answeredTime')}\n                anonymous={answer.anonymous}\n                compact\n              />\n            </Box>\n            {answer.post && (\n              <Box display=\"flex\" flexWrap=\"wrap\" style={{ gap: '4px' }}>\n                <TagsAndEntities entity={answer.post} />\n              </Box>\n            )}\n          </div>\n        </CardContent>\n      </ClickableLink>\n    </Card>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/ArticleContent/ArticleButtons.esm.js

@@ -21,6 +21,7 @@ import RestoreIcon from '@material-ui/icons/Restore';
 import { useVoting } from '../../hooks/useVoting.esm.js';
 import { useNavigate } from 'react-router-dom';
 import 'react-use';
+import '../../hooks/useListItemStyles.esm.js';
 import '@backstage/catalog-model';
 import 'dataloader';
 import '@backstage/plugin-catalog-react';
@@ -29,6 +30,8 @@ import { useIsModerator } from '../../hooks/useIsModerator.esm.js';
 import '@backstage/plugin-permission-react';
 import '@drodil/backstage-plugin-qeta-common';
 import '@backstage/plugin-permission-common';
+import 'react-use/lib/useDebounce';
+import '../FilterPanel/FilterPanel.esm.js';
 
 const useLocalStyles = makeStyles(
   (theme) => {

package/dist/components/ArticleContent/ArticleButtons.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ArticleButtons.esm.js","sources":["../../../src/components/ArticleContent/ArticleButtons.tsx"],"sourcesContent":["import { PostResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { useState } from 'react';\nimport ArrowUpward from '@material-ui/icons/ArrowUpward';\nimport {\n  Grid,\n  IconButton,\n  makeStyles,\n  Tooltip,\n  Typography,\n} from '@material-ui/core';\nimport ArrowDownward from '@material-ui/icons/ArrowDownward';\nimport { FavoriteButton } from '../Buttons/FavoriteButton';\nimport { LinkButton } from '../Buttons/LinkButton';\nimport { alertApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { editArticleRouteRef } from '../../routes';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport { DeleteModal } from '../Modals';\nimport EditIcon from '@material-ui/icons/Edit';\nimport RestoreIcon from '@material-ui/icons/Restore';\nimport { useVoting } from '../../hooks/useVoting';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { useNavigate } from 'react-router-dom';\nimport { useIsModerator } from '../../hooks';\nimport { qetaApiRef } from '../../api.ts';\n\nexport type QetaArticleButtonsClassKey = 'container' | 'scoreText';\n\nexport const useLocalStyles = makeStyles(\n  theme => {\n    return {\n      container: {\n        width: '100%',\n        paddingTop: '0.5rem',\n        paddingBottom: '0.5rem',\n        borderTop: `1px solid ${theme.palette.background.paper}`,\n        borderBottom: `1px solid ${theme.palette.background.paper}`,\n      },\n      scoreText: {\n        marginLeft: '0.5rem',\n        userSelect: 'none',\n      },\n    };\n  },\n  { name: 'QetaArticleButtons' },\n);\n\nexport const ArticleButtons = (props: { post: PostResponse }) => {\n  const { post } = props;\n  const { voteUpTooltip, ownVote, voteUp, score, voteDownTooltip, voteDown } =\n    useVoting(post);\n  const styles = useLocalStyles();\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const navigate = useNavigate();\n  const editArticleRoute = useRouteRef(editArticleRouteRef);\n  const { isModerator } = useIsModerator();\n  const qetaApi = useApi(qetaApiRef);\n  const [deleteModalOpen, setDeleteModalOpen] = useState(false);\n  const handleDeleteModalOpen = () => setDeleteModalOpen(true);\n  const handleDeleteModalClose = () => setDeleteModalOpen(false);\n  const alertApi = useApi(alertApiRef);\n\n  const own = props.post.own ?? false;\n\n  const isDisabled = () => {\n    return own || post.status !== 'active';\n  };\n\n  const getVoteUpTooltip = () => {\n    if (isDisabled()) {\n      return '';\n    }\n    return voteUpTooltip;\n  };\n\n  const getVoteDownTooltip = () => {\n    if (isDisabled()) {\n      return '';\n    }\n    return voteDownTooltip;\n  };\n\n  const restoreArticle = async () => {\n    qetaApi\n      .restorePost(post.id)\n      .catch(e =>\n        alertApi.post({\n          message: e.message,\n          display: 'transient',\n          severity: 'error',\n        }),\n      )\n      .then(() => {\n        window.location.reload();\n      });\n  };\n\n  return (\n    <div className={styles.container}>\n      <Grid container justifyContent=\"space-between\">\n        <Grid item>\n          <Tooltip title={getVoteUpTooltip()}>\n            <span>\n              <IconButton\n                aria-label=\"vote up\"\n                color={ownVote > 0 ? 'primary' : 'default'}\n                className={ownVote > 0 ? 'qetaVoteUpSelected' : 'qetaVoteUp'}\n                disabled={isDisabled()}\n                size=\"small\"\n                onClick={voteUp}\n              >\n                <ArrowUpward />\n              </IconButton>\n            </span>\n          </Tooltip>\n          <Tooltip title={getVoteDownTooltip()}>\n            <span>\n              <IconButton\n                aria-label=\"vote down\"\n                color={ownVote < 0 ? 'primary' : 'default'}\n                className={\n                  ownVote < 0 ? 'qetaVoteDownSelected' : 'qetaVoteDown'\n                }\n                disabled={isDisabled()}\n                size=\"small\"\n                onClick={voteDown}\n              >\n                <ArrowDownward />\n              </IconButton>\n            </span>\n          </Tooltip>\n          <Tooltip title={t('common.score', { score: score.toString(10) })}>\n            <Typography className={styles.scoreText} display=\"inline\">\n              {score}\n            </Typography>\n          </Tooltip>\n        </Grid>\n        <Grid item>\n          <FavoriteButton entity={post} />\n          <LinkButton entity={post} />\n          {post.canEdit && post.status !== 'obsolete' && (\n            <Tooltip title={t('articlePage.editButton')}>\n              <IconButton\n                size=\"small\"\n                onClick={() =>\n                  navigate(\n                    editArticleRoute({\n                      id: post.id.toString(10),\n                    }),\n                  )\n                }\n                color=\"primary\"\n              >\n                <EditIcon />\n              </IconButton>\n            </Tooltip>\n          )}\n          {post.canDelete && (\n            <>\n              <Tooltip title={t('articlePage.deleteButton')}>\n                <IconButton\n                  size=\"small\"\n                  onClick={handleDeleteModalOpen}\n                  color=\"secondary\"\n                >\n                  <DeleteIcon />\n                </IconButton>\n              </Tooltip>\n              <DeleteModal\n                open={deleteModalOpen}\n                onClose={handleDeleteModalClose}\n                entity={post}\n              />\n            </>\n          )}\n          {isModerator && post.status === 'deleted' && (\n            <Tooltip title={t('articlePage.restoreButton')}>\n              <IconButton\n                size=\"small\"\n                onClick={() => restoreArticle()}\n                color=\"primary\"\n              >\n                <RestoreIcon />\n              </IconButton>\n            </Tooltip>\n          )}\n        </Grid>\n      </Grid>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,CAAS,KAAA,KAAA;AACP,IAAO,OAAA;AAAA,MACL,SAAW,EAAA;AAAA,QACT,KAAO,EAAA,MAAA;AAAA,QACP,UAAY,EAAA,QAAA;AAAA,QACZ,aAAe,EAAA,QAAA;AAAA,QACf,SAAW,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,WAAW,KAAK,CAAA,CAAA;AAAA,QACtD,YAAc,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,WAAW,KAAK,CAAA;AAAA,OAC3D;AAAA,MACA,SAAW,EAAA;AAAA,QACT,UAAY,EAAA,QAAA;AAAA,QACZ,UAAY,EAAA;AAAA;AACd,KACF;AAAA,GACF;AAAA,EACA,EAAE,MAAM,oBAAqB;AAC/B;AAEa,MAAA,cAAA,GAAiB,CAAC,KAAkC,KAAA;AAC/D,EAAM,MAAA,EAAE,MAAS,GAAA,KAAA;AACjB,EAAM,MAAA,EAAE,eAAe,OAAS,EAAA,MAAA,EAAQ,OAAO,eAAiB,EAAA,QAAA,EAC9D,GAAA,SAAA,CAAU,IAAI,CAAA;AAChB,EAAA,MAAM,SAAS,cAAe,EAAA;AAC9B,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAM,MAAA,gBAAA,GAAmB,YAAY,mBAAmB,CAAA;AACxD,EAAM,MAAA,EAAE,WAAY,EAAA,GAAI,cAAe,EAAA;AACvC,EAAM,MAAA,OAAA,GAAU,OAAO,UAAU,CAAA;AACjC,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAI,SAAS,KAAK,CAAA;AAC5D,EAAM,MAAA,qBAAA,GAAwB,MAAM,kBAAA,CAAmB,IAAI,CAAA;AAC3D,EAAM,MAAA,sBAAA,GAAyB,MAAM,kBAAA,CAAmB,KAAK,CAAA;AAC7D,EAAM,MAAA,QAAA,GAAW,OAAO,WAAW,CAAA;AAEnC,EAAM,MAAA,GAAA,GAAM,KAAM,CAAA,IAAA,CAAK,GAAO,IAAA,KAAA;AAE9B,EAAA,MAAM,aAAa,MAAM;AACvB,IAAO,OAAA,GAAA,IAAO,KAAK,MAAW,KAAA,QAAA;AAAA,GAChC;AAEA,EAAA,MAAM,mBAAmB,MAAM;AAC7B,IAAA,IAAI,YAAc,EAAA;AAChB,MAAO,OAAA,EAAA;AAAA;AAET,IAAO,OAAA,aAAA;AAAA,GACT;AAEA,EAAA,MAAM,qBAAqB,MAAM;AAC/B,IAAA,IAAI,YAAc,EAAA;AAChB,MAAO,OAAA,EAAA;AAAA;AAET,IAAO,OAAA,eAAA;AAAA,GACT;AAEA,EAAA,MAAM,iBAAiB,YAAY;AACjC,IACG,OAAA,CAAA,WAAA,CAAY,IAAK,CAAA,EAAE,CACnB,CAAA,KAAA;AAAA,MAAM,CAAA,CAAA,KACL,SAAS,IAAK,CAAA;AAAA,QACZ,SAAS,CAAE,CAAA,OAAA;AAAA,QACX,OAAS,EAAA,WAAA;AAAA,QACT,QAAU,EAAA;AAAA,OACX;AAAA,KACH,CACC,KAAK,MAAM;AACV,MAAA,MAAA,CAAO,SAAS,MAAO,EAAA;AAAA,KACxB,CAAA;AAAA,GACL;AAEA,EACE,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,MAAO,CAAA,SAAA,EACrB,+BAAC,IAAK,EAAA,EAAA,SAAA,EAAS,IAAC,EAAA,cAAA,EAAe,eAC7B,EAAA,QAAA,EAAA;AAAA,oBAAC,IAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IACR,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,OAAQ,EAAA,EAAA,KAAA,EAAO,gBAAiB,EAAA,EAC/B,8BAAC,MACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,YAAW,EAAA,SAAA;AAAA,UACX,KAAA,EAAO,OAAU,GAAA,CAAA,GAAI,SAAY,GAAA,SAAA;AAAA,UACjC,SAAA,EAAW,OAAU,GAAA,CAAA,GAAI,oBAAuB,GAAA,YAAA;AAAA,UAChD,UAAU,UAAW,EAAA;AAAA,UACrB,IAAK,EAAA,OAAA;AAAA,UACL,OAAS,EAAA,MAAA;AAAA,UAET,8BAAC,WAAY,EAAA,EAAA;AAAA;AAAA,SAEjB,CACF,EAAA,CAAA;AAAA,0BACC,OAAQ,EAAA,EAAA,KAAA,EAAO,kBAAmB,EAAA,EACjC,8BAAC,MACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,YAAW,EAAA,WAAA;AAAA,UACX,KAAA,EAAO,OAAU,GAAA,CAAA,GAAI,SAAY,GAAA,SAAA;AAAA,UACjC,SAAA,EACE,OAAU,GAAA,CAAA,GAAI,sBAAyB,GAAA,cAAA;AAAA,UAEzC,UAAU,UAAW,EAAA;AAAA,UACrB,IAAK,EAAA,OAAA;AAAA,UACL,OAAS,EAAA,QAAA;AAAA,UAET,8BAAC,aAAc,EAAA,EAAA;AAAA;AAAA,SAEnB,CACF,EAAA,CAAA;AAAA,sBACA,GAAA,CAAC,WAAQ,KAAO,EAAA,CAAA,CAAE,gBAAgB,EAAE,KAAA,EAAO,MAAM,QAAS,CAAA,EAAE,GAAG,CAAA,EAC7D,8BAAC,UAAW,EAAA,EAAA,SAAA,EAAW,OAAO,SAAW,EAAA,OAAA,EAAQ,QAC9C,EAAA,QAAA,EAAA,KAAA,EACH,CACF,EAAA;AAAA,KACF,EAAA,CAAA;AAAA,oBACA,IAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,IACR,EAAA,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,cAAA,EAAA,EAAe,QAAQ,IAAM,EAAA,CAAA;AAAA,sBAC9B,GAAA,CAAC,UAAW,EAAA,EAAA,MAAA,EAAQ,IAAM,EAAA,CAAA;AAAA,MACzB,IAAA,CAAK,OAAW,IAAA,IAAA,CAAK,MAAW,KAAA,UAAA,wBAC9B,OAAQ,EAAA,EAAA,KAAA,EAAO,CAAE,CAAA,wBAAwB,CACxC,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,IAAK,EAAA,OAAA;AAAA,UACL,SAAS,MACP,QAAA;AAAA,YACE,gBAAiB,CAAA;AAAA,cACf,EAAI,EAAA,IAAA,CAAK,EAAG,CAAA,QAAA,CAAS,EAAE;AAAA,aACxB;AAAA,WACH;AAAA,UAEF,KAAM,EAAA,SAAA;AAAA,UAEN,8BAAC,QAAS,EAAA,EAAA;AAAA;AAAA,OAEd,EAAA,CAAA;AAAA,MAED,IAAA,CAAK,6BAEF,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,OAAQ,EAAA,EAAA,KAAA,EAAO,CAAE,CAAA,0BAA0B,CAC1C,EAAA,QAAA,kBAAA,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,IAAK,EAAA,OAAA;AAAA,YACL,OAAS,EAAA,qBAAA;AAAA,YACT,KAAM,EAAA,WAAA;AAAA,YAEN,8BAAC,UAAW,EAAA,EAAA;AAAA;AAAA,SAEhB,EAAA,CAAA;AAAA,wBACA,GAAA;AAAA,UAAC,WAAA;AAAA,UAAA;AAAA,YACC,IAAM,EAAA,eAAA;AAAA,YACN,OAAS,EAAA,sBAAA;AAAA,YACT,MAAQ,EAAA;AAAA;AAAA;AACV,OACF,EAAA,CAAA;AAAA,MAED,WAAA,IAAe,KAAK,MAAW,KAAA,SAAA,wBAC7B,OAAQ,EAAA,EAAA,KAAA,EAAO,CAAE,CAAA,2BAA2B,CAC3C,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,IAAK,EAAA,OAAA;AAAA,UACL,OAAA,EAAS,MAAM,cAAe,EAAA;AAAA,UAC9B,KAAM,EAAA,SAAA;AAAA,UAEN,8BAAC,WAAY,EAAA,EAAA;AAAA;AAAA,OAEjB,EAAA;AAAA,KAEJ,EAAA;AAAA,GAAA,EACF,CACF,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ArticleButtons.esm.js","sources":["../../../src/components/ArticleContent/ArticleButtons.tsx"],"sourcesContent":["import { PostResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { useState } from 'react';\nimport ArrowUpward from '@material-ui/icons/ArrowUpward';\nimport {\n  Grid,\n  IconButton,\n  makeStyles,\n  Tooltip,\n  Typography,\n} from '@material-ui/core';\nimport ArrowDownward from '@material-ui/icons/ArrowDownward';\nimport { FavoriteButton } from '../Buttons/FavoriteButton';\nimport { LinkButton } from '../Buttons/LinkButton';\nimport { alertApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { editArticleRouteRef } from '../../routes';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport { DeleteModal } from '../Modals';\nimport EditIcon from '@material-ui/icons/Edit';\nimport RestoreIcon from '@material-ui/icons/Restore';\nimport { useVoting } from '../../hooks/useVoting';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { useNavigate } from 'react-router-dom';\nimport { useIsModerator } from '../../hooks';\nimport { qetaApiRef } from '../../api.ts';\n\nexport type QetaArticleButtonsClassKey = 'container' | 'scoreText';\n\nexport const useLocalStyles = makeStyles(\n  theme => {\n    return {\n      container: {\n        width: '100%',\n        paddingTop: '0.5rem',\n        paddingBottom: '0.5rem',\n        borderTop: `1px solid ${theme.palette.background.paper}`,\n        borderBottom: `1px solid ${theme.palette.background.paper}`,\n      },\n      scoreText: {\n        marginLeft: '0.5rem',\n        userSelect: 'none',\n      },\n    };\n  },\n  { name: 'QetaArticleButtons' },\n);\n\nexport const ArticleButtons = (props: { post: PostResponse }) => {\n  const { post } = props;\n  const { voteUpTooltip, ownVote, voteUp, score, voteDownTooltip, voteDown } =\n    useVoting(post);\n  const styles = useLocalStyles();\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const navigate = useNavigate();\n  const editArticleRoute = useRouteRef(editArticleRouteRef);\n  const { isModerator } = useIsModerator();\n  const qetaApi = useApi(qetaApiRef);\n  const [deleteModalOpen, setDeleteModalOpen] = useState(false);\n  const handleDeleteModalOpen = () => setDeleteModalOpen(true);\n  const handleDeleteModalClose = () => setDeleteModalOpen(false);\n  const alertApi = useApi(alertApiRef);\n\n  const own = props.post.own ?? false;\n\n  const isDisabled = () => {\n    return own || post.status !== 'active';\n  };\n\n  const getVoteUpTooltip = () => {\n    if (isDisabled()) {\n      return '';\n    }\n    return voteUpTooltip;\n  };\n\n  const getVoteDownTooltip = () => {\n    if (isDisabled()) {\n      return '';\n    }\n    return voteDownTooltip;\n  };\n\n  const restoreArticle = async () => {\n    qetaApi\n      .restorePost(post.id)\n      .catch(e =>\n        alertApi.post({\n          message: e.message,\n          display: 'transient',\n          severity: 'error',\n        }),\n      )\n      .then(() => {\n        window.location.reload();\n      });\n  };\n\n  return (\n    <div className={styles.container}>\n      <Grid container justifyContent=\"space-between\">\n        <Grid item>\n          <Tooltip title={getVoteUpTooltip()}>\n            <span>\n              <IconButton\n                aria-label=\"vote up\"\n                color={ownVote > 0 ? 'primary' : 'default'}\n                className={ownVote > 0 ? 'qetaVoteUpSelected' : 'qetaVoteUp'}\n                disabled={isDisabled()}\n                size=\"small\"\n                onClick={voteUp}\n              >\n                <ArrowUpward />\n              </IconButton>\n            </span>\n          </Tooltip>\n          <Tooltip title={getVoteDownTooltip()}>\n            <span>\n              <IconButton\n                aria-label=\"vote down\"\n                color={ownVote < 0 ? 'primary' : 'default'}\n                className={\n                  ownVote < 0 ? 'qetaVoteDownSelected' : 'qetaVoteDown'\n                }\n                disabled={isDisabled()}\n                size=\"small\"\n                onClick={voteDown}\n              >\n                <ArrowDownward />\n              </IconButton>\n            </span>\n          </Tooltip>\n          <Tooltip title={t('common.score', { score: score.toString(10) })}>\n            <Typography className={styles.scoreText} display=\"inline\">\n              {score}\n            </Typography>\n          </Tooltip>\n        </Grid>\n        <Grid item>\n          <FavoriteButton entity={post} />\n          <LinkButton entity={post} />\n          {post.canEdit && post.status !== 'obsolete' && (\n            <Tooltip title={t('articlePage.editButton')}>\n              <IconButton\n                size=\"small\"\n                onClick={() =>\n                  navigate(\n                    editArticleRoute({\n                      id: post.id.toString(10),\n                    }),\n                  )\n                }\n                color=\"primary\"\n              >\n                <EditIcon />\n              </IconButton>\n            </Tooltip>\n          )}\n          {post.canDelete && (\n            <>\n              <Tooltip title={t('articlePage.deleteButton')}>\n                <IconButton\n                  size=\"small\"\n                  onClick={handleDeleteModalOpen}\n                  color=\"secondary\"\n                >\n                  <DeleteIcon />\n                </IconButton>\n              </Tooltip>\n              <DeleteModal\n                open={deleteModalOpen}\n                onClose={handleDeleteModalClose}\n                entity={post}\n              />\n            </>\n          )}\n          {isModerator && post.status === 'deleted' && (\n            <Tooltip title={t('articlePage.restoreButton')}>\n              <IconButton\n                size=\"small\"\n                onClick={() => restoreArticle()}\n                color=\"primary\"\n              >\n                <RestoreIcon />\n              </IconButton>\n            </Tooltip>\n          )}\n        </Grid>\n      </Grid>\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Badges/UserBadges.esm.js

@@ -3,16 +3,21 @@ import { useQetaApi } from '../../hooks/useQetaApi.esm.js';
 import 'react';
 import '@backstage/core-plugin-api';
 import '../../api.esm.js';
+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 '@backstage/catalog-model';
 import 'dataloader';
 import '@backstage/plugin-catalog-react';
-import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
-import { qetaTranslationRef } from '../../translation.esm.js';
 import 'react-use/lib/useAsync';
 import '@backstage/plugin-permission-react';
 import '@drodil/backstage-plugin-qeta-common';
 import '@backstage/plugin-permission-common';
 import { Box, Typography, Grid } from '@material-ui/core';
+import 'react-router-dom';
+import 'react-use/lib/useDebounce';
+import '../FilterPanel/FilterPanel.esm.js';
 import { BadgeChip } from './BadgeChip.esm.js';
 import { Skeleton, Alert } from '@material-ui/lab';
 

package/dist/components/Badges/UserBadges.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserBadges.esm.js","sources":["../../../src/components/Badges/UserBadges.tsx"],"sourcesContent":["import { useQetaApi } from '../../hooks';\nimport { BadgeChip } from './BadgeChip';\nimport { Box, Typography, Grid } from '@material-ui/core';\nimport { Alert, Skeleton } from '@material-ui/lab';\nimport { UserBadge } from '@drodil/backstage-plugin-qeta-common';\n\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation';\n\nconst LEVEL_ORDER: Record<string, number> = {\n  diamond: 0,\n  gold: 1,\n  silver: 2,\n  bronze: 3,\n};\n\nconst sortBadgesByLevel = (badges: UserBadge[]): UserBadge[] => {\n  return [...badges].sort((a, b) => {\n    const levelA = LEVEL_ORDER[a.badge.level] ?? 99;\n    const levelB = LEVEL_ORDER[b.badge.level] ?? 99;\n    return levelA - levelB;\n  });\n};\n\nexport const UserBadges = ({ entityRef }: { entityRef: string }) => {\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const {\n    value: badges,\n    loading,\n    error,\n  } = useQetaApi(api => api.getUserBadges(entityRef), [entityRef]);\n\n  if (loading) {\n    return <Skeleton variant=\"rect\" height={100} />;\n  }\n\n  if (error) {\n    return <Alert severity=\"error\">{t('userBadges.error')}</Alert>;\n  }\n\n  const sortedBadges = badges ? sortBadgesByLevel(badges) : [];\n\n  const groupedBadges = sortedBadges.reduce((acc, userBadge) => {\n    const key = userBadge.badge.id;\n    if (!acc[key]) {\n      acc[key] = {\n        badge: userBadge.badge,\n        count: 0,\n      };\n    }\n    acc[key].count += 1;\n    return acc;\n  }, {} as Record<string, { badge: UserBadge['badge']; count: number }>);\n\n  const displayBadges = Object.values(groupedBadges).sort((a, b) => {\n    const levelA = LEVEL_ORDER[a.badge.level] ?? 99;\n    const levelB = LEVEL_ORDER[b.badge.level] ?? 99;\n    return levelA - levelB;\n  });\n\n  return (\n    <Box>\n      <Typography variant=\"h6\" gutterBottom>\n        {t('userBadges.title')}\n      </Typography>\n      {displayBadges.length === 0 ? (\n        <Typography variant=\"body2\">{t('userBadges.noBadges')}</Typography>\n      ) : (\n        <Grid\n          container\n          spacing={3}\n          style={{ padding: '1em' }}\n          justifyContent=\"center\"\n          alignItems=\"center\"\n        >\n          {displayBadges.map((item, index: number) => (\n            <Grid item key={index}>\n              <BadgeChip badge={item.badge} count={item.count} />\n            </Grid>\n          ))}\n        </Grid>\n      )}\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"UserBadges.esm.js","sources":["../../../src/components/Badges/UserBadges.tsx"],"sourcesContent":["import { useQetaApi } from '../../hooks';\nimport { BadgeChip } from './BadgeChip';\nimport { Box, Typography, Grid } from '@material-ui/core';\nimport { Alert, Skeleton } from '@material-ui/lab';\nimport { UserBadge } from '@drodil/backstage-plugin-qeta-common';\n\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation';\n\nconst LEVEL_ORDER: Record<string, number> = {\n  diamond: 0,\n  gold: 1,\n  silver: 2,\n  bronze: 3,\n};\n\nconst sortBadgesByLevel = (badges: UserBadge[]): UserBadge[] => {\n  return [...badges].sort((a, b) => {\n    const levelA = LEVEL_ORDER[a.badge.level] ?? 99;\n    const levelB = LEVEL_ORDER[b.badge.level] ?? 99;\n    return levelA - levelB;\n  });\n};\n\nexport const UserBadges = ({ entityRef }: { entityRef: string }) => {\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const {\n    value: badges,\n    loading,\n    error,\n  } = useQetaApi(api => api.getUserBadges(entityRef), [entityRef]);\n\n  if (loading) {\n    return <Skeleton variant=\"rect\" height={100} />;\n  }\n\n  if (error) {\n    return <Alert severity=\"error\">{t('userBadges.error')}</Alert>;\n  }\n\n  const sortedBadges = badges ? sortBadgesByLevel(badges) : [];\n\n  const groupedBadges = sortedBadges.reduce((acc, userBadge) => {\n    const key = userBadge.badge.id;\n    if (!acc[key]) {\n      acc[key] = {\n        badge: userBadge.badge,\n        count: 0,\n      };\n    }\n    acc[key].count += 1;\n    return acc;\n  }, {} as Record<string, { badge: UserBadge['badge']; count: number }>);\n\n  const displayBadges = Object.values(groupedBadges).sort((a, b) => {\n    const levelA = LEVEL_ORDER[a.badge.level] ?? 99;\n    const levelB = LEVEL_ORDER[b.badge.level] ?? 99;\n    return levelA - levelB;\n  });\n\n  return (\n    <Box>\n      <Typography variant=\"h6\" gutterBottom>\n        {t('userBadges.title')}\n      </Typography>\n      {displayBadges.length === 0 ? (\n        <Typography variant=\"body2\">{t('userBadges.noBadges')}</Typography>\n      ) : (\n        <Grid\n          container\n          spacing={3}\n          style={{ padding: '1em' }}\n          justifyContent=\"center\"\n          alignItems=\"center\"\n        >\n          {displayBadges.map((item, index: number) => (\n            <Grid item key={index}>\n              <BadgeChip badge={item.badge} count={item.count} />\n            </Grid>\n          ))}\n        </Grid>\n      )}\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Buttons/AddToCollectionButton.esm.js

@@ -7,15 +7,20 @@ import PlayListAddIcon from '@material-ui/icons/PlaylistAdd';
 import { useApi, alertApiRef } from '@backstage/core-plugin-api';
 import { qetaApiRef } from '../../api.esm.js';
 import { useQetaApi } from '../../hooks/useQetaApi.esm.js';
+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 '@backstage/catalog-model';
 import 'dataloader';
 import '@backstage/plugin-catalog-react';
-import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
-import { qetaTranslationRef } from '../../translation.esm.js';
 import 'react-use/lib/useAsync';
 import '@backstage/plugin-permission-react';
 import '@drodil/backstage-plugin-qeta-common';
 import '@backstage/plugin-permission-common';
+import 'react-router-dom';
+import 'react-use/lib/useDebounce';
+import '../FilterPanel/FilterPanel.esm.js';
 import { ContentHeaderButton } from './ContentHeaderButton.esm.js';
 
 const AddToCollectionButton = (props) => {

package/dist/components/Buttons/AddToCollectionButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddToCollectionButton.esm.js","sources":["../../../src/components/Buttons/AddToCollectionButton.tsx"],"sourcesContent":["import { Collection, PostResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { useState } from 'react';\nimport {\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  Grid,\n} from '@material-ui/core';\nimport AddCircle from '@material-ui/icons/AddCircle';\nimport RemoveCircle from '@material-ui/icons/RemoveCircle';\nimport PlayListAddIcon from '@material-ui/icons/PlaylistAdd';\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\nimport { qetaApiRef } from '../../api';\nimport { useQetaApi } from '../../hooks';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { ContentHeaderButton } from './ContentHeaderButton';\n\nexport const AddToCollectionButton = (props: { post: PostResponse }) => {\n  const { post } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const alertApi = useApi(alertApiRef);\n  const { value: response, retry } = useQetaApi(api => {\n    return api.getCollections({\n      checkAccess: true,\n      includeExperts: false,\n      includePosts: true,\n    });\n  }, []);\n  const [open, setOpen] = useState(false);\n  const qetaApi = useApi(qetaApiRef);\n\n  const handleClickOpen = () => {\n    setOpen(true);\n  };\n\n  const handleClose = () => {\n    setOpen(false);\n  };\n\n  const handleClick = (collection: Collection) => {\n    if (collection.posts?.find(p => p.id === post.id)) {\n      qetaApi\n        .removePostFromCollection(collection.id, post.id)\n        .then(() => {\n          alertApi.post({\n            message: t('addToCollectionButton.removed', {\n              collection: collection.title,\n            }),\n            severity: 'success',\n            display: 'transient',\n          });\n          retry();\n        })\n        .catch(e => {\n          alertApi.post({\n            message: e.message,\n            severity: 'error',\n            display: 'transient',\n          });\n        });\n    } else {\n      qetaApi\n        .addPostToCollection(collection.id, post.id)\n        .then(() => {\n          alertApi.post({\n            message: t('addToCollectionButton.added', {\n              collection: collection.title,\n            }),\n            severity: 'success',\n            display: 'transient',\n          });\n          retry();\n        })\n        .catch(e => {\n          alertApi.post({\n            message: e.message,\n            severity: 'error',\n            display: 'transient',\n          });\n        });\n    }\n  };\n\n  if (post.status !== 'active') {\n    return null;\n  }\n\n  const collections = (response?.collections ?? []).filter(c => c.canEdit);\n  if (!collections.length) {\n    return null;\n  }\n\n  return (\n    <>\n      <ContentHeaderButton onClick={handleClickOpen} icon={<PlayListAddIcon />}>\n        {t('addToCollectionButton.title')}\n      </ContentHeaderButton>\n      <Dialog open={open} onClose={handleClose} fullWidth>\n        <DialogTitle>{t('addToCollectionButton.manage')}</DialogTitle>\n        <DialogContent>\n          <Grid container>\n            {collections.map(collection => {\n              const isInCollection = collection.posts?.find(\n                p => p.id === post.id,\n              );\n\n              return (\n                <Grid item key={collection.id}>\n                  <Button\n                    variant=\"outlined\"\n                    startIcon={\n                      isInCollection ? <RemoveCircle /> : <AddCircle />\n                    }\n                    color={isInCollection ? 'secondary' : 'primary'}\n                    onClick={() => handleClick(collection)}\n                  >\n                    {collection.title}\n                  </Button>\n                </Grid>\n              );\n            })}\n          </Grid>\n        </DialogContent>\n        <DialogActions>\n          <Button onClick={handleClose} color=\"primary\">\n            {t('addToCollectionButton.close')}\n          </Button>\n        </DialogActions>\n      </Dialog>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"AddToCollectionButton.esm.js","sources":["../../../src/components/Buttons/AddToCollectionButton.tsx"],"sourcesContent":["import { Collection, PostResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { useState } from 'react';\nimport {\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  Grid,\n} from '@material-ui/core';\nimport AddCircle from '@material-ui/icons/AddCircle';\nimport RemoveCircle from '@material-ui/icons/RemoveCircle';\nimport PlayListAddIcon from '@material-ui/icons/PlaylistAdd';\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\nimport { qetaApiRef } from '../../api';\nimport { useQetaApi } from '../../hooks';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { ContentHeaderButton } from './ContentHeaderButton';\n\nexport const AddToCollectionButton = (props: { post: PostResponse }) => {\n  const { post } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const alertApi = useApi(alertApiRef);\n  const { value: response, retry } = useQetaApi(api => {\n    return api.getCollections({\n      checkAccess: true,\n      includeExperts: false,\n      includePosts: true,\n    });\n  }, []);\n  const [open, setOpen] = useState(false);\n  const qetaApi = useApi(qetaApiRef);\n\n  const handleClickOpen = () => {\n    setOpen(true);\n  };\n\n  const handleClose = () => {\n    setOpen(false);\n  };\n\n  const handleClick = (collection: Collection) => {\n    if (collection.posts?.find(p => p.id === post.id)) {\n      qetaApi\n        .removePostFromCollection(collection.id, post.id)\n        .then(() => {\n          alertApi.post({\n            message: t('addToCollectionButton.removed', {\n              collection: collection.title,\n            }),\n            severity: 'success',\n            display: 'transient',\n          });\n          retry();\n        })\n        .catch(e => {\n          alertApi.post({\n            message: e.message,\n            severity: 'error',\n            display: 'transient',\n          });\n        });\n    } else {\n      qetaApi\n        .addPostToCollection(collection.id, post.id)\n        .then(() => {\n          alertApi.post({\n            message: t('addToCollectionButton.added', {\n              collection: collection.title,\n            }),\n            severity: 'success',\n            display: 'transient',\n          });\n          retry();\n        })\n        .catch(e => {\n          alertApi.post({\n            message: e.message,\n            severity: 'error',\n            display: 'transient',\n          });\n        });\n    }\n  };\n\n  if (post.status !== 'active') {\n    return null;\n  }\n\n  const collections = (response?.collections ?? []).filter(c => c.canEdit);\n  if (!collections.length) {\n    return null;\n  }\n\n  return (\n    <>\n      <ContentHeaderButton onClick={handleClickOpen} icon={<PlayListAddIcon />}>\n        {t('addToCollectionButton.title')}\n      </ContentHeaderButton>\n      <Dialog open={open} onClose={handleClose} fullWidth>\n        <DialogTitle>{t('addToCollectionButton.manage')}</DialogTitle>\n        <DialogContent>\n          <Grid container>\n            {collections.map(collection => {\n              const isInCollection = collection.posts?.find(\n                p => p.id === post.id,\n              );\n\n              return (\n                <Grid item key={collection.id}>\n                  <Button\n                    variant=\"outlined\"\n                    startIcon={\n                      isInCollection ? <RemoveCircle /> : <AddCircle />\n                    }\n                    color={isInCollection ? 'secondary' : 'primary'}\n                    onClick={() => handleClick(collection)}\n                  >\n                    {collection.title}\n                  </Button>\n                </Grid>\n              );\n            })}\n          </Grid>\n        </DialogContent>\n        <DialogActions>\n          <Button onClick={handleClose} color=\"primary\">\n            {t('addToCollectionButton.close')}\n          </Button>\n        </DialogActions>\n      </Dialog>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Buttons/EntityFollowButton.esm.js

@@ -5,17 +5,22 @@ import '@backstage/core-plugin-api';
 import '../../api.esm.js';
 import 'react-use';
 import 'react';
+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 '@backstage/catalog-model';
 import 'dataloader';
 import '@backstage/plugin-catalog-react';
-import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
-import { qetaTranslationRef } from '../../translation.esm.js';
 import 'react-use/lib/useAsync';
 import '@backstage/plugin-permission-react';
 import '@drodil/backstage-plugin-qeta-common';
 import '@backstage/plugin-permission-common';
 import { Tooltip, IconButton } from '@material-ui/core';
+import 'react-router-dom';
+import 'react-use/lib/useDebounce';
+import '../FilterPanel/FilterPanel.esm.js';
 
 const EntityFollowButton = (props) => {
   const { entityRef } = props;

package/dist/components/Buttons/EntityFollowButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityFollowButton.esm.js","sources":["../../../src/components/Buttons/EntityFollowButton.tsx"],"sourcesContent":["import Visibility from '@material-ui/icons/Visibility';\nimport VisibilityOff from '@material-ui/icons/VisibilityOff';\nimport { useEntityFollow } from '../../hooks';\nimport { IconButton, Tooltip } from '@material-ui/core';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\n\nexport const EntityFollowButton = (props: { entityRef: string }) => {\n  const { entityRef } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const entities = useEntityFollow();\n  if (entities.loading) {\n    return null;\n  }\n\n  return (\n    <Tooltip title={t('entityButton.tooltip')}>\n      <IconButton\n        disableRipple\n        size=\"small\"\n        color={entities.isFollowingEntity(entityRef) ? 'secondary' : 'primary'}\n        onClick={() => {\n          if (entities.isFollowingEntity(entityRef)) {\n            entities.unfollowEntity(entityRef);\n          } else {\n            entities.followEntity(entityRef);\n          }\n        }}\n      >\n        {entities.isFollowingEntity(entityRef) ? (\n          <VisibilityOff />\n        ) : (\n          <Visibility />\n        )}\n      </IconButton>\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAOa,MAAA,kBAAA,GAAqB,CAAC,KAAiC,KAAA;AAClE,EAAM,MAAA,EAAE,WAAc,GAAA,KAAA;AACtB,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,MAAM,WAAW,eAAgB,EAAA;AACjC,EAAA,IAAI,SAAS,OAAS,EAAA;AACpB,IAAO,OAAA,IAAA;AAAA;AAGT,EAAA,uBACG,GAAA,CAAA,OAAA,EAAA,EAAQ,KAAO,EAAA,CAAA,CAAE,sBAAsB,CACtC,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,aAAa,EAAA,IAAA;AAAA,MACb,IAAK,EAAA,OAAA;AAAA,MACL,KAAO,EAAA,QAAA,CAAS,iBAAkB,CAAA,SAAS,IAAI,WAAc,GAAA,SAAA;AAAA,MAC7D,SAAS,MAAM;AACb,QAAI,IAAA,QAAA,CAAS,iBAAkB,CAAA,SAAS,CAAG,EAAA;AACzC,UAAA,QAAA,CAAS,eAAe,SAAS,CAAA;AAAA,SAC5B,MAAA;AACL,UAAA,QAAA,CAAS,aAAa,SAAS,CAAA;AAAA;AACjC,OACF;AAAA,MAEC,QAAA,EAAA,QAAA,CAAS,kBAAkB,SAAS,CAAA,uBAClC,aAAc,EAAA,EAAA,CAAA,uBAEd,UAAW,EAAA,EAAA;AAAA;AAAA,GAGlB,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"EntityFollowButton.esm.js","sources":["../../../src/components/Buttons/EntityFollowButton.tsx"],"sourcesContent":["import Visibility from '@material-ui/icons/Visibility';\nimport VisibilityOff from '@material-ui/icons/VisibilityOff';\nimport { useEntityFollow } from '../../hooks';\nimport { IconButton, Tooltip } from '@material-ui/core';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\n\nexport const EntityFollowButton = (props: { entityRef: string }) => {\n  const { entityRef } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const entities = useEntityFollow();\n  if (entities.loading) {\n    return null;\n  }\n\n  return (\n    <Tooltip title={t('entityButton.tooltip')}>\n      <IconButton\n        disableRipple\n        size=\"small\"\n        color={entities.isFollowingEntity(entityRef) ? 'secondary' : 'primary'}\n        onClick={() => {\n          if (entities.isFollowingEntity(entityRef)) {\n            entities.unfollowEntity(entityRef);\n          } else {\n            entities.followEntity(entityRef);\n          }\n        }}\n      >\n        {entities.isFollowingEntity(entityRef) ? (\n          <VisibilityOff />\n        ) : (\n          <Visibility />\n        )}\n      </IconButton>\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAOa,MAAA,kBAAA,GAAqB,CAAC,KAAiC,KAAA;AAClE,EAAM,MAAA,EAAE,WAAc,GAAA,KAAA;AACtB,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,MAAM,WAAW,eAAgB,EAAA;AACjC,EAAA,IAAI,SAAS,OAAS,EAAA;AACpB,IAAO,OAAA,IAAA;AAAA;AAGT,EAAA,uBACG,GAAA,CAAA,OAAA,EAAA,EAAQ,KAAO,EAAA,CAAA,CAAE,sBAAsB,CACtC,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,aAAa,EAAA,IAAA;AAAA,MACb,IAAK,EAAA,OAAA;AAAA,MACL,KAAO,EAAA,QAAA,CAAS,iBAAkB,CAAA,SAAS,IAAI,WAAc,GAAA,SAAA;AAAA,MAC7D,SAAS,MAAM;AACb,QAAI,IAAA,QAAA,CAAS,iBAAkB,CAAA,SAAS,CAAG,EAAA;AACzC,UAAA,QAAA,CAAS,eAAe,SAAS,CAAA;AAAA,SAC5B,MAAA;AACL,UAAA,QAAA,CAAS,aAAa,SAAS,CAAA;AAAA;AACjC,OACF;AAAA,MAEC,QAAA,EAAA,QAAA,CAAS,kBAAkB,SAAS,CAAA,uBAClC,aAAc,EAAA,EAAA,CAAA,uBAEd,UAAW,EAAA,EAAA;AAAA;AAAA,GAGlB,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/Buttons/RankingButtons.esm.js

@@ -0,0 +1,94 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { makeStyles, Box, Tooltip, IconButton } from '@material-ui/core';
+import VerticalAlignTopIcon from '@material-ui/icons/VerticalAlignTop';
+import VerticalAlignBottomIcon from '@material-ui/icons/VerticalAlignBottom';
+import KeyboardArrowUpIcon from '@material-ui/icons/KeyboardArrowUp';
+import KeyboardArrowDownIcon from '@material-ui/icons/KeyboardArrowDown';
+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';
+
+const useStyles = makeStyles((theme) => ({
+  rankingControls: {
+    display: "flex",
+    justifyContent: "flex-end",
+    gap: theme.spacing(0.5)
+  },
+  rankingButton: {
+    padding: theme.spacing(0.5)
+  }
+}));
+const RankingButtons = (props) => {
+  const { postId, collectionId, onRankUpdate } = props;
+  const classes = useStyles();
+  const { t } = useTranslationRef(qetaTranslationRef);
+  const qetaApi = useApi(qetaApiRef);
+  if (!collectionId) {
+    return null;
+  }
+  const rank = (direction) => {
+    qetaApi.rankPostInCollection(collectionId, postId, direction).then((res) => {
+      if (res) {
+        onRankUpdate?.();
+      }
+    });
+  };
+  return /* @__PURE__ */ jsxs(Box, { className: classes.rankingControls, children: [
+    /* @__PURE__ */ jsx(Tooltip, { title: t("ranking.top", {}), children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        size: "small",
+        onClick: (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+          rank("top");
+        },
+        className: classes.rankingButton,
+        children: /* @__PURE__ */ jsx(VerticalAlignTopIcon, { fontSize: "small" })
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Tooltip, { title: t("ranking.up", {}), children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        size: "small",
+        onClick: (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+          rank("up");
+        },
+        className: classes.rankingButton,
+        children: /* @__PURE__ */ jsx(KeyboardArrowUpIcon, { fontSize: "small" })
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Tooltip, { title: t("ranking.down", {}), children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        size: "small",
+        onClick: (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+          rank("down");
+        },
+        className: classes.rankingButton,
+        children: /* @__PURE__ */ jsx(KeyboardArrowDownIcon, { fontSize: "small" })
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Tooltip, { title: t("ranking.bottom", {}), children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        size: "small",
+        onClick: (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+          rank("bottom");
+        },
+        className: classes.rankingButton,
+        children: /* @__PURE__ */ jsx(VerticalAlignBottomIcon, { fontSize: "small" })
+      }
+    ) })
+  ] });
+};
+
+export { RankingButtons };
+//# sourceMappingURL=RankingButtons.esm.js.map

package/dist/components/Buttons/RankingButtons.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RankingButtons.esm.js","sources":["../../../src/components/Buttons/RankingButtons.tsx"],"sourcesContent":["import { IconButton, Tooltip, Box, makeStyles } from '@material-ui/core';\nimport VerticalAlignTopIcon from '@material-ui/icons/VerticalAlignTop';\nimport VerticalAlignBottomIcon from '@material-ui/icons/VerticalAlignBottom';\nimport KeyboardArrowUpIcon from '@material-ui/icons/KeyboardArrowUp';\nimport KeyboardArrowDownIcon from '@material-ui/icons/KeyboardArrowDown';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { qetaApiRef } from '../../api';\n\nconst useStyles = makeStyles(theme => ({\n  rankingControls: {\n    display: 'flex',\n    justifyContent: 'flex-end',\n    gap: theme.spacing(0.5),\n  },\n  rankingButton: {\n    padding: theme.spacing(0.5),\n  },\n}));\n\nexport interface RankingButtonsProps {\n  postId: number;\n  collectionId: number | undefined;\n  onRankUpdate?: () => void;\n}\n\nexport const RankingButtons = (props: RankingButtonsProps) => {\n  const { postId, collectionId, onRankUpdate } = props;\n  const classes = useStyles();\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const qetaApi = useApi(qetaApiRef);\n\n  if (!collectionId) {\n    return null;\n  }\n\n  const rank = (direction: 'top' | 'bottom' | 'up' | 'down') => {\n    qetaApi.rankPostInCollection(collectionId, postId, direction).then(res => {\n      if (res) {\n        onRankUpdate?.();\n      }\n    });\n  };\n\n  return (\n    <Box className={classes.rankingControls}>\n      <Tooltip title={t('ranking.top', {})}>\n        <IconButton\n          size=\"small\"\n          onClick={e => {\n            e.preventDefault();\n            e.stopPropagation();\n            rank('top');\n          }}\n          className={classes.rankingButton}\n        >\n          <VerticalAlignTopIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n      <Tooltip title={t('ranking.up', {})}>\n        <IconButton\n          size=\"small\"\n          onClick={e => {\n            e.preventDefault();\n            e.stopPropagation();\n            rank('up');\n          }}\n          className={classes.rankingButton}\n        >\n          <KeyboardArrowUpIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n      <Tooltip title={t('ranking.down', {})}>\n        <IconButton\n          size=\"small\"\n          onClick={e => {\n            e.preventDefault();\n            e.stopPropagation();\n            rank('down');\n          }}\n          className={classes.rankingButton}\n        >\n          <KeyboardArrowDownIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n      <Tooltip title={t('ranking.bottom', {})}>\n        <IconButton\n          size=\"small\"\n          onClick={e => {\n            e.preventDefault();\n            e.stopPropagation();\n            rank('bottom');\n          }}\n          className={classes.rankingButton}\n        >\n          <VerticalAlignBottomIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Buttons/TagFollowButton.esm.js

@@ -4,18 +4,23 @@ import VisibilityOff from '@material-ui/icons/VisibilityOff';
 import '@backstage/core-plugin-api';
 import '../../api.esm.js';
 import 'react-use';
-import { useTagsFollow } from '../../hooks/useTagsFollow.esm.js';
 import 'react';
+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 { useTagsFollow } from '../../hooks/useTagsFollow.esm.js';
 import '@backstage/catalog-model';
 import 'dataloader';
 import '@backstage/plugin-catalog-react';
-import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
-import { qetaTranslationRef } from '../../translation.esm.js';
 import 'react-use/lib/useAsync';
 import '@backstage/plugin-permission-react';
 import '@drodil/backstage-plugin-qeta-common';
 import '@backstage/plugin-permission-common';
 import { Tooltip, IconButton } from '@material-ui/core';
+import 'react-router-dom';
+import 'react-use/lib/useDebounce';
+import '../FilterPanel/FilterPanel.esm.js';
 
 const TagFollowButton = (props) => {
   const { tag } = props;