@drodil/backstage-plugin-qeta-react 3.12.5 → 3.13.1

package/dist/components/QetaPagination/QetaPagination.esm.js

@@ -1,27 +1,36 @@
-import Tooltip from '@mui/material/Tooltip';
-import Grid from '@mui/material/Grid';
-import FormControl from '@mui/material/FormControl';
-import Select from '@mui/material/Select';
-import MenuItem from '@mui/material/MenuItem';
 import React__default from 'react';
 import '@backstage/core-plugin-api';
 import '../../api.esm.js';
 import 'react-use';
 import { useTranslation } from '../../hooks/useTranslation.esm.js';
 import 'react-use/lib/useAsync';
-import Pagination from '@mui/material/Pagination';
+import { makeStyles, Grid, Tooltip, FormControl, Select, MenuItem } from '@material-ui/core';
+import { Pagination } from '@material-ui/lab';
 
+const useStyles = makeStyles(
+  () => ({
+    root: {
+      marginTop: "2em"
+    },
+    pageSizeSelect: {
+      marginRight: "1em"
+    },
+    pagination: {}
+  }),
+  { name: "QetaPagination" }
+);
 const QetaPagination = (props) => {
   const { handlePageChange, handlePageSizeChange, page, pageCount, tooltip } = props;
   const { t } = useTranslation();
+  const styles = useStyles();
   return /* @__PURE__ */ React__default.createElement(
     Grid,
     {
       container: true,
+      className: styles.root,
       spacing: 0,
       alignItems: "center",
-      justifyContent: "center",
-      sx: { marginTop: 4 }
+      justifyContent: "center"
     },
     /* @__PURE__ */ React__default.createElement(Tooltip, { title: tooltip ?? t("pagination.defaultTooltip"), arrow: true }, /* @__PURE__ */ React__default.createElement(FormControl, { variant: "outlined" }, /* @__PURE__ */ React__default.createElement(
       Select,
@@ -29,8 +38,7 @@ const QetaPagination = (props) => {
         value: props.pageSize,
         onChange: handlePageSizeChange,
         variant: "outlined",
-        size: "small",
-        sx: { marginRight: 2 }
+        className: styles.pageSizeSelect
       },
       /* @__PURE__ */ React__default.createElement(MenuItem, { value: 5 }, "5"),
       /* @__PURE__ */ React__default.createElement(MenuItem, { value: 10 }, "10"),
@@ -46,7 +54,7 @@ const QetaPagination = (props) => {
         count: pageCount,
         size: "large",
         variant: "outlined",
-        className: "qetaPagination",
+        className: styles.pagination,
         showFirstButton: true,
         showLastButton: true
       }

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

@@ -1 +1 @@
-{"version":3,"file":"QetaPagination.esm.js","sources":["../../../src/components/QetaPagination/QetaPagination.tsx"],"sourcesContent":["import Tooltip from '@mui/material/Tooltip';\nimport Grid from '@mui/material/Grid';\nimport FormControl from '@mui/material/FormControl';\nimport Select, { SelectChangeEvent } from '@mui/material/Select';\nimport MenuItem from '@mui/material/MenuItem';\nimport React from 'react';\nimport { useTranslation } from '../../hooks';\nimport Pagination from '@mui/material/Pagination';\n\nexport const QetaPagination = (props: {\n  pageSize: number;\n  handlePageChange: (_event: React.ChangeEvent<unknown>, value: number) => void;\n  handlePageSizeChange: (event: SelectChangeEvent<number>) => void;\n  page: number;\n  tooltip?: string;\n  pageCount: number;\n}) => {\n  const { handlePageChange, handlePageSizeChange, page, pageCount, tooltip } =\n    props;\n  const { t } = useTranslation();\n  return (\n    <Grid\n      container\n      spacing={0}\n      alignItems=\"center\"\n      justifyContent=\"center\"\n      sx={{ marginTop: 4 }}\n    >\n      <Tooltip title={tooltip ?? t('pagination.defaultTooltip')} arrow>\n        <FormControl variant=\"outlined\">\n          <Select\n            value={props.pageSize}\n            onChange={handlePageSizeChange}\n            variant=\"outlined\"\n            size=\"small\"\n            sx={{ marginRight: 2 }}\n          >\n            <MenuItem value={5}>5</MenuItem>\n            <MenuItem value={10}>10</MenuItem>\n            <MenuItem value={25}>25</MenuItem>\n            <MenuItem value={50}>50</MenuItem>\n            <MenuItem value={100}>100</MenuItem>\n          </Select>\n        </FormControl>\n      </Tooltip>\n      <Pagination\n        page={page}\n        onChange={handlePageChange}\n        count={pageCount}\n        size=\"large\"\n        variant=\"outlined\"\n        className=\"qetaPagination\"\n        showFirstButton\n        showLastButton\n      />\n    </Grid>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;AASa,MAAA,cAAA,GAAiB,CAAC,KAOzB,KAAA;AACJ,EAAA,MAAM,EAAE,gBAAkB,EAAA,oBAAA,EAAsB,IAAM,EAAA,SAAA,EAAW,SAC/D,GAAA,KAAA;AACF,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA;AAC7B,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAS,EAAA,IAAA;AAAA,MACT,OAAS,EAAA,CAAA;AAAA,MACT,UAAW,EAAA,QAAA;AAAA,MACX,cAAe,EAAA,QAAA;AAAA,MACf,EAAA,EAAI,EAAE,SAAA,EAAW,CAAE;AAAA,KAAA;AAAA,oBAElBA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,KAAO,EAAA,OAAA,IAAW,CAAE,CAAA,2BAA2B,CAAG,EAAA,KAAA,EAAK,IAC9D,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,WAAY,EAAA,EAAA,OAAA,EAAQ,UACnB,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAO,KAAM,CAAA,QAAA;AAAA,QACb,QAAU,EAAA,oBAAA;AAAA,QACV,OAAQ,EAAA,UAAA;AAAA,QACR,IAAK,EAAA,OAAA;AAAA,QACL,EAAA,EAAI,EAAE,WAAA,EAAa,CAAE;AAAA,OAAA;AAAA,sBAEpBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,CAAA,EAAA,EAAG,GAAC,CAAA;AAAA,sBACpBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,EAAA,EAAA,EAAI,IAAE,CAAA;AAAA,sBACtBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,EAAA,EAAA,EAAI,IAAE,CAAA;AAAA,sBACtBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,EAAA,EAAA,EAAI,IAAE,CAAA;AAAA,sBACtBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,GAAA,EAAA,EAAK,KAAG;AAAA,KAE7B,CACF,CAAA;AAAA,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,IAAA;AAAA,QACA,QAAU,EAAA,gBAAA;AAAA,QACV,KAAO,EAAA,SAAA;AAAA,QACP,IAAK,EAAA,OAAA;AAAA,QACL,OAAQ,EAAA,UAAA;AAAA,QACR,SAAU,EAAA,gBAAA;AAAA,QACV,eAAe,EAAA,IAAA;AAAA,QACf,cAAc,EAAA;AAAA;AAAA;AAChB,GACF;AAEJ;;;;"}
+{"version":3,"file":"QetaPagination.esm.js","sources":["../../../src/components/QetaPagination/QetaPagination.tsx"],"sourcesContent":["import React from 'react';\nimport { useTranslation } from '../../hooks';\nimport {\n  FormControl,\n  Grid,\n  makeStyles,\n  MenuItem,\n  Select,\n  Tooltip,\n} from '@material-ui/core';\nimport { Pagination } from '@material-ui/lab';\n\nexport type QetaPaginationClassKeys = 'root' | 'pageSizeSelect' | 'pagination';\n\nconst useStyles = makeStyles(\n  () => ({\n    root: {\n      marginTop: '2em',\n    },\n    pageSizeSelect: {\n      marginRight: '1em',\n    },\n    pagination: {},\n  }),\n  { name: 'QetaPagination' },\n);\n\nexport const QetaPagination = (props: {\n  pageSize: number;\n  handlePageChange: (_event: React.ChangeEvent<unknown>, value: number) => void;\n  handlePageSizeChange: (event: React.ChangeEvent<{ value: unknown }>) => void;\n  page: number;\n  tooltip?: string;\n  pageCount: number;\n}) => {\n  const { handlePageChange, handlePageSizeChange, page, pageCount, tooltip } =\n    props;\n  const { t } = useTranslation();\n  const styles = useStyles();\n  return (\n    <Grid\n      container\n      className={styles.root}\n      spacing={0}\n      alignItems=\"center\"\n      justifyContent=\"center\"\n    >\n      <Tooltip title={tooltip ?? t('pagination.defaultTooltip')} arrow>\n        <FormControl variant=\"outlined\">\n          <Select\n            value={props.pageSize}\n            onChange={handlePageSizeChange}\n            variant=\"outlined\"\n            className={styles.pageSizeSelect}\n          >\n            <MenuItem value={5}>5</MenuItem>\n            <MenuItem value={10}>10</MenuItem>\n            <MenuItem value={25}>25</MenuItem>\n            <MenuItem value={50}>50</MenuItem>\n            <MenuItem value={100}>100</MenuItem>\n          </Select>\n        </FormControl>\n      </Tooltip>\n      <Pagination\n        page={page}\n        onChange={handlePageChange}\n        count={pageCount}\n        size=\"large\"\n        variant=\"outlined\"\n        className={styles.pagination}\n        showFirstButton\n        showLastButton\n      />\n    </Grid>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;AAcA,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB,OAAO;AAAA,IACL,IAAM,EAAA;AAAA,MACJ,SAAW,EAAA;AAAA,KACb;AAAA,IACA,cAAgB,EAAA;AAAA,MACd,WAAa,EAAA;AAAA,KACf;AAAA,IACA,YAAY;AAAC,GACf,CAAA;AAAA,EACA,EAAE,MAAM,gBAAiB;AAC3B,CAAA;AAEa,MAAA,cAAA,GAAiB,CAAC,KAOzB,KAAA;AACJ,EAAA,MAAM,EAAE,gBAAkB,EAAA,oBAAA,EAAsB,IAAM,EAAA,SAAA,EAAW,SAC/D,GAAA,KAAA;AACF,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA;AAC7B,EAAA,MAAM,SAAS,SAAU,EAAA;AACzB,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAS,EAAA,IAAA;AAAA,MACT,WAAW,MAAO,CAAA,IAAA;AAAA,MAClB,OAAS,EAAA,CAAA;AAAA,MACT,UAAW,EAAA,QAAA;AAAA,MACX,cAAe,EAAA;AAAA,KAAA;AAAA,oBAEdA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,KAAO,EAAA,OAAA,IAAW,CAAE,CAAA,2BAA2B,CAAG,EAAA,KAAA,EAAK,IAC9D,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,WAAY,EAAA,EAAA,OAAA,EAAQ,UACnB,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAO,KAAM,CAAA,QAAA;AAAA,QACb,QAAU,EAAA,oBAAA;AAAA,QACV,OAAQ,EAAA,UAAA;AAAA,QACR,WAAW,MAAO,CAAA;AAAA,OAAA;AAAA,sBAEjBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,CAAA,EAAA,EAAG,GAAC,CAAA;AAAA,sBACpBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,EAAA,EAAA,EAAI,IAAE,CAAA;AAAA,sBACtBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,EAAA,EAAA,EAAI,IAAE,CAAA;AAAA,sBACtBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,EAAA,EAAA,EAAI,IAAE,CAAA;AAAA,sBACtBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,KAAO,EAAA,GAAA,EAAA,EAAK,KAAG;AAAA,KAE7B,CACF,CAAA;AAAA,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,IAAA;AAAA,QACA,QAAU,EAAA,gBAAA;AAAA,QACV,KAAO,EAAA,SAAA;AAAA,QACP,IAAK,EAAA,OAAA;AAAA,QACL,OAAQ,EAAA,UAAA;AAAA,QACR,WAAW,MAAO,CAAA,UAAA;AAAA,QAClB,eAAe,EAAA,IAAA;AAAA,QACf,cAAc,EAAA;AAAA;AAAA;AAChB,GACF;AAEJ;;;;"}

package/dist/components/QuestionCard/QuestionCard.esm.js

@@ -1,13 +1,8 @@
-import Card from '@mui/material/Card';
-import CardContent from '@mui/material/CardContent';
-import Typography from '@mui/material/Typography';
-import Grid from '@mui/material/Grid';
-import Button from '@mui/material/Button';
 import React__default, { useEffect } from 'react';
 import { VoteButtons } from '../Buttons/VoteButtons.esm.js';
 import { DeleteModal } from '../DeleteModal/DeleteModal.esm.js';
-import DeleteIcon from '@mui/icons-material/Delete';
-import EditIcon from '@mui/icons-material/Edit';
+import DeleteIcon from '@material-ui/icons/Delete';
+import EditIcon from '@material-ui/icons/Edit';
 import { FavoriteButton } from '../Buttons/FavoriteButton.esm.js';
 import { AuthorBox } from '../AuthorBox/AuthorBox.esm.js';
 import { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities.esm.js';
@@ -21,9 +16,29 @@ import '../../api.esm.js';
 import 'react-use';
 import { useTranslation } from '../../hooks/useTranslation.esm.js';
 import 'react-use/lib/useAsync';
-import { VoteButtonContainer } from '../Styled/VoteButtonContainer.esm.js';
-import { CardActionContainer } from '../Styled/CardActionContainer.esm.js';
+import { VoteButtonContainer } from '../Utility/VoteButtonContainer.esm.js';
+import { makeStyles, Card, CardContent, Grid, Typography, Box, Button } from '@material-ui/core';
 
+const useStyles = makeStyles(
+  () => ({
+    root: {},
+    contentContainer: {
+      minHeight: "6em",
+      paddingTop: "0.5em",
+      paddingBottom: "0.5em"
+    },
+    buttons: {
+      marginTop: "1em",
+      "& *:not(:last-child)": {
+        marginRight: "0.3em"
+      }
+    },
+    metadata: {
+      marginTop: "1em"
+    }
+  }),
+  { name: "QetaQuestionCard" }
+);
 const QuestionCard = (props) => {
   const { question } = props;
   const navigate = useNavigate();
@@ -36,6 +51,7 @@ const QuestionCard = (props) => {
   const onCommentAction = (q, _) => {
     setQuestionEntity(q);
   };
+  const styles = useStyles();
   const highlightedAnswer = window.location.hash.slice(1) ?? void 0;
   useEffect(() => {
     if (highlightedAnswer) {
@@ -48,7 +64,7 @@ const QuestionCard = (props) => {
       }
     }
   }, [highlightedAnswer]);
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Card, { variant: "outlined", sx: { marginBottom: 1, position: "relative" } }, /* @__PURE__ */ React__default.createElement(CardContent, null, /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Card, { variant: "outlined", className: styles.root }, /* @__PURE__ */ React__default.createElement(CardContent, null, /* @__PURE__ */ React__default.createElement(
     Grid,
     {
       container: true,
@@ -57,7 +73,7 @@ const QuestionCard = (props) => {
       style: { flexWrap: "nowrap" }
     },
     /* @__PURE__ */ React__default.createElement(Grid, { item: true, justifyContent: "center" }, /* @__PURE__ */ React__default.createElement(VoteButtonContainer, null, /* @__PURE__ */ React__default.createElement(VoteButtons, { entity: questionEntity }), /* @__PURE__ */ React__default.createElement(FavoriteButton, { entity: questionEntity }), /* @__PURE__ */ React__default.createElement(LinkButton, { entity: questionEntity }))),
-    /* @__PURE__ */ React__default.createElement(Grid, { item: true, marginLeft: 1, sx: { flexGrow: 1 } }, /* @__PURE__ */ React__default.createElement(Grid, { item: true, sx: { minHeight: "5em", paddingTop: 1 } }, /* @__PURE__ */ React__default.createElement(Typography, { variant: "body1", gutterBottom: true }, /* @__PURE__ */ React__default.createElement(MarkdownRenderer, { content: questionEntity.content }))), /* @__PURE__ */ React__default.createElement(
+    /* @__PURE__ */ React__default.createElement(Grid, { item: true, style: { flexGrow: "1" } }, /* @__PURE__ */ React__default.createElement(Grid, { item: true, className: styles.contentContainer }, /* @__PURE__ */ React__default.createElement(Typography, { variant: "body1", gutterBottom: true }, /* @__PURE__ */ React__default.createElement(MarkdownRenderer, { content: questionEntity.content }))), /* @__PURE__ */ React__default.createElement(
       Grid,
       {
         container: true,
@@ -65,17 +81,16 @@ const QuestionCard = (props) => {
         spacing: 1,
         justifyContent: "space-between",
         alignItems: "flex-end",
-        sx: { marginTop: 3 }
+        className: styles.metadata
       },
-      /* @__PURE__ */ React__default.createElement(Grid, { item: true, style: { alignSelf: "flex-end" } }, /* @__PURE__ */ React__default.createElement(TagsAndEntities, { entity: questionEntity }), (question.canEdit || question.canDelete) && /* @__PURE__ */ React__default.createElement(CardActionContainer, null, question.canDelete && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
+      /* @__PURE__ */ React__default.createElement(Grid, { item: true, style: { alignSelf: "flex-end" } }, /* @__PURE__ */ React__default.createElement(TagsAndEntities, { entity: questionEntity }), (question.canEdit || question.canDelete) && /* @__PURE__ */ React__default.createElement(Box, { className: styles.buttons }, question.canDelete && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
         Button,
         {
           variant: "outlined",
           size: "small",
           color: "secondary",
           onClick: handleDeleteModalOpen,
-          startIcon: /* @__PURE__ */ React__default.createElement(DeleteIcon, null),
-          sx: { marginRight: 1 }
+          startIcon: /* @__PURE__ */ React__default.createElement(DeleteIcon, null)
         },
         t("deleteModal.deleteButton")
       ), /* @__PURE__ */ React__default.createElement(

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

@@ -1 +1 @@
-{"version":3,"file":"QuestionCard.esm.js","sources":["../../../src/components/QuestionCard/QuestionCard.tsx"],"sourcesContent":["import {\n  AnswerResponse,\n  PostResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport Card from '@mui/material/Card';\nimport CardContent from '@mui/material/CardContent';\nimport Typography from '@mui/material/Typography';\nimport Grid from '@mui/material/Grid';\nimport Button from '@mui/material/Button';\nimport React, { useEffect } from 'react';\nimport { VoteButtons } from '../Buttons/VoteButtons';\nimport { DeleteModal } from '../DeleteModal/DeleteModal';\nimport DeleteIcon from '@mui/icons-material/Delete';\nimport EditIcon from '@mui/icons-material/Edit';\nimport { FavoriteButton } from '../Buttons/FavoriteButton';\nimport { AuthorBox } from '../AuthorBox/AuthorBox';\nimport { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities';\nimport { CommentSection } from '../CommentSection/CommentSection';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { LinkButton } from '../Buttons/LinkButton';\nimport { MarkdownRenderer } from '../MarkdownRenderer/MarkdownRenderer';\nimport { editQuestionRouteRef } from '../../routes';\nimport { useNavigate } from 'react-router-dom';\nimport { useTranslation } from '../../hooks';\nimport { VoteButtonContainer } from '../Styled/VoteButtonContainer';\nimport { CardActionContainer } from '../Styled/CardActionContainer';\n\nexport const QuestionCard = (props: { question: PostResponse }) => {\n  const { question } = props;\n  const navigate = useNavigate();\n  const editQuestionRoute = useRouteRef(editQuestionRouteRef);\n  const [deleteModalOpen, setDeleteModalOpen] = React.useState(false);\n  const [questionEntity, setQuestionEntity] = React.useState(question);\n  const handleDeleteModalOpen = () => setDeleteModalOpen(true);\n  const handleDeleteModalClose = () => setDeleteModalOpen(false);\n  const { t } = useTranslation();\n  const onCommentAction = (q: PostResponse, _?: AnswerResponse) => {\n    setQuestionEntity(q);\n  };\n\n  const highlightedAnswer = window.location.hash.slice(1) ?? undefined;\n  useEffect(() => {\n    if (highlightedAnswer) {\n      try {\n        const element = document.querySelector(`#${highlightedAnswer}`);\n        if (element) {\n          element.scrollIntoView();\n        }\n      } catch (e) {\n        // NOOP\n      }\n    }\n  }, [highlightedAnswer]);\n\n  return (\n    <>\n      <Card variant=\"outlined\" sx={{ marginBottom: 1, position: 'relative' }}>\n        <CardContent>\n          <Grid\n            container\n            spacing={2}\n            justifyContent=\"flex-start\"\n            style={{ flexWrap: 'nowrap' }}\n          >\n            <Grid item justifyContent=\"center\">\n              <VoteButtonContainer>\n                <VoteButtons entity={questionEntity} />\n                <FavoriteButton entity={questionEntity} />\n                <LinkButton entity={questionEntity} />\n              </VoteButtonContainer>\n            </Grid>\n            <Grid item marginLeft={1} sx={{ flexGrow: 1 }}>\n              <Grid item sx={{ minHeight: '5em', paddingTop: 1 }}>\n                <Typography variant=\"body1\" gutterBottom>\n                  <MarkdownRenderer content={questionEntity.content} />\n                </Typography>\n              </Grid>\n              <Grid\n                container\n                item\n                spacing={1}\n                justifyContent=\"space-between\"\n                alignItems=\"flex-end\"\n                sx={{ marginTop: 3 }}\n              >\n                <Grid item style={{ alignSelf: 'flex-end' }}>\n                  <TagsAndEntities entity={questionEntity} />\n                  {(question.canEdit || question.canDelete) && (\n                    <CardActionContainer>\n                      {question.canDelete && (\n                        <>\n                          <Button\n                            variant=\"outlined\"\n                            size=\"small\"\n                            color=\"secondary\"\n                            onClick={handleDeleteModalOpen}\n                            startIcon={<DeleteIcon />}\n                            sx={{ marginRight: 1 }}\n                          >\n                            {t('deleteModal.deleteButton')}\n                          </Button>\n                          <DeleteModal\n                            open={deleteModalOpen}\n                            onClose={handleDeleteModalClose}\n                            entity={questionEntity}\n                          />\n                        </>\n                      )}\n                      {question.canEdit && (\n                        <Button\n                          variant=\"outlined\"\n                          size=\"small\"\n                          startIcon={<EditIcon />}\n                          onClick={() =>\n                            navigate(\n                              editQuestionRoute({\n                                id: question.id.toString(10),\n                              }),\n                            )\n                          }\n                          className=\"qetaQuestionCardEditBtn\"\n                        >\n                          {t('questionPage.editButton')}\n                        </Button>\n                      )}\n                    </CardActionContainer>\n                  )}\n                </Grid>\n                <Grid item xs={3}>\n                  <AuthorBox entity={questionEntity} />\n                </Grid>\n              </Grid>\n            </Grid>\n          </Grid>\n        </CardContent>\n      </Card>\n      <CommentSection\n        post={questionEntity}\n        onCommentDelete={onCommentAction}\n        onCommentPost={onCommentAction}\n      />\n    </>\n  );\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"QuestionCard.esm.js","sources":["../../../src/components/QuestionCard/QuestionCard.tsx"],"sourcesContent":["import {\n  AnswerResponse,\n  PostResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport React, { useEffect } from 'react';\nimport { VoteButtons } from '../Buttons/VoteButtons';\nimport { DeleteModal } from '../DeleteModal/DeleteModal';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport EditIcon from '@material-ui/icons/Edit';\nimport { FavoriteButton } from '../Buttons/FavoriteButton';\nimport { AuthorBox } from '../AuthorBox/AuthorBox';\nimport { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities';\nimport { CommentSection } from '../CommentSection/CommentSection';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { LinkButton } from '../Buttons/LinkButton';\nimport { MarkdownRenderer } from '../MarkdownRenderer/MarkdownRenderer';\nimport { editQuestionRouteRef } from '../../routes';\nimport { useNavigate } from 'react-router-dom';\nimport { useTranslation } from '../../hooks';\nimport { VoteButtonContainer } from '../Utility/VoteButtonContainer';\nimport {\n  Box,\n  Button,\n  Card,\n  CardContent,\n  Grid,\n  makeStyles,\n  Typography,\n} from '@material-ui/core';\n\nexport type QuestionCardClassKeys =\n  | 'root'\n  | 'contentContainer'\n  | 'buttons'\n  | 'metadata';\n\nconst useStyles = makeStyles(\n  () => ({\n    root: {},\n    contentContainer: {\n      minHeight: '6em',\n      paddingTop: '0.5em',\n      paddingBottom: '0.5em',\n    },\n    buttons: {\n      marginTop: '1em',\n      '& *:not(:last-child)': {\n        marginRight: '0.3em',\n      },\n    },\n    metadata: {\n      marginTop: '1em',\n    },\n  }),\n  { name: 'QetaQuestionCard' },\n);\n\nexport const QuestionCard = (props: { question: PostResponse }) => {\n  const { question } = props;\n  const navigate = useNavigate();\n  const editQuestionRoute = useRouteRef(editQuestionRouteRef);\n  const [deleteModalOpen, setDeleteModalOpen] = React.useState(false);\n  const [questionEntity, setQuestionEntity] = React.useState(question);\n  const handleDeleteModalOpen = () => setDeleteModalOpen(true);\n  const handleDeleteModalClose = () => setDeleteModalOpen(false);\n  const { t } = useTranslation();\n  const onCommentAction = (q: PostResponse, _?: AnswerResponse) => {\n    setQuestionEntity(q);\n  };\n  const styles = useStyles();\n\n  const highlightedAnswer = window.location.hash.slice(1) ?? undefined;\n  useEffect(() => {\n    if (highlightedAnswer) {\n      try {\n        const element = document.querySelector(`#${highlightedAnswer}`);\n        if (element) {\n          element.scrollIntoView();\n        }\n      } catch (e) {\n        // NOOP\n      }\n    }\n  }, [highlightedAnswer]);\n\n  return (\n    <>\n      <Card variant=\"outlined\" className={styles.root}>\n        <CardContent>\n          <Grid\n            container\n            spacing={2}\n            justifyContent=\"flex-start\"\n            style={{ flexWrap: 'nowrap' }}\n          >\n            <Grid item justifyContent=\"center\">\n              <VoteButtonContainer>\n                <VoteButtons entity={questionEntity} />\n                <FavoriteButton entity={questionEntity} />\n                <LinkButton entity={questionEntity} />\n              </VoteButtonContainer>\n            </Grid>\n            <Grid item style={{ flexGrow: '1' }}>\n              <Grid item className={styles.contentContainer}>\n                <Typography variant=\"body1\" gutterBottom>\n                  <MarkdownRenderer content={questionEntity.content} />\n                </Typography>\n              </Grid>\n              <Grid\n                container\n                item\n                spacing={1}\n                justifyContent=\"space-between\"\n                alignItems=\"flex-end\"\n                className={styles.metadata}\n              >\n                <Grid item style={{ alignSelf: 'flex-end' }}>\n                  <TagsAndEntities entity={questionEntity} />\n                  {(question.canEdit || question.canDelete) && (\n                    <Box className={styles.buttons}>\n                      {question.canDelete && (\n                        <>\n                          <Button\n                            variant=\"outlined\"\n                            size=\"small\"\n                            color=\"secondary\"\n                            onClick={handleDeleteModalOpen}\n                            startIcon={<DeleteIcon />}\n                          >\n                            {t('deleteModal.deleteButton')}\n                          </Button>\n                          <DeleteModal\n                            open={deleteModalOpen}\n                            onClose={handleDeleteModalClose}\n                            entity={questionEntity}\n                          />\n                        </>\n                      )}\n                      {question.canEdit && (\n                        <Button\n                          variant=\"outlined\"\n                          size=\"small\"\n                          startIcon={<EditIcon />}\n                          onClick={() =>\n                            navigate(\n                              editQuestionRoute({\n                                id: question.id.toString(10),\n                              }),\n                            )\n                          }\n                          className=\"qetaQuestionCardEditBtn\"\n                        >\n                          {t('questionPage.editButton')}\n                        </Button>\n                      )}\n                    </Box>\n                  )}\n                </Grid>\n                <Grid item xs={3}>\n                  <AuthorBox entity={questionEntity} />\n                </Grid>\n              </Grid>\n            </Grid>\n          </Grid>\n        </CardContent>\n      </Card>\n      <CommentSection\n        post={questionEntity}\n        onCommentDelete={onCommentAction}\n        onCommentPost={onCommentAction}\n      />\n    </>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAoCA,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB,OAAO;AAAA,IACL,MAAM,EAAC;AAAA,IACP,gBAAkB,EAAA;AAAA,MAChB,SAAW,EAAA,KAAA;AAAA,MACX,UAAY,EAAA,OAAA;AAAA,MACZ,aAAe,EAAA;AAAA,KACjB;AAAA,IACA,OAAS,EAAA;AAAA,MACP,SAAW,EAAA,KAAA;AAAA,MACX,sBAAwB,EAAA;AAAA,QACtB,WAAa,EAAA;AAAA;AACf,KACF;AAAA,IACA,QAAU,EAAA;AAAA,MACR,SAAW,EAAA;AAAA;AACb,GACF,CAAA;AAAA,EACA,EAAE,MAAM,kBAAmB;AAC7B,CAAA;AAEa,MAAA,YAAA,GAAe,CAAC,KAAsC,KAAA;AACjE,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AACrB,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAM,MAAA,iBAAA,GAAoB,YAAY,oBAAoB,CAAA;AAC1D,EAAA,MAAM,CAAC,eAAiB,EAAA,kBAAkB,CAAI,GAAAA,cAAA,CAAM,SAAS,KAAK,CAAA;AAClE,EAAA,MAAM,CAAC,cAAgB,EAAA,iBAAiB,CAAI,GAAAA,cAAA,CAAM,SAAS,QAAQ,CAAA;AACnE,EAAM,MAAA,qBAAA,GAAwB,MAAM,kBAAA,CAAmB,IAAI,CAAA;AAC3D,EAAM,MAAA,sBAAA,GAAyB,MAAM,kBAAA,CAAmB,KAAK,CAAA;AAC7D,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA;AAC7B,EAAM,MAAA,eAAA,GAAkB,CAAC,CAAA,EAAiB,CAAuB,KAAA;AAC/D,IAAA,iBAAA,CAAkB,CAAC,CAAA;AAAA,GACrB;AACA,EAAA,MAAM,SAAS,SAAU,EAAA;AAEzB,EAAA,MAAM,oBAAoB,MAAO,CAAA,QAAA,CAAS,IAAK,CAAA,KAAA,CAAM,CAAC,CAAK,IAAA,KAAA,CAAA;AAC3D,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,iBAAmB,EAAA;AACrB,MAAI,IAAA;AACF,QAAA,MAAM,OAAU,GAAA,QAAA,CAAS,aAAc,CAAA,CAAA,CAAA,EAAI,iBAAiB,CAAE,CAAA,CAAA;AAC9D,QAAA,IAAI,OAAS,EAAA;AACX,UAAA,OAAA,CAAQ,cAAe,EAAA;AAAA;AACzB,eACO,CAAG,EAAA;AAAA;AAEZ;AACF,GACF,EAAG,CAAC,iBAAiB,CAAC,CAAA;AAEtB,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,+CACG,IAAK,EAAA,EAAA,OAAA,EAAQ,YAAW,SAAW,EAAA,MAAA,CAAO,IACzC,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,WACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAS,EAAA,IAAA;AAAA,MACT,OAAS,EAAA,CAAA;AAAA,MACT,cAAe,EAAA,YAAA;AAAA,MACf,KAAA,EAAO,EAAE,QAAA,EAAU,QAAS;AAAA,KAAA;AAAA,oBAE5BA,cAAA,CAAA,aAAA,CAAC,QAAK,IAAI,EAAA,IAAA,EAAC,gBAAe,QACxB,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,mBACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,WAAY,EAAA,EAAA,MAAA,EAAQ,gBAAgB,CACrC,kBAAAA,cAAA,CAAA,aAAA,CAAC,cAAe,EAAA,EAAA,MAAA,EAAQ,cAAgB,EAAA,CAAA,+CACvC,UAAW,EAAA,EAAA,MAAA,EAAQ,cAAgB,EAAA,CACtC,CACF,CAAA;AAAA,oBACCA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,IAAI,EAAA,IAAA,EAAC,KAAO,EAAA,EAAE,QAAU,EAAA,GAAA,EAC5B,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,SAAA,EAAW,MAAO,CAAA,gBAAA,EAAA,kBAC1BA,cAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,OAAQ,EAAA,OAAA,EAAQ,YAAY,EAAA,IAAA,EAAA,kBACrCA,cAAA,CAAA,aAAA,CAAA,gBAAA,EAAA,EAAiB,OAAS,EAAA,cAAA,CAAe,OAAS,EAAA,CACrD,CACF,CACA,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,SAAS,EAAA,IAAA;AAAA,QACT,IAAI,EAAA,IAAA;AAAA,QACJ,OAAS,EAAA,CAAA;AAAA,QACT,cAAe,EAAA,eAAA;AAAA,QACf,UAAW,EAAA,UAAA;AAAA,QACX,WAAW,MAAO,CAAA;AAAA,OAAA;AAAA,sBAElBA,cAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,KAAA,EAAO,EAAE,SAAW,EAAA,UAAA,EAC7B,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,eAAgB,EAAA,EAAA,MAAA,EAAQ,gBAAgB,CACvC,EAAA,CAAA,QAAA,CAAS,OAAW,IAAA,QAAA,CAAS,SAC7B,qBAAAA,cAAA,CAAA,aAAA,CAAC,GAAI,EAAA,EAAA,SAAA,EAAW,MAAO,CAAA,OAAA,EAAA,EACpB,QAAS,CAAA,SAAA,oBAENA,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,OAAQ,EAAA,UAAA;AAAA,UACR,IAAK,EAAA,OAAA;AAAA,UACL,KAAM,EAAA,WAAA;AAAA,UACN,OAAS,EAAA,qBAAA;AAAA,UACT,SAAA,+CAAY,UAAW,EAAA,IAAA;AAAA,SAAA;AAAA,QAEtB,EAAE,0BAA0B;AAAA,OAE/B,kBAAAA,cAAA,CAAA,aAAA;AAAA,QAAC,WAAA;AAAA,QAAA;AAAA,UACC,IAAM,EAAA,eAAA;AAAA,UACN,OAAS,EAAA,sBAAA;AAAA,UACT,MAAQ,EAAA;AAAA;AAAA,OAEZ,CAED,EAAA,QAAA,CAAS,OACR,oBAAAA,cAAA,CAAA,aAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,OAAQ,EAAA,UAAA;AAAA,UACR,IAAK,EAAA,OAAA;AAAA,UACL,SAAA,+CAAY,QAAS,EAAA,IAAA,CAAA;AAAA,UACrB,SAAS,MACP,QAAA;AAAA,YACE,iBAAkB,CAAA;AAAA,cAChB,EAAI,EAAA,QAAA,CAAS,EAAG,CAAA,QAAA,CAAS,EAAE;AAAA,aAC5B;AAAA,WACH;AAAA,UAEF,SAAU,EAAA;AAAA,SAAA;AAAA,QAET,EAAE,yBAAyB;AAAA,OAGlC,CAEJ,CAAA;AAAA,sBACAA,cAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,EAAA,EAAI,qBACZA,cAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAU,MAAQ,EAAA,cAAA,EAAgB,CACrC;AAAA,KAEJ;AAAA,GAEJ,CACF,CACA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,IAAM,EAAA,cAAA;AAAA,MACN,eAAiB,EAAA,eAAA;AAAA,MACjB,aAAe,EAAA;AAAA;AAAA,GAEnB,CAAA;AAEJ;;;;"}

package/dist/components/QuestionsTable/QuestionTableRow.esm.js

@@ -1,11 +1,10 @@
-import TableCell from '@mui/material/TableCell';
-import TableRow from '@mui/material/TableRow';
 import { Link } from '@backstage/core-components';
 import { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip/RelativeTimeWithTooltip.esm.js';
 import React__default from 'react';
 import { useRouteRef } from '@backstage/core-plugin-api';
 import { questionRouteRef } from '../../routes.esm.js';
 import { AuthorLink } from '../Links/Links.esm.js';
+import { TableRow, TableCell } from '@material-ui/core';
 
 const QuestionTableRow = (props) => {
   const { question } = props;

package/dist/components/QuestionsTable/QuestionTableRow.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"QuestionTableRow.esm.js","sources":["../../../src/components/QuestionsTable/QuestionTableRow.tsx"],"sourcesContent":["import { Post } from '@drodil/backstage-plugin-qeta-common';\nimport TableCell from '@mui/material/TableCell';\nimport TableRow from '@mui/material/TableRow';\nimport { Link } from '@backstage/core-components';\nimport { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip/RelativeTimeWithTooltip';\nimport React from 'react';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { questionRouteRef } from '../../routes';\nimport { AuthorLink } from '../Links/Links';\n\nexport const QuestionTableRow = (props: { question: Post }) => {\n  const { question } = props;\n  const questionRoute = useRouteRef(questionRouteRef);\n\n  return (\n    <TableRow key={question.id}>\n      <TableCell>\n        <Link to={questionRoute({ id: question.id.toString(10) })}>\n          {question.title}\n        </Link>\n      </TableCell>\n      <TableCell>\n        <AuthorLink entity={question} />\n      </TableCell>\n      <TableCell>\n        <RelativeTimeWithTooltip value={question.created} />\n      </TableCell>\n      <TableCell>\n        <RelativeTimeWithTooltip\n          value={question.updated ? question.updated : question.created}\n        />\n      </TableCell>\n    </TableRow>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;AAUa,MAAA,gBAAA,GAAmB,CAAC,KAA8B,KAAA;AAC7D,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AACrB,EAAM,MAAA,aAAA,GAAgB,YAAY,gBAAgB,CAAA;AAElD,EAAA,oDACG,QAAS,EAAA,EAAA,GAAA,EAAK,SAAS,EACtB,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,iCACEA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,IAAI,aAAc,CAAA,EAAE,IAAI,QAAS,CAAA,EAAA,CAAG,SAAS,EAAE,CAAA,EAAG,CACrD,EAAA,EAAA,QAAA,CAAS,KACZ,CACF,mBACCA,cAAA,CAAA,aAAA,CAAA,SAAA,EAAA,IAAA,+CACE,UAAW,EAAA,EAAA,MAAA,EAAQ,UAAU,CAChC,CAAA,+CACC,SACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,2BAAwB,KAAO,EAAA,QAAA,CAAS,SAAS,CACpD,CAAA,+CACC,SACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,uBAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA,QAAA,CAAS,OAAU,GAAA,QAAA,CAAS,UAAU,QAAS,CAAA;AAAA;AAAA,GAE1D,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"QuestionTableRow.esm.js","sources":["../../../src/components/QuestionsTable/QuestionTableRow.tsx"],"sourcesContent":["import { Post } from '@drodil/backstage-plugin-qeta-common';\nimport { Link } from '@backstage/core-components';\nimport { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip/RelativeTimeWithTooltip';\nimport React from 'react';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { questionRouteRef } from '../../routes';\nimport { AuthorLink } from '../Links/Links';\nimport { TableCell, TableRow } from '@material-ui/core';\n\nexport const QuestionTableRow = (props: { question: Post }) => {\n  const { question } = props;\n  const questionRoute = useRouteRef(questionRouteRef);\n\n  return (\n    <TableRow key={question.id}>\n      <TableCell>\n        <Link to={questionRoute({ id: question.id.toString(10) })}>\n          {question.title}\n        </Link>\n      </TableCell>\n      <TableCell>\n        <AuthorLink entity={question} />\n      </TableCell>\n      <TableCell>\n        <RelativeTimeWithTooltip value={question.created} />\n      </TableCell>\n      <TableCell>\n        <RelativeTimeWithTooltip\n          value={question.updated ? question.updated : question.created}\n        />\n      </TableCell>\n    </TableRow>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;AASa,MAAA,gBAAA,GAAmB,CAAC,KAA8B,KAAA;AAC7D,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AACrB,EAAM,MAAA,aAAA,GAAgB,YAAY,gBAAgB,CAAA;AAElD,EAAA,oDACG,QAAS,EAAA,EAAA,GAAA,EAAK,SAAS,EACtB,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,iCACEA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,IAAI,aAAc,CAAA,EAAE,IAAI,QAAS,CAAA,EAAA,CAAG,SAAS,EAAE,CAAA,EAAG,CACrD,EAAA,EAAA,QAAA,CAAS,KACZ,CACF,mBACCA,cAAA,CAAA,aAAA,CAAA,SAAA,EAAA,IAAA,+CACE,UAAW,EAAA,EAAA,MAAA,EAAQ,UAAU,CAChC,CAAA,+CACC,SACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,2BAAwB,KAAO,EAAA,QAAA,CAAS,SAAS,CACpD,CAAA,+CACC,SACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,uBAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA,QAAA,CAAS,OAAU,GAAA,QAAA,CAAS,UAAU,QAAS,CAAA;AAAA;AAAA,GAE1D,CACF,CAAA;AAEJ;;;;"}

package/dist/components/QuestionsTable/QuestionsTable.esm.js

@@ -1,23 +1,13 @@
 import React__default from 'react';
 import { WarningPanel, LinkButton, Progress } from '@backstage/core-components';
-import Typography from '@mui/material/Typography';
-import Grid from '@mui/material/Grid';
-import Button from '@mui/material/Button';
-import RefreshIcon from '@mui/icons-material/Refresh';
-import ButtonGroup from '@mui/material/ButtonGroup';
-import TableContainer from '@mui/material/TableContainer';
-import Table from '@mui/material/Table';
-import TableHead from '@mui/material/TableHead';
-import TableRow from '@mui/material/TableRow';
-import TableCell from '@mui/material/TableCell';
-import TablePagination from '@mui/material/TablePagination';
-import TableBody from '@mui/material/TableBody';
 import { QuestionTableRow } from './QuestionTableRow.esm.js';
 import { useQetaApi } from '../../hooks/useQetaApi.esm.js';
 import '@backstage/core-plugin-api';
 import '../../api.esm.js';
 import { useTranslation } from '../../hooks/useTranslation.esm.js';
 import 'react-use/lib/useAsync';
+import { Grid, Typography, ButtonGroup, Button, TableContainer, Table, TableHead, TableRow, TableCell, TableBody, TablePagination } from '@material-ui/core';
+import RefreshIcon from '@material-ui/icons/Refresh';
 
 const QuestionsTable = (props) => {
   const [page, setPage] = React__default.useState(1);

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

@@ -1 +1 @@
-{"version":3,"file":"QuestionsTable.esm.js","sources":["../../../src/components/QuestionsTable/QuestionsTable.tsx"],"sourcesContent":["import React from 'react';\nimport { LinkButton, Progress, WarningPanel } from '@backstage/core-components';\nimport Typography from '@mui/material/Typography';\nimport Grid from '@mui/material/Grid';\nimport Button from '@mui/material/Button';\nimport RefreshIcon from '@mui/icons-material/Refresh';\nimport ButtonGroup from '@mui/material/ButtonGroup';\nimport TableContainer from '@mui/material/TableContainer';\nimport Table from '@mui/material/Table';\nimport TableHead from '@mui/material/TableHead';\nimport TableRow from '@mui/material/TableRow';\nimport TableCell from '@mui/material/TableCell';\nimport TablePagination from '@mui/material/TablePagination';\nimport TableBody from '@mui/material/TableBody';\nimport { QuestionTableRow } from './QuestionTableRow';\nimport { useQetaApi, useTranslation } from '../../hooks';\n\ntype QuickFilterType = 'latest' | 'favorites' | 'most_viewed';\n\nexport const QuestionsTable = (props: {\n  hideTitle?: boolean;\n  rowsPerPage?: number;\n  quickFilter?: QuickFilterType;\n}) => {\n  const [page, setPage] = React.useState(1);\n  const [questionsPerPage, setQuestionsPerPage] = React.useState(\n    props.rowsPerPage ?? 10,\n  );\n  const [quickFilter, setQuickFilter] = React.useState(\n    props.quickFilter ?? 'latest',\n  );\n  const [refresh, setRefresh] = React.useState(0);\n  const { t } = useTranslation();\n  const [filters, setFilters] = React.useState({\n    order: 'desc',\n    orderBy: 'created',\n    noAnswers: 'false',\n    noCorrectAnswer: 'false',\n    noVotes: 'false',\n    searchQuery: '',\n    favorite: false,\n  });\n  const {\n    value: response,\n    loading,\n    error,\n  } = useQetaApi(\n    api =>\n      api.getPosts({\n        type: 'question',\n        limit: questionsPerPage,\n        offset: (page - 1) * questionsPerPage,\n        includeEntities: true,\n        ...(filters as any),\n      }),\n    [page, filters, questionsPerPage, refresh],\n  );\n\n  const handleQuickFilterChange = (filter: QuickFilterType) => {\n    setQuickFilter(filter);\n    if (filter === 'latest') {\n      setFilters({\n        ...filters,\n        order: 'desc',\n        orderBy: 'created',\n        favorite: false,\n      });\n    } else if (filter === 'favorites') {\n      setFilters({\n        ...filters,\n        order: 'desc',\n        orderBy: 'created',\n        favorite: true,\n      });\n    } else if (filter === 'most_viewed') {\n      setFilters({\n        ...filters,\n        order: 'desc',\n        orderBy: 'views',\n        favorite: false,\n      });\n    }\n  };\n\n  const handleChangePage = (_: unknown, newPage: number) => {\n    setPage(newPage + 1);\n  };\n\n  const handleChangeRowsPerPage = (\n    event: React.ChangeEvent<HTMLInputElement>,\n  ) => {\n    setQuestionsPerPage(parseInt(event.target.value, 10));\n    setPage(1);\n  };\n\n  if (error || response === undefined) {\n    return (\n      <WarningPanel severity=\"error\" title={t('questionsTable.errorLoading')}>\n        {error?.message}\n      </WarningPanel>\n    );\n  }\n\n  return (\n    <>\n      <Grid\n        container\n        justifyContent=\"space-between\"\n        alignItems=\"center\"\n        style={{ marginBottom: '1em' }}\n        className=\"qetaQuestionsTableGrid\"\n      >\n        <Grid item>\n          {props.hideTitle === true ? null : (\n            <Typography variant=\"h5\">{t('pluginName')}</Typography>\n          )}\n        </Grid>\n        <Grid item>\n          <ButtonGroup>\n            <Button\n              color={quickFilter === 'latest' ? 'primary' : undefined}\n              onClick={() => handleQuickFilterChange('latest')}\n            >\n              {t('questionsTable.latest')}\n            </Button>\n            <Button\n              color={quickFilter === 'favorites' ? 'primary' : undefined}\n              onClick={() => handleQuickFilterChange('favorites')}\n            >\n              {t('questionsTable.favorites')}\n            </Button>\n            <Button\n              color={quickFilter === 'most_viewed' ? 'primary' : undefined}\n              onClick={() => handleQuickFilterChange('most_viewed')}\n            >\n              {t('questionsTable.mostViewed')}\n            </Button>\n          </ButtonGroup>\n          <LinkButton\n            to=\"#\"\n            variant=\"text\"\n            onClick={() => setRefresh(refresh + 1)}\n          >\n            <RefreshIcon />\n          </LinkButton>\n        </Grid>\n      </Grid>\n      <TableContainer>\n        <Table className=\"qetaQuestionsTable\">\n          <TableHead>\n            <TableRow>\n              <TableCell>{t('questionsTable.cells.title')}</TableCell>\n              <TableCell>{t('questionsTable.cells.author')}</TableCell>\n              <TableCell>{t('questionsTable.cells.asked')}</TableCell>\n              <TableCell>{t('questionsTable.cells.updated')}</TableCell>\n            </TableRow>\n          </TableHead>\n          <TableBody>\n            {loading ? <Progress /> : null}\n            {response.posts.map(q => (\n              <QuestionTableRow question={q} />\n            ))}\n          </TableBody>\n        </Table>\n        <TablePagination\n          rowsPerPageOptions={[5, 10, 20, 30, 40, 50]}\n          component=\"div\"\n          count={response.total}\n          rowsPerPage={questionsPerPage}\n          page={page - 1}\n          onPageChange={handleChangePage}\n          onRowsPerPageChange={handleChangeRowsPerPage}\n        />\n      </TableContainer>\n    </>\n  );\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"QuestionsTable.esm.js","sources":["../../../src/components/QuestionsTable/QuestionsTable.tsx"],"sourcesContent":["import React from 'react';\nimport { LinkButton, Progress, WarningPanel } from '@backstage/core-components';\nimport { QuestionTableRow } from './QuestionTableRow';\nimport { useQetaApi, useTranslation } from '../../hooks';\nimport {\n  Button,\n  ButtonGroup,\n  Grid,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TablePagination,\n  TableRow,\n  Typography,\n} from '@material-ui/core';\nimport RefreshIcon from '@material-ui/icons/Refresh';\n\ntype QuickFilterType = 'latest' | 'favorites' | 'most_viewed';\n\nexport const QuestionsTable = (props: {\n  hideTitle?: boolean;\n  rowsPerPage?: number;\n  quickFilter?: QuickFilterType;\n}) => {\n  const [page, setPage] = React.useState(1);\n  const [questionsPerPage, setQuestionsPerPage] = React.useState(\n    props.rowsPerPage ?? 10,\n  );\n  const [quickFilter, setQuickFilter] = React.useState(\n    props.quickFilter ?? 'latest',\n  );\n  const [refresh, setRefresh] = React.useState(0);\n  const { t } = useTranslation();\n  const [filters, setFilters] = React.useState({\n    order: 'desc',\n    orderBy: 'created',\n    noAnswers: 'false',\n    noCorrectAnswer: 'false',\n    noVotes: 'false',\n    searchQuery: '',\n    favorite: false,\n  });\n  const {\n    value: response,\n    loading,\n    error,\n  } = useQetaApi(\n    api =>\n      api.getPosts({\n        type: 'question',\n        limit: questionsPerPage,\n        offset: (page - 1) * questionsPerPage,\n        includeEntities: true,\n        ...(filters as any),\n      }),\n    [page, filters, questionsPerPage, refresh],\n  );\n\n  const handleQuickFilterChange = (filter: QuickFilterType) => {\n    setQuickFilter(filter);\n    if (filter === 'latest') {\n      setFilters({\n        ...filters,\n        order: 'desc',\n        orderBy: 'created',\n        favorite: false,\n      });\n    } else if (filter === 'favorites') {\n      setFilters({\n        ...filters,\n        order: 'desc',\n        orderBy: 'created',\n        favorite: true,\n      });\n    } else if (filter === 'most_viewed') {\n      setFilters({\n        ...filters,\n        order: 'desc',\n        orderBy: 'views',\n        favorite: false,\n      });\n    }\n  };\n\n  const handleChangePage = (_: unknown, newPage: number) => {\n    setPage(newPage + 1);\n  };\n\n  const handleChangeRowsPerPage = (\n    event: React.ChangeEvent<HTMLInputElement>,\n  ) => {\n    setQuestionsPerPage(parseInt(event.target.value, 10));\n    setPage(1);\n  };\n\n  if (error || response === undefined) {\n    return (\n      <WarningPanel severity=\"error\" title={t('questionsTable.errorLoading')}>\n        {error?.message}\n      </WarningPanel>\n    );\n  }\n\n  return (\n    <>\n      <Grid\n        container\n        justifyContent=\"space-between\"\n        alignItems=\"center\"\n        style={{ marginBottom: '1em' }}\n        className=\"qetaQuestionsTableGrid\"\n      >\n        <Grid item>\n          {props.hideTitle === true ? null : (\n            <Typography variant=\"h5\">{t('pluginName')}</Typography>\n          )}\n        </Grid>\n        <Grid item>\n          <ButtonGroup>\n            <Button\n              color={quickFilter === 'latest' ? 'primary' : undefined}\n              onClick={() => handleQuickFilterChange('latest')}\n            >\n              {t('questionsTable.latest')}\n            </Button>\n            <Button\n              color={quickFilter === 'favorites' ? 'primary' : undefined}\n              onClick={() => handleQuickFilterChange('favorites')}\n            >\n              {t('questionsTable.favorites')}\n            </Button>\n            <Button\n              color={quickFilter === 'most_viewed' ? 'primary' : undefined}\n              onClick={() => handleQuickFilterChange('most_viewed')}\n            >\n              {t('questionsTable.mostViewed')}\n            </Button>\n          </ButtonGroup>\n          <LinkButton\n            to=\"#\"\n            variant=\"text\"\n            onClick={() => setRefresh(refresh + 1)}\n          >\n            <RefreshIcon />\n          </LinkButton>\n        </Grid>\n      </Grid>\n      <TableContainer>\n        <Table className=\"qetaQuestionsTable\">\n          <TableHead>\n            <TableRow>\n              <TableCell>{t('questionsTable.cells.title')}</TableCell>\n              <TableCell>{t('questionsTable.cells.author')}</TableCell>\n              <TableCell>{t('questionsTable.cells.asked')}</TableCell>\n              <TableCell>{t('questionsTable.cells.updated')}</TableCell>\n            </TableRow>\n          </TableHead>\n          <TableBody>\n            {loading ? <Progress /> : null}\n            {response.posts.map(q => (\n              <QuestionTableRow question={q} />\n            ))}\n          </TableBody>\n        </Table>\n        <TablePagination\n          rowsPerPageOptions={[5, 10, 20, 30, 40, 50]}\n          component=\"div\"\n          count={response.total}\n          rowsPerPage={questionsPerPage}\n          page={page - 1}\n          onPageChange={handleChangePage}\n          onRowsPerPageChange={handleChangeRowsPerPage}\n        />\n      </TableContainer>\n    </>\n  );\n};\n"],"names":["React"],"mappings":"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"}

package/dist/components/RelativeTimeWithTooltip/RelativeTimeWithTooltip.esm.js

@@ -1,6 +1,6 @@
-import Tooltip from '@mui/material/Tooltip';
 import React__default, { useEffect } from 'react';
 import RelativeTime from 'react-relative-time';
+import { Tooltip } from '@material-ui/core';
 
 const RelativeTimeWithTooltip = (props) => {
   const { value } = props;

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

@@ -1 +1 @@
-{"version":3,"file":"RelativeTimeWithTooltip.esm.js","sources":["../../../src/components/RelativeTimeWithTooltip/RelativeTimeWithTooltip.tsx"],"sourcesContent":["import Tooltip from '@mui/material/Tooltip';\nimport React, { useEffect } from 'react';\n// @ts-ignore\nimport RelativeTime from 'react-relative-time';\n\nexport const RelativeTimeWithTooltip = (props: { value: Date | string }) => {\n  const { value } = props;\n  let date = value;\n  const [updates, setUpdates] = React.useState(1);\n\n  useEffect(() => {\n    const interval = setInterval(() => {\n      setUpdates(updates === 1 ? 0 : 1);\n    }, 30000);\n    return () => clearInterval(interval);\n  }, [updates, setUpdates]);\n\n  if (typeof date === 'string' || date instanceof String) {\n    date = new Date(date);\n  }\n\n  return (\n    <Tooltip title={date.toLocaleString(navigator.languages)}>\n      <div style={{ display: 'inline' }}>\n        <RelativeTime value={date} />\n      </div>\n    </Tooltip>\n  );\n};\n"],"names":["React"],"mappings":";;;;AAKa,MAAA,uBAAA,GAA0B,CAAC,KAAoC,KAAA;AAC1E,EAAM,MAAA,EAAE,OAAU,GAAA,KAAA;AAClB,EAAA,IAAI,IAAO,GAAA,KAAA;AACX,EAAA,MAAM,CAAC,OAAS,EAAA,UAAU,CAAI,GAAAA,cAAA,CAAM,SAAS,CAAC,CAAA;AAE9C,EAAA,SAAA,CAAU,MAAM;AACd,IAAM,MAAA,QAAA,GAAW,YAAY,MAAM;AACjC,MAAW,UAAA,CAAA,OAAA,KAAY,CAAI,GAAA,CAAA,GAAI,CAAC,CAAA;AAAA,OAC/B,GAAK,CAAA;AACR,IAAO,OAAA,MAAM,cAAc,QAAQ,CAAA;AAAA,GAClC,EAAA,CAAC,OAAS,EAAA,UAAU,CAAC,CAAA;AAExB,EAAA,IAAI,OAAO,IAAA,KAAS,QAAY,IAAA,IAAA,YAAgB,MAAQ,EAAA;AACtD,IAAO,IAAA,GAAA,IAAI,KAAK,IAAI,CAAA;AAAA;AAGtB,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAC,WAAQ,KAAO,EAAA,IAAA,CAAK,eAAe,SAAU,CAAA,SAAS,qBACpDA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,OAAO,EAAE,OAAA,EAAS,UACrB,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,gBAAa,KAAO,EAAA,IAAA,EAAM,CAC7B,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"RelativeTimeWithTooltip.esm.js","sources":["../../../src/components/RelativeTimeWithTooltip/RelativeTimeWithTooltip.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\n// @ts-ignore\nimport RelativeTime from 'react-relative-time';\nimport { Tooltip } from '@material-ui/core';\n\nexport const RelativeTimeWithTooltip = (props: { value: Date | string }) => {\n  const { value } = props;\n  let date = value;\n  const [updates, setUpdates] = React.useState(1);\n\n  useEffect(() => {\n    const interval = setInterval(() => {\n      setUpdates(updates === 1 ? 0 : 1);\n    }, 30000);\n    return () => clearInterval(interval);\n  }, [updates, setUpdates]);\n\n  if (typeof date === 'string' || date instanceof String) {\n    date = new Date(date);\n  }\n\n  return (\n    <Tooltip title={date.toLocaleString(navigator.languages)}>\n      <div style={{ display: 'inline' }}>\n        <RelativeTime value={date} />\n      </div>\n    </Tooltip>\n  );\n};\n"],"names":["React"],"mappings":";;;;AAKa,MAAA,uBAAA,GAA0B,CAAC,KAAoC,KAAA;AAC1E,EAAM,MAAA,EAAE,OAAU,GAAA,KAAA;AAClB,EAAA,IAAI,IAAO,GAAA,KAAA;AACX,EAAA,MAAM,CAAC,OAAS,EAAA,UAAU,CAAI,GAAAA,cAAA,CAAM,SAAS,CAAC,CAAA;AAE9C,EAAA,SAAA,CAAU,MAAM;AACd,IAAM,MAAA,QAAA,GAAW,YAAY,MAAM;AACjC,MAAW,UAAA,CAAA,OAAA,KAAY,CAAI,GAAA,CAAA,GAAI,CAAC,CAAA;AAAA,OAC/B,GAAK,CAAA;AACR,IAAO,OAAA,MAAM,cAAc,QAAQ,CAAA;AAAA,GAClC,EAAA,CAAC,OAAS,EAAA,UAAU,CAAC,CAAA;AAExB,EAAA,IAAI,OAAO,IAAA,KAAS,QAAY,IAAA,IAAA,YAAgB,MAAQ,EAAA;AACtD,IAAO,IAAA,GAAA,IAAI,KAAK,IAAI,CAAA;AAAA;AAGtB,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAC,WAAQ,KAAO,EAAA,IAAA,CAAK,eAAe,SAAU,CAAA,SAAS,qBACpDA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,OAAO,EAAE,OAAA,EAAS,UACrB,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,gBAAa,KAAO,EAAA,IAAA,EAAM,CAC7B,CACF,CAAA;AAEJ;;;;"}

package/dist/components/SearchBar/SearchBar.esm.js

@@ -1,57 +1,69 @@
 import * as React from 'react';
-import Paper from '@mui/material/Paper';
-import InputBase from '@mui/material/InputBase';
-import IconButton from '@mui/material/IconButton';
-import SearchIcon from '@mui/icons-material/Search';
-import CloseIcon from '@mui/icons-material/Close';
+import { makeStyles, Paper, IconButton, InputBase } from '@material-ui/core';
+import SearchIcon from '@material-ui/icons/Search';
+import CloseIcon from '@material-ui/icons/Close';
 
+const useStyles = makeStyles(
+  (theme) => ({
+    root: {
+      padding: "2px 4px",
+      display: "flex",
+      alignItems: "center",
+      minWidth: 300
+    },
+    input: {
+      marginLeft: theme.spacing(1),
+      flex: 1
+    },
+    iconButton: {
+      padding: 5
+    },
+    divider: {
+      height: 28,
+      margin: 4
+    }
+  }),
+  { name: "QetaSearchBar" }
+);
 const SearchBar = (props) => {
   const { label, onSearch } = props;
   const [searchQuery, setSearchQuery] = React.useState("");
-  return /* @__PURE__ */ React.createElement(
-    Paper,
+  const classes = useStyles();
+  return /* @__PURE__ */ React.createElement(Paper, { component: "form", className: classes.root }, /* @__PURE__ */ React.createElement(
+    IconButton,
     {
-      component: "form",
-      sx: {
-        p: "2px 4px",
-        display: "flex",
-        alignItems: "center",
-        width: "100%",
-        marginBottom: "1em",
-        cursor: "text",
-        boxShadow: "none"
-      }
+      type: "button",
+      "aria-label": "search",
+      className: classes.iconButton
     },
-    /* @__PURE__ */ React.createElement(IconButton, { type: "button", sx: { p: "10px" }, "aria-label": "search" }, /* @__PURE__ */ React.createElement(SearchIcon, { color: "disabled" })),
-    /* @__PURE__ */ React.createElement(
-      InputBase,
-      {
-        sx: { flex: 1 },
-        placeholder: label,
-        value: searchQuery,
-        inputProps: {
-          "aria-label": label,
-          onChange: (event) => {
-            onSearch(event.target.value);
-            setSearchQuery(event.target.value);
-          }
+    /* @__PURE__ */ React.createElement(SearchIcon, { color: "disabled" })
+  ), /* @__PURE__ */ React.createElement(
+    InputBase,
+    {
+      className: classes.input,
+      placeholder: label,
+      value: searchQuery,
+      inputProps: {
+        "aria-label": label,
+        onChange: (event) => {
+          onSearch(event.target.value);
+          setSearchQuery(event.target.value);
         }
       }
-    ),
-    searchQuery && /* @__PURE__ */ React.createElement(
-      IconButton,
-      {
-        type: "button",
-        sx: { p: "10px" },
-        "aria-label": "clear",
-        onClick: () => {
-          onSearch("");
-          setSearchQuery("");
-        }
-      },
-      /* @__PURE__ */ React.createElement(CloseIcon, null)
-    )
-  );
+    }
+  ), searchQuery && /* @__PURE__ */ React.createElement(
+    IconButton,
+    {
+      type: "button",
+      "aria-label": "clear",
+      className: classes.iconButton,
+      onClick: () => {
+        onSearch("");
+        setSearchQuery("");
+      }
+    },
+    /* @__PURE__ */ React.createElement(CloseIcon, null)
+  ));
 };
 
 export { SearchBar };

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

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.esm.js","sources":["../../../src/components/SearchBar/SearchBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport Paper from '@mui/material/Paper';\nimport InputBase from '@mui/material/InputBase';\nimport IconButton from '@mui/material/IconButton';\nimport SearchIcon from '@mui/icons-material/Search';\nimport CloseIcon from '@mui/icons-material/Close';\n\nexport const SearchBar = (props: {\n  label: string;\n  onSearch: (query: string) => void;\n}) => {\n  const { label, onSearch } = props;\n  const [searchQuery, setSearchQuery] = React.useState('');\n  return (\n    <Paper\n      component=\"form\"\n      sx={{\n        p: '2px 4px',\n        display: 'flex',\n        alignItems: 'center',\n        width: '100%',\n        marginBottom: '1em',\n        cursor: 'text',\n        boxShadow: 'none',\n      }}\n    >\n      <IconButton type=\"button\" sx={{ p: '10px' }} aria-label=\"search\">\n        <SearchIcon color=\"disabled\" />\n      </IconButton>\n      <InputBase\n        sx={{ flex: 1 }}\n        placeholder={label}\n        value={searchQuery}\n        inputProps={{\n          'aria-label': label,\n          onChange: (\n            event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>,\n          ) => {\n            onSearch(event.target.value);\n            setSearchQuery(event.target.value);\n          },\n        }}\n      />\n      {searchQuery && (\n        <IconButton\n          type=\"button\"\n          sx={{ p: '10px' }}\n          aria-label=\"clear\"\n          onClick={() => {\n            onSearch('');\n            setSearchQuery('');\n          }}\n        >\n          <CloseIcon />\n        </IconButton>\n      )}\n    </Paper>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAOa,MAAA,SAAA,GAAY,CAAC,KAGpB,KAAA;AACJ,EAAM,MAAA,EAAE,KAAO,EAAA,QAAA,EAAa,GAAA,KAAA;AAC5B,EAAA,MAAM,CAAC,WAAa,EAAA,cAAc,CAAI,GAAA,KAAA,CAAM,SAAS,EAAE,CAAA;AACvD,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,MAAA;AAAA,MACV,EAAI,EAAA;AAAA,QACF,CAAG,EAAA,SAAA;AAAA,QACH,OAAS,EAAA,MAAA;AAAA,QACT,UAAY,EAAA,QAAA;AAAA,QACZ,KAAO,EAAA,MAAA;AAAA,QACP,YAAc,EAAA,KAAA;AAAA,QACd,MAAQ,EAAA,MAAA;AAAA,QACR,SAAW,EAAA;AAAA;AACb,KAAA;AAAA,oBAEC,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,IAAK,EAAA,QAAA,EAAS,IAAI,EAAE,CAAA,EAAG,MAAO,EAAA,EAAG,cAAW,QACtD,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,KAAA,EAAM,YAAW,CAC/B,CAAA;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QACC,EAAA,EAAI,EAAE,IAAA,EAAM,CAAE,EAAA;AAAA,QACd,WAAa,EAAA,KAAA;AAAA,QACb,KAAO,EAAA,WAAA;AAAA,QACP,UAAY,EAAA;AAAA,UACV,YAAc,EAAA,KAAA;AAAA,UACd,QAAA,EAAU,CACR,KACG,KAAA;AACH,YAAS,QAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA;AAC3B,YAAe,cAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA;AAAA;AACnC;AACF;AAAA,KACF;AAAA,IACC,WACC,oBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,IAAK,EAAA,QAAA;AAAA,QACL,EAAA,EAAI,EAAE,CAAA,EAAG,MAAO,EAAA;AAAA,QAChB,YAAW,EAAA,OAAA;AAAA,QACX,SAAS,MAAM;AACb,UAAA,QAAA,CAAS,EAAE,CAAA;AACX,UAAA,cAAA,CAAe,EAAE,CAAA;AAAA;AACnB,OAAA;AAAA,0CAEC,SAAU,EAAA,IAAA;AAAA;AACb,GAEJ;AAEJ;;;;"}
+{"version":3,"file":"SearchBar.esm.js","sources":["../../../src/components/SearchBar/SearchBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  IconButton,\n  InputBase,\n  makeStyles,\n  Paper,\n  Theme,\n} from '@material-ui/core';\nimport SearchIcon from '@material-ui/icons/Search';\nimport CloseIcon from '@material-ui/icons/Close';\n\nexport type QetaSearchBarClassKeys =\n  | 'root'\n  | 'input'\n  | 'iconButton'\n  | 'divider';\n\nconst useStyles = makeStyles(\n  (theme: Theme) => ({\n    root: {\n      padding: '2px 4px',\n      display: 'flex',\n      alignItems: 'center',\n      minWidth: 300,\n    },\n    input: {\n      marginLeft: theme.spacing(1),\n      flex: 1,\n    },\n    iconButton: {\n      padding: 5,\n    },\n    divider: {\n      height: 28,\n      margin: 4,\n    },\n  }),\n  { name: 'QetaSearchBar' },\n);\n\nexport const SearchBar = (props: {\n  label: string;\n  onSearch: (query: string) => void;\n}) => {\n  const { label, onSearch } = props;\n  const [searchQuery, setSearchQuery] = React.useState('');\n  const classes = useStyles();\n\n  return (\n    <Paper component=\"form\" className={classes.root}>\n      <IconButton\n        type=\"button\"\n        aria-label=\"search\"\n        className={classes.iconButton}\n      >\n        <SearchIcon color=\"disabled\" />\n      </IconButton>\n      <InputBase\n        className={classes.input}\n        placeholder={label}\n        value={searchQuery}\n        inputProps={{\n          'aria-label': label,\n          onChange: (\n            event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>,\n          ) => {\n            onSearch(event.target.value);\n            setSearchQuery(event.target.value);\n          },\n        }}\n      />\n      {searchQuery && (\n        <IconButton\n          type=\"button\"\n          aria-label=\"clear\"\n          className={classes.iconButton}\n          onClick={() => {\n            onSearch('');\n            setSearchQuery('');\n          }}\n        >\n          <CloseIcon />\n        </IconButton>\n      )}\n    </Paper>\n  );\n};\n"],"names":[],"mappings":";;;;;AAiBA,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB,CAAC,KAAkB,MAAA;AAAA,IACjB,IAAM,EAAA;AAAA,MACJ,OAAS,EAAA,SAAA;AAAA,MACT,OAAS,EAAA,MAAA;AAAA,MACT,UAAY,EAAA,QAAA;AAAA,MACZ,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,KAAO,EAAA;AAAA,MACL,UAAA,EAAY,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MAC3B,IAAM,EAAA;AAAA,KACR;AAAA,IACA,UAAY,EAAA;AAAA,MACV,OAAS,EAAA;AAAA,KACX;AAAA,IACA,OAAS,EAAA;AAAA,MACP,MAAQ,EAAA,EAAA;AAAA,MACR,MAAQ,EAAA;AAAA;AACV,GACF,CAAA;AAAA,EACA,EAAE,MAAM,eAAgB;AAC1B,CAAA;AAEa,MAAA,SAAA,GAAY,CAAC,KAGpB,KAAA;AACJ,EAAM,MAAA,EAAE,KAAO,EAAA,QAAA,EAAa,GAAA,KAAA;AAC5B,EAAA,MAAM,CAAC,WAAa,EAAA,cAAc,CAAI,GAAA,KAAA,CAAM,SAAS,EAAE,CAAA;AACvD,EAAA,MAAM,UAAU,SAAU,EAAA;AAE1B,EAAA,2CACG,KAAM,EAAA,EAAA,SAAA,EAAU,MAAO,EAAA,SAAA,EAAW,QAAQ,IACzC,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,QAAA;AAAA,MACL,YAAW,EAAA,QAAA;AAAA,MACX,WAAW,OAAQ,CAAA;AAAA,KAAA;AAAA,oBAEnB,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,KAAA,EAAM,UAAW,EAAA;AAAA,GAE/B,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAQ,CAAA,KAAA;AAAA,MACnB,WAAa,EAAA,KAAA;AAAA,MACb,KAAO,EAAA,WAAA;AAAA,MACP,UAAY,EAAA;AAAA,QACV,YAAc,EAAA,KAAA;AAAA,QACd,QAAA,EAAU,CACR,KACG,KAAA;AACH,UAAS,QAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA;AAC3B,UAAe,cAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA;AAAA;AACnC;AACF;AAAA,KAED,WACC,oBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,QAAA;AAAA,MACL,YAAW,EAAA,OAAA;AAAA,MACX,WAAW,OAAQ,CAAA,UAAA;AAAA,MACnB,SAAS,MAAM;AACb,QAAA,QAAA,CAAS,EAAE,CAAA;AACX,QAAA,cAAA,CAAe,EAAE,CAAA;AAAA;AACnB,KAAA;AAAA,wCAEC,SAAU,EAAA,IAAA;AAAA,GAGjB,CAAA;AAEJ;;;;"}

package/dist/components/SelectTemplateList/SelectTemplateList.esm.js

@@ -1,17 +1,10 @@
 import React__default from 'react';
-import Card from '@mui/material/Card';
-import CardContent from '@mui/material/CardContent';
-import CardHeader from '@mui/material/CardHeader';
-import Button from '@mui/material/Button';
-import ListItem from '@mui/material/ListItem';
-import List from '@mui/material/List';
-import ListItemSecondaryAction from '@mui/material/ListItemSecondaryAction';
-import ListItemText from '@mui/material/ListItemText';
 import '@backstage/core-plugin-api';
 import '../../api.esm.js';
 import 'react-use';
 import { useTranslation } from '../../hooks/useTranslation.esm.js';
 import 'react-use/lib/useAsync';
+import { Card, CardHeader, CardContent, List, ListItem, ListItemText, ListItemSecondaryAction, Button } from '@material-ui/core';
 
 const SelectTemplateList = (props) => {
   const { templates, onTemplateSelect } = props;

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

@@ -1 +1 @@
-{"version":3,"file":"SelectTemplateList.esm.js","sources":["../../../src/components/SelectTemplateList/SelectTemplateList.tsx"],"sourcesContent":["import {\n  Template,\n  TemplatesResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport React from 'react';\nimport Card from '@mui/material/Card';\nimport CardContent from '@mui/material/CardContent';\nimport CardHeader from '@mui/material/CardHeader';\nimport Button from '@mui/material/Button';\nimport ListItem from '@mui/material/ListItem';\nimport List from '@mui/material/List';\nimport ListItemSecondaryAction from '@mui/material/ListItemSecondaryAction';\nimport ListItemText from '@mui/material/ListItemText';\nimport { useTranslation } from '../../hooks';\n\nexport const SelectTemplateList = (props: {\n  templates: TemplatesResponse;\n  onTemplateSelect: (template: Template | null) => void;\n}) => {\n  const { templates, onTemplateSelect } = props;\n  const { t } = useTranslation();\n  if (templates.total === 0) {\n    return null;\n  }\n\n  return (\n    <Card>\n      <CardHeader title={t('templateSelectList.title')} />\n      <CardContent>\n        <List style={{ width: '100%' }}>\n          {templates.templates.map((template, index) => (\n            <ListItem key={index}>\n              <ListItemText\n                primary={template.title}\n                secondary={template.description}\n              />\n              <ListItemSecondaryAction>\n                <Button\n                  variant=\"outlined\"\n                  color=\"primary\"\n                  onClick={() => onTemplateSelect(template)}\n                >\n                  {t('templateSelectList.selectButton')}\n                </Button>\n              </ListItemSecondaryAction>\n            </ListItem>\n          ))}\n          <ListItem>\n            <ListItemText\n              primary={t('templateSelectList.genericQuestion')}\n              secondary={t('templateSelectList.genericQuestionDescription')}\n            />\n            <ListItemSecondaryAction>\n              <Button\n                variant=\"outlined\"\n                color=\"primary\"\n                onClick={() => onTemplateSelect(null)}\n              >\n                {t('templateSelectList.selectButton')}\n              </Button>\n            </ListItemSecondaryAction>\n          </ListItem>\n        </List>\n      </CardContent>\n    </Card>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;AAea,MAAA,kBAAA,GAAqB,CAAC,KAG7B,KAAA;AACJ,EAAM,MAAA,EAAE,SAAW,EAAA,gBAAA,EAAqB,GAAA,KAAA;AACxC,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA;AAC7B,EAAI,IAAA,SAAA,CAAU,UAAU,CAAG,EAAA;AACzB,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAC,IACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,KAAA,EAAO,CAAE,CAAA,0BAA0B,CAAG,EAAA,CAAA,kBACjDA,cAAA,CAAA,aAAA,CAAA,WAAA,EAAA,IAAA,kBACEA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,EACnB,EAAA,EAAA,SAAA,CAAU,SAAU,CAAA,GAAA,CAAI,CAAC,QAAA,EAAU,KAClC,qBAAAA,cAAA,CAAA,aAAA,CAAC,QAAS,EAAA,EAAA,GAAA,EAAK,KACb,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,SAAS,QAAS,CAAA,KAAA;AAAA,MAClB,WAAW,QAAS,CAAA;AAAA;AAAA,GACtB,+CACC,uBACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,UAAA;AAAA,MACR,KAAM,EAAA,SAAA;AAAA,MACN,OAAA,EAAS,MAAM,gBAAA,CAAiB,QAAQ;AAAA,KAAA;AAAA,IAEvC,EAAE,iCAAiC;AAAA,GAExC,CACF,CACD,CAAA,+CACA,QACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,OAAA,EAAS,EAAE,oCAAoC,CAAA;AAAA,MAC/C,SAAA,EAAW,EAAE,+CAA+C;AAAA;AAAA,GAC9D,+CACC,uBACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,UAAA;AAAA,MACR,KAAM,EAAA,SAAA;AAAA,MACN,OAAA,EAAS,MAAM,gBAAA,CAAiB,IAAI;AAAA,KAAA;AAAA,IAEnC,EAAE,iCAAiC;AAAA,GAExC,CACF,CACF,CACF,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"SelectTemplateList.esm.js","sources":["../../../src/components/SelectTemplateList/SelectTemplateList.tsx"],"sourcesContent":["import {\n  Template,\n  TemplatesResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport React from 'react';\nimport { useTranslation } from '../../hooks';\nimport {\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  List,\n  ListItem,\n  ListItemSecondaryAction,\n  ListItemText,\n} from '@material-ui/core';\n\nexport const SelectTemplateList = (props: {\n  templates: TemplatesResponse;\n  onTemplateSelect: (template: Template | null) => void;\n}) => {\n  const { templates, onTemplateSelect } = props;\n  const { t } = useTranslation();\n  if (templates.total === 0) {\n    return null;\n  }\n\n  return (\n    <Card>\n      <CardHeader title={t('templateSelectList.title')} />\n      <CardContent>\n        <List style={{ width: '100%' }}>\n          {templates.templates.map((template, index) => (\n            <ListItem key={index}>\n              <ListItemText\n                primary={template.title}\n                secondary={template.description}\n              />\n              <ListItemSecondaryAction>\n                <Button\n                  variant=\"outlined\"\n                  color=\"primary\"\n                  onClick={() => onTemplateSelect(template)}\n                >\n                  {t('templateSelectList.selectButton')}\n                </Button>\n              </ListItemSecondaryAction>\n            </ListItem>\n          ))}\n          <ListItem>\n            <ListItemText\n              primary={t('templateSelectList.genericQuestion')}\n              secondary={t('templateSelectList.genericQuestionDescription')}\n            />\n            <ListItemSecondaryAction>\n              <Button\n                variant=\"outlined\"\n                color=\"primary\"\n                onClick={() => onTemplateSelect(null)}\n              >\n                {t('templateSelectList.selectButton')}\n              </Button>\n            </ListItemSecondaryAction>\n          </ListItem>\n        </List>\n      </CardContent>\n    </Card>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;AAiBa,MAAA,kBAAA,GAAqB,CAAC,KAG7B,KAAA;AACJ,EAAM,MAAA,EAAE,SAAW,EAAA,gBAAA,EAAqB,GAAA,KAAA;AACxC,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA;AAC7B,EAAI,IAAA,SAAA,CAAU,UAAU,CAAG,EAAA;AACzB,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAC,IACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,KAAA,EAAO,CAAE,CAAA,0BAA0B,CAAG,EAAA,CAAA,kBACjDA,cAAA,CAAA,aAAA,CAAA,WAAA,EAAA,IAAA,kBACEA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,EACnB,EAAA,EAAA,SAAA,CAAU,SAAU,CAAA,GAAA,CAAI,CAAC,QAAA,EAAU,KAClC,qBAAAA,cAAA,CAAA,aAAA,CAAC,QAAS,EAAA,EAAA,GAAA,EAAK,KACb,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,SAAS,QAAS,CAAA,KAAA;AAAA,MAClB,WAAW,QAAS,CAAA;AAAA;AAAA,GACtB,+CACC,uBACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,UAAA;AAAA,MACR,KAAM,EAAA,SAAA;AAAA,MACN,OAAA,EAAS,MAAM,gBAAA,CAAiB,QAAQ;AAAA,KAAA;AAAA,IAEvC,EAAE,iCAAiC;AAAA,GAExC,CACF,CACD,CAAA,+CACA,QACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,OAAA,EAAS,EAAE,oCAAoC,CAAA;AAAA,MAC/C,SAAA,EAAW,EAAE,+CAA+C;AAAA;AAAA,GAC9D,+CACC,uBACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,UAAA;AAAA,MACR,KAAM,EAAA,SAAA;AAAA,MACN,OAAA,EAAS,MAAM,gBAAA,CAAiB,IAAI;AAAA,KAAA;AAAA,IAEnC,EAAE,iCAAiC;AAAA,GAExC,CACF,CACF,CACF,CACF,CAAA;AAEJ;;;;"}