@drodil/backstage-plugin-qeta-react 3.48.1 → 3.49.0

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

@@ -1 +1 @@
-{"version":3,"file":"ArticleContent.esm.js","sources":["../../../src/components/ArticleContent/ArticleContent.tsx"],"sourcesContent":["import {\n  AnswerResponse,\n  PostResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { Avatar, Box, Grid, makeStyles, Typography } from '@material-ui/core';\nimport { MarkdownRenderer } from '../MarkdownRenderer';\nimport { useState } from 'react';\nimport { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip';\nimport { ArticleButtons } from './ArticleButtons';\nimport { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities';\nimport { CommentSection } from '../CommentSection/CommentSection';\nimport { WarningPanel } from '@backstage/core-components';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { useEntityAuthor } from '../../hooks/useEntityAuthor';\nimport { DraftBanner } from '../Utility/DraftBanner';\nimport { DeletedBanner } from '../Utility/DeletedBanner.tsx';\nimport { getPostDisplayDate } from '../../utils/utils';\n\nexport type QetaArticleContentClassKey =\n  | 'content'\n  | 'headerImage'\n  | 'commentSection'\n  | 'commentSectionContainer';\n\nexport const useStyles = makeStyles(\n  theme => {\n    return {\n      content: {\n        paddingTop: theme.spacing(2),\n        paddingBottom: theme.spacing(2),\n        marginBottom: theme.spacing(2),\n        borderBottom: `1px solid ${theme.palette.background.paper}`,\n      },\n      headerImage: {\n        marginBottom: theme.spacing(2),\n        marginTop: theme.spacing(2),\n        height: '300px',\n        objectFit: 'cover',\n        width: '100%',\n        border: `1px solid ${theme.palette.background.paper}`,\n        boxShadow: theme.shadows[1],\n      },\n      commentSection: {\n        borderBottom: `1px solid ${theme.palette.background.paper}`,\n        paddingBottom: theme.spacing(2),\n        marginBottom: theme.spacing(2),\n        marginLeft: 0,\n      },\n      commentSectionContainer: {\n        marginTop: theme.spacing(4),\n      },\n    };\n  },\n  { name: 'QetaArticle' },\n);\n\nexport const ArticleContent = (props: {\n  post: PostResponse;\n  views: number;\n}) => {\n  const { post, views } = props;\n  const styles = useStyles();\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const { name, initials, user } = useEntityAuthor(post);\n  const [postEntity, setPostEntity] = useState(post);\n  const onCommentAction = (q: PostResponse, _?: AnswerResponse) => {\n    setPostEntity(q);\n  };\n\n  if (post.type !== 'article') {\n    return (\n      <WarningPanel title=\"Not found\" message=\"Could not find the article\" />\n    );\n  }\n\n  return (\n    <>\n      <Typography variant=\"h2\">{postEntity.title}</Typography>\n      {postEntity.status === 'draft' && <DraftBanner />}\n      {postEntity.status === 'deleted' && <DeletedBanner />}\n      <Grid container alignItems=\"center\">\n        <Grid item>\n          <Avatar\n            src={user?.spec?.profile?.picture}\n            className=\"qetaAvatar avatar\"\n            alt={name}\n            variant=\"rounded\"\n          >\n            {initials}\n          </Avatar>\n        </Grid>\n        <Grid item>\n          <Typography variant=\"subtitle1\">{name}</Typography>\n          <Typography variant=\"caption\">\n            {t('common.viewsCount', { count: views })} {' · '}\n            {t('authorBox.postedAtTime')}{' '}\n            <RelativeTimeWithTooltip value={getPostDisplayDate(postEntity)} />\n          </Typography>\n        </Grid>\n      </Grid>\n      <Grid container>\n        <Grid item xs={12}>\n          <ArticleButtons post={postEntity} />\n        </Grid>\n      </Grid>\n      {postEntity.headerImage && (\n        <img\n          src={post.headerImage}\n          alt={post.title}\n          onError={e => (e.currentTarget.style.display = 'none')}\n          className={styles.headerImage}\n        />\n      )}\n      <MarkdownRenderer\n        content={postEntity.content}\n        className={styles.content}\n        showToc\n      />\n      {post.status === 'active' && (\n        <Box className={styles.commentSectionContainer}>\n          <Typography variant=\"h6\">{t('common.comments')}</Typography>\n          <CommentSection\n            className={styles.commentSection}\n            post={postEntity}\n            onCommentAction={onCommentAction}\n            showProminentButton\n          />\n        </Box>\n      )}\n      <Grid container>\n        <Grid item xs={12}>\n          <TagsAndEntities entity={postEntity} />\n        </Grid>\n      </Grid>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ArticleContent.esm.js","sources":["../../../src/components/ArticleContent/ArticleContent.tsx"],"sourcesContent":["import {\n  AnswerResponse,\n  PostResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { Avatar, Box, Grid, makeStyles, Typography } from '@material-ui/core';\nimport { MarkdownRenderer } from '../MarkdownRenderer';\nimport { useState } from 'react';\nimport { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip';\nimport { ArticleButtons } from './ArticleButtons';\nimport { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities';\nimport { CommentSection } from '../CommentSection/CommentSection';\nimport { WarningPanel } from '@backstage/core-components';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { useEntityAuthor } from '../../hooks/useEntityAuthor';\nimport { DraftBanner } from '../Utility/DraftBanner';\nimport { DeletedBanner } from '../Utility/DeletedBanner.tsx';\nimport { getPostDisplayDate } from '../../utils/utils';\n\nexport type QetaArticleContentClassKey =\n  | 'content'\n  | 'headerImage'\n  | 'commentSection'\n  | 'commentSectionContainer';\n\nexport const useStyles = makeStyles(\n  theme => {\n    return {\n      content: {\n        paddingTop: theme.spacing(2),\n        paddingBottom: theme.spacing(2),\n        marginBottom: theme.spacing(2),\n        borderBottom: `1px solid ${theme.palette.background.paper}`,\n      },\n      headerImage: {\n        marginBottom: theme.spacing(2),\n        marginTop: theme.spacing(2),\n        height: '300px',\n        objectFit: 'cover',\n        width: '100%',\n        border: `1px solid ${theme.palette.background.paper}`,\n        boxShadow: theme.shadows[1],\n      },\n      commentSection: {\n        borderBottom: `1px solid ${theme.palette.background.paper}`,\n        paddingBottom: theme.spacing(2),\n        marginBottom: theme.spacing(2),\n        marginLeft: 0,\n      },\n      commentSectionContainer: {\n        marginTop: theme.spacing(4),\n      },\n    };\n  },\n  { name: 'QetaArticle' },\n);\n\nexport const ArticleContent = (props: {\n  post: PostResponse;\n  views: number;\n}) => {\n  const { post, views } = props;\n  const styles = useStyles();\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const { name, initials, user } = useEntityAuthor(post);\n  const [postEntity, setPostEntity] = useState(post);\n  const onCommentAction = (q: PostResponse, _?: AnswerResponse) => {\n    setPostEntity(q);\n  };\n\n  if (post.type !== 'article') {\n    return (\n      <WarningPanel title=\"Not found\" message=\"Could not find the article\" />\n    );\n  }\n\n  return (\n    <>\n      {postEntity.status === 'draft' && <DraftBanner />}\n      {postEntity.status === 'deleted' && <DeletedBanner />}\n      <Grid container alignItems=\"center\">\n        <Grid item>\n          <Avatar\n            src={user?.spec?.profile?.picture}\n            className=\"qetaAvatar avatar\"\n            alt={name}\n            variant=\"rounded\"\n          >\n            {initials}\n          </Avatar>\n        </Grid>\n        <Grid item>\n          <Typography variant=\"subtitle1\">{name}</Typography>\n          <Typography variant=\"caption\">\n            {t('common.viewsCount', { count: views })} {' · '}\n            {t('authorBox.postedAtTime')}{' '}\n            <RelativeTimeWithTooltip value={getPostDisplayDate(postEntity)} />\n          </Typography>\n        </Grid>\n      </Grid>\n      <Grid container>\n        <Grid item xs={12}>\n          <ArticleButtons post={postEntity} />\n        </Grid>\n      </Grid>\n      {postEntity.headerImage && (\n        <img\n          src={post.headerImage}\n          alt={post.title}\n          onError={e => (e.currentTarget.style.display = 'none')}\n          className={styles.headerImage}\n        />\n      )}\n      <MarkdownRenderer\n        content={postEntity.content}\n        className={styles.content}\n        showToc\n      />\n      {post.status === 'active' && (\n        <Box className={styles.commentSectionContainer}>\n          <Typography variant=\"h6\">{t('common.comments')}</Typography>\n          <CommentSection\n            className={styles.commentSection}\n            post={postEntity}\n            onCommentAction={onCommentAction}\n            showProminentButton\n          />\n        </Box>\n      )}\n      <Grid container>\n        <Grid item xs={12}>\n          <TagsAndEntities entity={postEntity} />\n        </Grid>\n      </Grid>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/AuthorBox/AuthorBox.esm.js

@@ -37,8 +37,8 @@ const useStyles = makeStyles(
       height: "20px"
     },
     avatarCompact: {
-      width: "16px",
-      height: "16px"
+      width: "20px",
+      height: "20px"
     },
     authorInfo: {
       textOverflow: "ellipsis",
@@ -84,7 +84,7 @@ const AuthorBox = (props) => {
           children: initials
         }
       ),
-      /* @__PURE__ */ jsx(UserLink, { entityRef: userEntityRef, anonymous }),
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "span", children: /* @__PURE__ */ jsx(UserLink, { entityRef: userEntityRef, anonymous }) }),
       expert && /* @__PURE__ */ jsx(ExpertIcon, { className: styles.expertIcon }),
       /* @__PURE__ */ jsx(Typography, { className: "qetaAuthorBoxCreated", variant: "caption", children: /* @__PURE__ */ jsx(RelativeTimeWithTooltip, { value: time }) })
     ] });

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

@@ -1 +1 @@
-{"version":3,"file":"AuthorBox.esm.js","sources":["../../../src/components/AuthorBox/AuthorBox.tsx"],"sourcesContent":["import { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip';\nimport { UserLink } from '../Links';\nimport { useUserInfo } from '../../hooks/useEntityAuthor';\nimport { Avatar, Box, makeStyles, Typography } from '@material-ui/core';\nimport { ExpertIcon } from '../Icons/ExpertIcon.tsx';\n\nconst useStyles = makeStyles(\n  theme => ({\n    authorBox: {\n      padding: theme.spacing(0, 1.5, 0, 0),\n      textAlign: 'right',\n      display: 'flex',\n      flexDirection: 'column',\n      gap: theme.spacing(0.5),\n      marginLeft: theme.spacing(2),\n      maxWidth: '200px',\n    },\n    authorBoxCompact: {\n      display: 'flex',\n      gap: theme.spacing(0.5),\n      alignItems: 'center',\n      marginBottom: '8px',\n      '& > *': {\n        fontSize: '12px',\n        display: 'inline-flex',\n        lineHeight: '16px',\n      },\n    },\n    timeRow: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'flex-end',\n    },\n    avatar: {\n      width: '20px',\n      height: '20px',\n    },\n    avatarCompact: {\n      width: '16px',\n      height: '16px',\n    },\n    authorInfo: {\n      textOverflow: 'ellipsis',\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      color: theme.palette.text.primary,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'flex-end',\n      gap: theme.spacing(0.5),\n    },\n    authorLink: {\n      textOverflow: 'ellipsis',\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      color: theme.palette.text.primary,\n    },\n    expertIcon: {\n      marginLeft: theme.spacing(0.5),\n      verticalAlign: 'middle',\n    },\n    meta: {\n      color: theme.palette.text.secondary,\n      textAlign: 'center',\n      margin: 0,\n    },\n  }),\n  { name: 'QetaAuthorBox' },\n);\n\nexport const AuthorBox = (props: {\n  userEntityRef: string;\n  time: string | Date;\n  label: string;\n  expert?: boolean;\n  anonymous?: boolean;\n  compact?: boolean;\n}) => {\n  const { userEntityRef, time, label, expert, anonymous, compact } = props;\n  const { name, initials, user } = useUserInfo(userEntityRef);\n  const styles = useStyles();\n\n  if (compact) {\n    return (\n      <Box className={`qetaAuthorBox ${styles.authorBoxCompact}`}>\n        <Avatar\n          src={user?.spec?.profile?.picture}\n          className={`qetaAuthorBoxAvatar ${styles.avatarCompact}`}\n          alt={name}\n          variant=\"rounded\"\n        >\n          {initials}\n        </Avatar>\n        <UserLink entityRef={userEntityRef} anonymous={anonymous} />\n        {expert && <ExpertIcon className={styles.expertIcon} />}\n        <Typography className=\"qetaAuthorBoxCreated\" variant=\"caption\">\n          <RelativeTimeWithTooltip value={time} />\n        </Typography>\n      </Box>\n    );\n  }\n\n  return (\n    <Box className={`qetaAuthorBox ${styles.authorBox}`}>\n      <Box className={styles.timeRow}>\n        <Typography className=\"qetaAuthorBoxCreated\" variant=\"caption\">\n          {label} <RelativeTimeWithTooltip value={time} />\n        </Typography>\n      </Box>\n      <Box className={styles.authorInfo}>\n        <Avatar\n          src={user?.spec?.profile?.picture}\n          className={`qetaAuthorBoxAvatar ${styles.avatar}`}\n          alt={name}\n          variant=\"rounded\"\n        >\n          {initials}\n        </Avatar>\n        <Box className={styles.authorLink}>\n          <UserLink entityRef={userEntityRef} anonymous={anonymous} />\n          {expert && <ExpertIcon className={styles.expertIcon} />}\n        </Box>\n      </Box>\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"AuthorBox.esm.js","sources":["../../../src/components/AuthorBox/AuthorBox.tsx"],"sourcesContent":["import { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip';\nimport { UserLink } from '../Links';\nimport { useUserInfo } from '../../hooks/useEntityAuthor';\nimport { Avatar, Box, makeStyles, Typography } from '@material-ui/core';\nimport { ExpertIcon } from '../Icons/ExpertIcon.tsx';\n\nconst useStyles = makeStyles(\n  theme => ({\n    authorBox: {\n      padding: theme.spacing(0, 1.5, 0, 0),\n      textAlign: 'right',\n      display: 'flex',\n      flexDirection: 'column',\n      gap: theme.spacing(0.5),\n      marginLeft: theme.spacing(2),\n      maxWidth: '200px',\n    },\n    authorBoxCompact: {\n      display: 'flex',\n      gap: theme.spacing(0.5),\n      alignItems: 'center',\n      marginBottom: '8px',\n      '& > *': {\n        fontSize: '12px',\n        display: 'inline-flex',\n        lineHeight: '16px',\n      },\n    },\n    timeRow: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'flex-end',\n    },\n    avatar: {\n      width: '20px',\n      height: '20px',\n    },\n    avatarCompact: {\n      width: '20px',\n      height: '20px',\n    },\n    authorInfo: {\n      textOverflow: 'ellipsis',\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      color: theme.palette.text.primary,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'flex-end',\n      gap: theme.spacing(0.5),\n    },\n    authorLink: {\n      textOverflow: 'ellipsis',\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      color: theme.palette.text.primary,\n    },\n    expertIcon: {\n      marginLeft: theme.spacing(0.5),\n      verticalAlign: 'middle',\n    },\n    meta: {\n      color: theme.palette.text.secondary,\n      textAlign: 'center',\n      margin: 0,\n    },\n  }),\n  { name: 'QetaAuthorBox' },\n);\n\nexport const AuthorBox = (props: {\n  userEntityRef: string;\n  time: string | Date;\n  label: string;\n  expert?: boolean;\n  anonymous?: boolean;\n  compact?: boolean;\n}) => {\n  const { userEntityRef, time, label, expert, anonymous, compact } = props;\n  const { name, initials, user } = useUserInfo(userEntityRef);\n  const styles = useStyles();\n\n  if (compact) {\n    return (\n      <Box className={`qetaAuthorBox ${styles.authorBoxCompact}`}>\n        <Avatar\n          src={user?.spec?.profile?.picture}\n          className={`qetaAuthorBoxAvatar ${styles.avatarCompact}`}\n          alt={name}\n          variant=\"rounded\"\n        >\n          {initials}\n        </Avatar>\n        <Typography variant=\"body2\" component=\"span\">\n          <UserLink entityRef={userEntityRef} anonymous={anonymous} />\n        </Typography>\n        {expert && <ExpertIcon className={styles.expertIcon} />}\n        <Typography className=\"qetaAuthorBoxCreated\" variant=\"caption\">\n          <RelativeTimeWithTooltip value={time} />\n        </Typography>\n      </Box>\n    );\n  }\n\n  return (\n    <Box className={`qetaAuthorBox ${styles.authorBox}`}>\n      <Box className={styles.timeRow}>\n        <Typography className=\"qetaAuthorBoxCreated\" variant=\"caption\">\n          {label} <RelativeTimeWithTooltip value={time} />\n        </Typography>\n      </Box>\n      <Box className={styles.authorInfo}>\n        <Avatar\n          src={user?.spec?.profile?.picture}\n          className={`qetaAuthorBoxAvatar ${styles.avatar}`}\n          alt={name}\n          variant=\"rounded\"\n        >\n          {initials}\n        </Avatar>\n        <Box className={styles.authorLink}>\n          <UserLink entityRef={userEntityRef} anonymous={anonymous} />\n          {expert && <ExpertIcon className={styles.expertIcon} />}\n        </Box>\n      </Box>\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

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

@@ -1,6 +1,6 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
-import { Button, Dialog, DialogTitle, DialogContent, Grid, DialogActions } from '@material-ui/core';
+import { Dialog, DialogTitle, DialogContent, Grid, Button, DialogActions } from '@material-ui/core';
 import AddCircle from '@material-ui/icons/AddCircle';
 import RemoveCircle from '@material-ui/icons/RemoveCircle';
 import PlayListAddIcon from '@material-ui/icons/PlaylistAdd';
@@ -16,6 +16,7 @@ import 'react-use/lib/useAsync';
 import '@backstage/plugin-permission-react';
 import '@drodil/backstage-plugin-qeta-common';
 import '@backstage/plugin-permission-common';
+import { ContentHeaderButton } from './ContentHeaderButton.esm.js';
 
 const AddToCollectionButton = (props) => {
   const { post } = props;
@@ -81,16 +82,7 @@ const AddToCollectionButton = (props) => {
     return null;
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "contained",
-        size: "small",
-        onClick: handleClickOpen,
-        startIcon: /* @__PURE__ */ jsx(PlayListAddIcon, {}),
-        children: t("addToCollectionButton.title")
-      }
-    ),
+    /* @__PURE__ */ jsx(ContentHeaderButton, { onClick: handleClickOpen, icon: /* @__PURE__ */ jsx(PlayListAddIcon, {}), children: t("addToCollectionButton.title") }),
     /* @__PURE__ */ jsxs(Dialog, { open, onClose: handleClose, fullWidth: true, children: [
       /* @__PURE__ */ jsx(DialogTitle, { children: t("addToCollectionButton.manage") }),
       /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsx(Grid, { container: true, children: collections.map((collection) => {

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';\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      <Button\n        variant=\"contained\"\n        size=\"small\"\n        onClick={handleClickOpen}\n        startIcon={<PlayListAddIcon />}\n      >\n        {t('addToCollectionButton.title')}\n      </Button>\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/AskQuestionButton.esm.js

@@ -1,13 +1,12 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
 import HelpOutline from '@material-ui/icons/HelpOutline';
 import { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';
-import { LinkButton } from '@backstage/core-components';
 import { useRouteRef } from '@backstage/core-plugin-api';
 import { askRouteRef } from '../../routes.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { qetaTranslationRef } from '../../translation.esm.js';
-import { Box } from '@material-ui/core';
 import { OptionalRequirePermission } from '../Utility/OptionalRequirePermission.esm.js';
+import { ContentHeaderButton } from './ContentHeaderButton.esm.js';
 
 const AskQuestionButton = (props) => {
   const { entity, entityPage, tags } = props;
@@ -28,17 +27,15 @@ const AskQuestionButton = (props) => {
     {
       permission: qetaCreatePostPermission,
       errorPage: /* @__PURE__ */ jsx(Fragment, {}),
-      children: /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
-        LinkButton,
+      children: /* @__PURE__ */ jsx(
+        ContentHeaderButton,
         {
-          variant: "contained",
-          size: "small",
           to: entity || tags ? `${askRoute()}?${params.toString()}` : askRoute(),
           color: "primary",
-          startIcon: /* @__PURE__ */ jsx(HelpOutline, {}),
+          icon: /* @__PURE__ */ jsx(HelpOutline, {}),
           children: t("askQuestionButton.title")
         }
-      ) })
+      )
     }
   );
 };

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

@@ -1 +1 @@
-{"version":3,"file":"AskQuestionButton.esm.js","sources":["../../../src/components/Buttons/AskQuestionButton.tsx"],"sourcesContent":["import HelpOutline from '@material-ui/icons/HelpOutline';\nimport { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';\nimport { LinkButton } from '@backstage/core-components';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { askRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { Box } from '@material-ui/core';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\n\nexport const AskQuestionButton = (props: {\n  entity?: string;\n  tags?: string[];\n  entityPage?: boolean;\n}) => {\n  const { entity, entityPage, tags } = props;\n  const askRoute = useRouteRef(askRouteRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const params = new URLSearchParams();\n  if (entity) {\n    params.set('entity', entity);\n  }\n  if (entityPage) {\n    params.set('entityPage', 'true');\n  }\n  if (tags && tags.length > 0) {\n    params.set('tags', tags.join(','));\n  }\n\n  return (\n    <OptionalRequirePermission\n      permission={qetaCreatePostPermission}\n      errorPage={<></>}\n    >\n      <Box>\n        <LinkButton\n          variant=\"contained\"\n          size=\"small\"\n          to={\n            entity || tags ? `${askRoute()}?${params.toString()}` : askRoute()\n          }\n          color=\"primary\"\n          startIcon={<HelpOutline />}\n        >\n          {t('askQuestionButton.title')}\n        </LinkButton>\n      </Box>\n    </OptionalRequirePermission>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAUa,MAAA,iBAAA,GAAoB,CAAC,KAI5B,KAAA;AACJ,EAAA,MAAM,EAAE,MAAA,EAAQ,UAAY,EAAA,IAAA,EAAS,GAAA,KAAA;AACrC,EAAM,MAAA,QAAA,GAAW,YAAY,WAAW,CAAA;AACxC,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAM,MAAA,MAAA,GAAS,IAAI,eAAgB,EAAA;AACnC,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,GAAA,CAAI,UAAU,MAAM,CAAA;AAAA;AAE7B,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,MAAA,CAAA,GAAA,CAAI,cAAc,MAAM,CAAA;AAAA;AAEjC,EAAI,IAAA,IAAA,IAAQ,IAAK,CAAA,MAAA,GAAS,CAAG,EAAA;AAC3B,IAAA,MAAA,CAAO,GAAI,CAAA,MAAA,EAAQ,IAAK,CAAA,IAAA,CAAK,GAAG,CAAC,CAAA;AAAA;AAGnC,EACE,uBAAA,GAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,wBAAA;AAAA,MACZ,2BAAa,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AAAA,MAEb,8BAAC,GACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,IAAK,EAAA,OAAA;AAAA,UACL,EAAA,EACE,MAAU,IAAA,IAAA,GAAO,CAAG,EAAA,QAAA,EAAU,CAAA,CAAA,EAAI,MAAO,CAAA,QAAA,EAAU,CAAA,CAAA,GAAK,QAAS,EAAA;AAAA,UAEnE,KAAM,EAAA,SAAA;AAAA,UACN,SAAA,sBAAY,WAAY,EAAA,EAAA,CAAA;AAAA,UAEvB,YAAE,yBAAyB;AAAA;AAAA,OAEhC,EAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"AskQuestionButton.esm.js","sources":["../../../src/components/Buttons/AskQuestionButton.tsx"],"sourcesContent":["import HelpOutline from '@material-ui/icons/HelpOutline';\nimport { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { askRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\nimport { ContentHeaderButton } from './ContentHeaderButton';\n\nexport const AskQuestionButton = (props: {\n  entity?: string;\n  tags?: string[];\n  entityPage?: boolean;\n}) => {\n  const { entity, entityPage, tags } = props;\n  const askRoute = useRouteRef(askRouteRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const params = new URLSearchParams();\n  if (entity) {\n    params.set('entity', entity);\n  }\n  if (entityPage) {\n    params.set('entityPage', 'true');\n  }\n  if (tags && tags.length > 0) {\n    params.set('tags', tags.join(','));\n  }\n\n  return (\n    <OptionalRequirePermission\n      permission={qetaCreatePostPermission}\n      errorPage={<></>}\n    >\n      <ContentHeaderButton\n        to={entity || tags ? `${askRoute()}?${params.toString()}` : askRoute()}\n        color=\"primary\"\n        icon={<HelpOutline />}\n      >\n        {t('askQuestionButton.title')}\n      </ContentHeaderButton>\n    </OptionalRequirePermission>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AASa,MAAA,iBAAA,GAAoB,CAAC,KAI5B,KAAA;AACJ,EAAA,MAAM,EAAE,MAAA,EAAQ,UAAY,EAAA,IAAA,EAAS,GAAA,KAAA;AACrC,EAAM,MAAA,QAAA,GAAW,YAAY,WAAW,CAAA;AACxC,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAM,MAAA,MAAA,GAAS,IAAI,eAAgB,EAAA;AACnC,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,GAAA,CAAI,UAAU,MAAM,CAAA;AAAA;AAE7B,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,MAAA,CAAA,GAAA,CAAI,cAAc,MAAM,CAAA;AAAA;AAEjC,EAAI,IAAA,IAAA,IAAQ,IAAK,CAAA,MAAA,GAAS,CAAG,EAAA;AAC3B,IAAA,MAAA,CAAO,GAAI,CAAA,MAAA,EAAQ,IAAK,CAAA,IAAA,CAAK,GAAG,CAAC,CAAA;AAAA;AAGnC,EACE,uBAAA,GAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,wBAAA;AAAA,MACZ,2BAAa,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AAAA,MAEb,QAAA,kBAAA,GAAA;AAAA,QAAC,mBAAA;AAAA,QAAA;AAAA,UACC,EAAA,EAAI,MAAU,IAAA,IAAA,GAAO,CAAG,EAAA,QAAA,EAAU,CAAA,CAAA,EAAI,MAAO,CAAA,QAAA,EAAU,CAAA,CAAA,GAAK,QAAS,EAAA;AAAA,UACrE,KAAM,EAAA,SAAA;AAAA,UACN,IAAA,sBAAO,WAAY,EAAA,EAAA,CAAA;AAAA,UAElB,YAAE,yBAAyB;AAAA;AAAA;AAC9B;AAAA,GACF;AAEJ;;;;"}

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

@@ -6,10 +6,8 @@ const useStyles = makeStyles(
     root: {
       display: "flex",
       alignItems: "center",
-      paddingTop: "0.5em",
-      "& *:not(:last-child)": {
-        marginRight: "0.3em"
-      }
+      justifyContent: "flex-end",
+      gap: "8px"
     }
   }),
   { name: "ContentHeaderButtons" }

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

@@ -1 +1 @@
-{"version":3,"file":"ButtonContainer.esm.js","sources":["../../../src/components/Buttons/ButtonContainer.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles(\n  () => ({\n    root: {\n      display: 'flex',\n      alignItems: 'center',\n      paddingTop: '0.5em',\n      '& *:not(:last-child)': {\n        marginRight: '0.3em',\n      },\n    },\n  }),\n  { name: 'ContentHeaderButtons' },\n);\n\nexport const ButtonContainer = (props: { children: ReactNode }) => {\n  const styles = useStyles();\n  return <div className={styles.root}>{props.children}</div>;\n};\n"],"names":[],"mappings":";;;AAGA,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB,OAAO;AAAA,IACL,IAAM,EAAA;AAAA,MACJ,OAAS,EAAA,MAAA;AAAA,MACT,UAAY,EAAA,QAAA;AAAA,MACZ,UAAY,EAAA,OAAA;AAAA,MACZ,sBAAwB,EAAA;AAAA,QACtB,WAAa,EAAA;AAAA;AACf;AACF,GACF,CAAA;AAAA,EACA,EAAE,MAAM,sBAAuB;AACjC,CAAA;AAEa,MAAA,eAAA,GAAkB,CAAC,KAAmC,KAAA;AACjE,EAAA,MAAM,SAAS,SAAU,EAAA;AACzB,EAAA,2BAAQ,KAAI,EAAA,EAAA,SAAA,EAAW,MAAO,CAAA,IAAA,EAAO,gBAAM,QAAS,EAAA,CAAA;AACtD;;;;"}
+{"version":3,"file":"ButtonContainer.esm.js","sources":["../../../src/components/Buttons/ButtonContainer.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles(\n  () => ({\n    root: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'flex-end',\n      gap: '8px',\n    },\n  }),\n  { name: 'ContentHeaderButtons' },\n);\n\nexport const ButtonContainer = (props: { children: ReactNode }) => {\n  const styles = useStyles();\n  return <div className={styles.root}>{props.children}</div>;\n};\n"],"names":[],"mappings":";;;AAGA,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB,OAAO;AAAA,IACL,IAAM,EAAA;AAAA,MACJ,OAAS,EAAA,MAAA;AAAA,MACT,UAAY,EAAA,QAAA;AAAA,MACZ,cAAgB,EAAA,UAAA;AAAA,MAChB,GAAK,EAAA;AAAA;AACP,GACF,CAAA;AAAA,EACA,EAAE,MAAM,sBAAuB;AACjC,CAAA;AAEa,MAAA,eAAA,GAAkB,CAAC,KAAmC,KAAA;AACjE,EAAA,MAAM,SAAS,SAAU,EAAA;AACzB,EAAA,2BAAQ,KAAI,EAAA,EAAA,SAAA,EAAW,MAAO,CAAA,IAAA,EAAO,gBAAM,QAAS,EAAA,CAAA;AACtD;;;;"}

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

@@ -0,0 +1,27 @@
+import { jsx } from 'react/jsx-runtime';
+import { LinkButton } from '@backstage/core-components';
+import { useTheme, useMediaQuery, Button } from '@material-ui/core';
+
+const ContentHeaderButton = (props) => {
+  const { to, onClick, icon, children, color = "primary", disabled } = props;
+  const theme = useTheme();
+  const isSmallScreen = useMediaQuery(theme.breakpoints.down("md"));
+  const commonProps = {
+    size: "small",
+    variant: "contained",
+    color,
+    startIcon: isSmallScreen ? void 0 : icon,
+    style: {
+      minWidth: isSmallScreen ? "0" : void 0,
+      padding: isSmallScreen ? "6px" : void 0
+    },
+    disabled
+  };
+  if (to) {
+    return /* @__PURE__ */ jsx(LinkButton, { ...commonProps, to, children: isSmallScreen ? icon : children });
+  }
+  return /* @__PURE__ */ jsx(Button, { ...commonProps, onClick, children: isSmallScreen ? icon : children });
+};
+
+export { ContentHeaderButton };
+//# sourceMappingURL=ContentHeaderButton.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ContentHeaderButton.esm.js","sources":["../../../src/components/Buttons/ContentHeaderButton.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport { LinkButton } from '@backstage/core-components';\nimport { useTheme, useMediaQuery, Button } from '@material-ui/core';\n\ninterface ContentHeaderButtonProps {\n  to?: string;\n  onClick?: () => void;\n  icon: ReactNode;\n  children: ReactNode;\n  color?: 'primary' | 'secondary' | 'default';\n  disabled?: boolean;\n}\n\nexport const ContentHeaderButton = (props: ContentHeaderButtonProps) => {\n  const { to, onClick, icon, children, color = 'primary', disabled } = props;\n  const theme = useTheme();\n  const isSmallScreen = useMediaQuery(theme.breakpoints.down('md'));\n\n  const commonProps = {\n    size: 'small' as const,\n    variant: 'contained' as const,\n    color,\n    startIcon: isSmallScreen ? undefined : icon,\n    style: {\n      minWidth: isSmallScreen ? '0' : undefined,\n      padding: isSmallScreen ? '6px' : undefined,\n    },\n    disabled,\n  };\n\n  if (to) {\n    return (\n      <LinkButton {...commonProps} to={to}>\n        {isSmallScreen ? icon : children}\n      </LinkButton>\n    );\n  }\n\n  return (\n    <Button {...commonProps} onClick={onClick}>\n      {isSmallScreen ? icon : children}\n    </Button>\n  );\n};\n"],"names":[],"mappings":";;;;AAaa,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAM,MAAA,EAAE,IAAI,OAAS,EAAA,IAAA,EAAM,UAAU,KAAQ,GAAA,SAAA,EAAW,UAAa,GAAA,KAAA;AACrE,EAAA,MAAM,QAAQ,QAAS,EAAA;AACvB,EAAA,MAAM,gBAAgB,aAAc,CAAA,KAAA,CAAM,WAAY,CAAA,IAAA,CAAK,IAAI,CAAC,CAAA;AAEhE,EAAA,MAAM,WAAc,GAAA;AAAA,IAClB,IAAM,EAAA,OAAA;AAAA,IACN,OAAS,EAAA,WAAA;AAAA,IACT,KAAA;AAAA,IACA,SAAA,EAAW,gBAAgB,KAAY,CAAA,GAAA,IAAA;AAAA,IACvC,KAAO,EAAA;AAAA,MACL,QAAA,EAAU,gBAAgB,GAAM,GAAA,KAAA,CAAA;AAAA,MAChC,OAAA,EAAS,gBAAgB,KAAQ,GAAA,KAAA;AAAA,KACnC;AAAA,IACA;AAAA,GACF;AAEA,EAAA,IAAI,EAAI,EAAA;AACN,IAAA,2BACG,UAAY,EAAA,EAAA,GAAG,aAAa,EAC1B,EAAA,QAAA,EAAA,aAAA,GAAgB,OAAO,QAC1B,EAAA,CAAA;AAAA;AAIJ,EAAA,2BACG,MAAQ,EAAA,EAAA,GAAG,aAAa,OACtB,EAAA,QAAA,EAAA,aAAA,GAAgB,OAAO,QAC1B,EAAA,CAAA;AAEJ;;;;"}

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

@@ -1,12 +1,12 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
 import PlayListAddIcon from '@material-ui/icons/PlaylistAdd';
 import { qetaCreateCollectionPermission } from '@drodil/backstage-plugin-qeta-common';
-import { LinkButton } from '@backstage/core-components';
 import { useRouteRef } from '@backstage/core-plugin-api';
 import { collectionCreateRouteRef } from '../../routes.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { qetaTranslationRef } from '../../translation.esm.js';
 import { OptionalRequirePermission } from '../Utility/OptionalRequirePermission.esm.js';
+import { ContentHeaderButton } from './ContentHeaderButton.esm.js';
 
 const CreateCollectionButton = () => {
   const createRoute = useRouteRef(collectionCreateRouteRef);
@@ -17,13 +17,11 @@ const CreateCollectionButton = () => {
       permission: qetaCreateCollectionPermission,
       errorPage: /* @__PURE__ */ jsx(Fragment, {}),
       children: /* @__PURE__ */ jsx(
-        LinkButton,
+        ContentHeaderButton,
         {
-          size: "small",
-          variant: "contained",
           to: createRoute(),
           color: "primary",
-          startIcon: /* @__PURE__ */ jsx(PlayListAddIcon, {}),
+          icon: /* @__PURE__ */ jsx(PlayListAddIcon, {}),
           children: t("createCollectionButton.title")
         }
       )

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

@@ -1 +1 @@
-{"version":3,"file":"CreateCollectionButton.esm.js","sources":["../../../src/components/Buttons/CreateCollectionButton.tsx"],"sourcesContent":["import PlayListAddIcon from '@material-ui/icons/PlaylistAdd';\nimport { qetaCreateCollectionPermission } from '@drodil/backstage-plugin-qeta-common';\nimport { LinkButton } from '@backstage/core-components';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { collectionCreateRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\n\nexport const CreateCollectionButton = () => {\n  const createRoute = useRouteRef(collectionCreateRouteRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  return (\n    <OptionalRequirePermission\n      permission={qetaCreateCollectionPermission}\n      errorPage={<></>}\n    >\n      <LinkButton\n        size=\"small\"\n        variant=\"contained\"\n        to={createRoute()}\n        color=\"primary\"\n        startIcon={<PlayListAddIcon />}\n      >\n        {t('createCollectionButton.title')}\n      </LinkButton>\n    </OptionalRequirePermission>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AASO,MAAM,yBAAyB,MAAM;AAC1C,EAAM,MAAA,WAAA,GAAc,YAAY,wBAAwB,CAAA;AACxD,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EACE,uBAAA,GAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,8BAAA;AAAA,MACZ,2BAAa,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AAAA,MAEb,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,IAAK,EAAA,OAAA;AAAA,UACL,OAAQ,EAAA,WAAA;AAAA,UACR,IAAI,WAAY,EAAA;AAAA,UAChB,KAAM,EAAA,SAAA;AAAA,UACN,SAAA,sBAAY,eAAgB,EAAA,EAAA,CAAA;AAAA,UAE3B,YAAE,8BAA8B;AAAA;AAAA;AACnC;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"CreateCollectionButton.esm.js","sources":["../../../src/components/Buttons/CreateCollectionButton.tsx"],"sourcesContent":["import PlayListAddIcon from '@material-ui/icons/PlaylistAdd';\nimport { qetaCreateCollectionPermission } from '@drodil/backstage-plugin-qeta-common';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { collectionCreateRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\nimport { ContentHeaderButton } from './ContentHeaderButton';\n\nexport const CreateCollectionButton = () => {\n  const createRoute = useRouteRef(collectionCreateRouteRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  return (\n    <OptionalRequirePermission\n      permission={qetaCreateCollectionPermission}\n      errorPage={<></>}\n    >\n      <ContentHeaderButton\n        to={createRoute()}\n        color=\"primary\"\n        icon={<PlayListAddIcon />}\n      >\n        {t('createCollectionButton.title')}\n      </ContentHeaderButton>\n    </OptionalRequirePermission>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AASO,MAAM,yBAAyB,MAAM;AAC1C,EAAM,MAAA,WAAA,GAAc,YAAY,wBAAwB,CAAA;AACxD,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EACE,uBAAA,GAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,8BAAA;AAAA,MACZ,2BAAa,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AAAA,MAEb,QAAA,kBAAA,GAAA;AAAA,QAAC,mBAAA;AAAA,QAAA;AAAA,UACC,IAAI,WAAY,EAAA;AAAA,UAChB,KAAM,EAAA,SAAA;AAAA,UACN,IAAA,sBAAO,eAAgB,EAAA,EAAA,CAAA;AAAA,UAEtB,YAAE,8BAA8B;AAAA;AAAA;AACnC;AAAA,GACF;AAEJ;;;;"}

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

@@ -1,13 +1,12 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
 import LinkIcon from '@material-ui/icons/Link';
 import { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';
-import { LinkButton } from '@backstage/core-components';
 import { useRouteRef } from '@backstage/core-plugin-api';
 import { createLinkRouteRef } from '../../routes.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { qetaTranslationRef } from '../../translation.esm.js';
-import { Box } from '@material-ui/core';
 import { OptionalRequirePermission } from '../Utility/OptionalRequirePermission.esm.js';
+import { ContentHeaderButton } from './ContentHeaderButton.esm.js';
 
 const CreateLinkButton = (props) => {
   const { entity, entityPage, tags } = props;
@@ -28,17 +27,15 @@ const CreateLinkButton = (props) => {
     {
       permission: qetaCreatePostPermission,
       errorPage: /* @__PURE__ */ jsx(Fragment, {}),
-      children: /* @__PURE__ */ jsx(Box, { sx: { marginLeft: 2 }, children: /* @__PURE__ */ jsx(
-        LinkButton,
+      children: /* @__PURE__ */ jsx(
+        ContentHeaderButton,
         {
-          size: "small",
-          variant: "contained",
           to: entity || tags ? `${linkRoute()}?${params.toString()}` : linkRoute(),
           color: "primary",
-          startIcon: /* @__PURE__ */ jsx(LinkIcon, {}),
+          icon: /* @__PURE__ */ jsx(LinkIcon, {}),
           children: t("createLinkButton.title")
         }
-      ) })
+      )
     }
   );
 };

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

@@ -1 +1 @@
-{"version":3,"file":"CreateLinkButton.esm.js","sources":["../../../src/components/Buttons/CreateLinkButton.tsx"],"sourcesContent":["import LinkIcon from '@material-ui/icons/Link';\nimport { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';\nimport { LinkButton } from '@backstage/core-components';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { createLinkRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { Box } from '@material-ui/core';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\n\nexport const CreateLinkButton = (props: {\n  entity?: string;\n  tags?: string[];\n  entityPage?: boolean;\n}) => {\n  const { entity, entityPage, tags } = props;\n  const linkRoute = useRouteRef(createLinkRouteRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const params = new URLSearchParams();\n  if (entity) {\n    params.set('entity', entity);\n  }\n  if (entityPage) {\n    params.set('entityPage', 'true');\n  }\n  if (tags && tags.length > 0) {\n    params.set('tags', tags.join(','));\n  }\n\n  return (\n    <OptionalRequirePermission\n      permission={qetaCreatePostPermission}\n      errorPage={<></>}\n    >\n      <Box sx={{ marginLeft: 2 }}>\n        <LinkButton\n          size=\"small\"\n          variant=\"contained\"\n          to={\n            entity || tags ? `${linkRoute()}?${params.toString()}` : linkRoute()\n          }\n          color=\"primary\"\n          startIcon={<LinkIcon />}\n        >\n          {t('createLinkButton.title')}\n        </LinkButton>\n      </Box>\n    </OptionalRequirePermission>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAUa,MAAA,gBAAA,GAAmB,CAAC,KAI3B,KAAA;AACJ,EAAA,MAAM,EAAE,MAAA,EAAQ,UAAY,EAAA,IAAA,EAAS,GAAA,KAAA;AACrC,EAAM,MAAA,SAAA,GAAY,YAAY,kBAAkB,CAAA;AAChD,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAM,MAAA,MAAA,GAAS,IAAI,eAAgB,EAAA;AACnC,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,GAAA,CAAI,UAAU,MAAM,CAAA;AAAA;AAE7B,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,MAAA,CAAA,GAAA,CAAI,cAAc,MAAM,CAAA;AAAA;AAEjC,EAAI,IAAA,IAAA,IAAQ,IAAK,CAAA,MAAA,GAAS,CAAG,EAAA;AAC3B,IAAA,MAAA,CAAO,GAAI,CAAA,MAAA,EAAQ,IAAK,CAAA,IAAA,CAAK,GAAG,CAAC,CAAA;AAAA;AAGnC,EACE,uBAAA,GAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,wBAAA;AAAA,MACZ,2BAAa,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AAAA,MAEb,8BAAC,GAAI,EAAA,EAAA,EAAA,EAAI,EAAE,UAAA,EAAY,GACrB,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,IAAK,EAAA,OAAA;AAAA,UACL,OAAQ,EAAA,WAAA;AAAA,UACR,EAAA,EACE,MAAU,IAAA,IAAA,GAAO,CAAG,EAAA,SAAA,EAAW,CAAA,CAAA,EAAI,MAAO,CAAA,QAAA,EAAU,CAAA,CAAA,GAAK,SAAU,EAAA;AAAA,UAErE,KAAM,EAAA,SAAA;AAAA,UACN,SAAA,sBAAY,QAAS,EAAA,EAAA,CAAA;AAAA,UAEpB,YAAE,wBAAwB;AAAA;AAAA,OAE/B,EAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"CreateLinkButton.esm.js","sources":["../../../src/components/Buttons/CreateLinkButton.tsx"],"sourcesContent":["import LinkIcon from '@material-ui/icons/Link';\nimport { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { createLinkRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\nimport { ContentHeaderButton } from './ContentHeaderButton';\n\nexport const CreateLinkButton = (props: {\n  entity?: string;\n  tags?: string[];\n  entityPage?: boolean;\n}) => {\n  const { entity, entityPage, tags } = props;\n  const linkRoute = useRouteRef(createLinkRouteRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const params = new URLSearchParams();\n  if (entity) {\n    params.set('entity', entity);\n  }\n  if (entityPage) {\n    params.set('entityPage', 'true');\n  }\n  if (tags && tags.length > 0) {\n    params.set('tags', tags.join(','));\n  }\n\n  return (\n    <OptionalRequirePermission\n      permission={qetaCreatePostPermission}\n      errorPage={<></>}\n    >\n      <ContentHeaderButton\n        to={\n          entity || tags ? `${linkRoute()}?${params.toString()}` : linkRoute()\n        }\n        color=\"primary\"\n        icon={<LinkIcon />}\n      >\n        {t('createLinkButton.title')}\n      </ContentHeaderButton>\n    </OptionalRequirePermission>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AASa,MAAA,gBAAA,GAAmB,CAAC,KAI3B,KAAA;AACJ,EAAA,MAAM,EAAE,MAAA,EAAQ,UAAY,EAAA,IAAA,EAAS,GAAA,KAAA;AACrC,EAAM,MAAA,SAAA,GAAY,YAAY,kBAAkB,CAAA;AAChD,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAM,MAAA,MAAA,GAAS,IAAI,eAAgB,EAAA;AACnC,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,GAAA,CAAI,UAAU,MAAM,CAAA;AAAA;AAE7B,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,MAAA,CAAA,GAAA,CAAI,cAAc,MAAM,CAAA;AAAA;AAEjC,EAAI,IAAA,IAAA,IAAQ,IAAK,CAAA,MAAA,GAAS,CAAG,EAAA;AAC3B,IAAA,MAAA,CAAO,GAAI,CAAA,MAAA,EAAQ,IAAK,CAAA,IAAA,CAAK,GAAG,CAAC,CAAA;AAAA;AAGnC,EACE,uBAAA,GAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,wBAAA;AAAA,MACZ,2BAAa,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AAAA,MAEb,QAAA,kBAAA,GAAA;AAAA,QAAC,mBAAA;AAAA,QAAA;AAAA,UACC,EAAA,EACE,MAAU,IAAA,IAAA,GAAO,CAAG,EAAA,SAAA,EAAW,CAAA,CAAA,EAAI,MAAO,CAAA,QAAA,EAAU,CAAA,CAAA,GAAK,SAAU,EAAA;AAAA,UAErE,KAAM,EAAA,SAAA;AAAA,UACN,IAAA,sBAAO,QAAS,EAAA,EAAA,CAAA;AAAA,UAEf,YAAE,wBAAwB;AAAA;AAAA;AAC7B;AAAA,GACF;AAEJ;;;;"}

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

@@ -7,7 +7,7 @@ import { qetaApiRef } from '../../api.esm.js';
 import { useApi } from '@backstage/core-plugin-api';
 
 const OpenLinkButton = (props) => {
-  const { entity } = props;
+  const { entity, className, style } = props;
   const qetaApi = useApi(qetaApiRef);
   const { t } = useTranslationRef(qetaTranslationRef);
   const handleClick = (event) => {
@@ -24,6 +24,8 @@ const OpenLinkButton = (props) => {
       "aria-label": t("link.open"),
       size: "small",
       onClick: handleClick,
+      className,
+      style,
       children: /* @__PURE__ */ jsx(OpenLinkIcon, {})
     }
   ) });

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

@@ -1 +1 @@
-{"version":3,"file":"OpenLinkButton.esm.js","sources":["../../../src/components/Buttons/OpenLinkButton.tsx"],"sourcesContent":["import { PostResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { IconButton, Tooltip } from '@material-ui/core';\nimport OpenLinkIcon from '@material-ui/icons/OpenInNew';\nimport { qetaApiRef } from '../../api.ts';\nimport { useApi } from '@backstage/core-plugin-api';\n\nexport const OpenLinkButton = (props: { entity: PostResponse }) => {\n  const { entity } = props;\n  const qetaApi = useApi(qetaApiRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const handleClick = (\n    event: React.MouseEvent<HTMLAnchorElement, MouseEvent>,\n  ) => {\n    event.stopPropagation();\n    qetaApi.clickLink(entity.id);\n  };\n\n  return (\n    <Tooltip title={t('link.open')}>\n      <IconButton\n        component=\"a\"\n        href={entity.url}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        aria-label={t('link.open')}\n        size=\"small\"\n        onClick={handleClick}\n      >\n        <OpenLinkIcon />\n      </IconButton>\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAQa,MAAA,cAAA,GAAiB,CAAC,KAAoC,KAAA;AACjE,EAAM,MAAA,EAAE,QAAW,GAAA,KAAA;AACnB,EAAM,MAAA,OAAA,GAAU,OAAO,UAAU,CAAA;AACjC,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAM,MAAA,WAAA,GAAc,CAClB,KACG,KAAA;AACH,IAAA,KAAA,CAAM,eAAgB,EAAA;AACtB,IAAQ,OAAA,CAAA,SAAA,CAAU,OAAO,EAAE,CAAA;AAAA,GAC7B;AAEA,EAAA,uBACG,GAAA,CAAA,OAAA,EAAA,EAAQ,KAAO,EAAA,CAAA,CAAE,WAAW,CAC3B,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,GAAA;AAAA,MACV,MAAM,MAAO,CAAA,GAAA;AAAA,MACb,MAAO,EAAA,QAAA;AAAA,MACP,GAAI,EAAA,qBAAA;AAAA,MACJ,YAAA,EAAY,EAAE,WAAW,CAAA;AAAA,MACzB,IAAK,EAAA,OAAA;AAAA,MACL,OAAS,EAAA,WAAA;AAAA,MAET,8BAAC,YAAa,EAAA,EAAA;AAAA;AAAA,GAElB,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"OpenLinkButton.esm.js","sources":["../../../src/components/Buttons/OpenLinkButton.tsx"],"sourcesContent":["import { PostResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { IconButton, Tooltip } from '@material-ui/core';\nimport OpenLinkIcon from '@material-ui/icons/OpenInNew';\nimport { qetaApiRef } from '../../api.ts';\nimport { useApi } from '@backstage/core-plugin-api';\n\nexport const OpenLinkButton = (props: {\n  entity: PostResponse;\n  className?: string;\n  style?: React.CSSProperties;\n}) => {\n  const { entity, className, style } = props;\n  const qetaApi = useApi(qetaApiRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const handleClick = (\n    event: React.MouseEvent<HTMLAnchorElement, MouseEvent>,\n  ) => {\n    event.stopPropagation();\n    qetaApi.clickLink(entity.id);\n  };\n\n  return (\n    <Tooltip title={t('link.open')}>\n      <IconButton\n        component=\"a\"\n        href={entity.url}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        aria-label={t('link.open')}\n        size=\"small\"\n        onClick={handleClick}\n        className={className}\n        style={style}\n      >\n        <OpenLinkIcon />\n      </IconButton>\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAQa,MAAA,cAAA,GAAiB,CAAC,KAIzB,KAAA;AACJ,EAAA,MAAM,EAAE,MAAA,EAAQ,SAAW,EAAA,KAAA,EAAU,GAAA,KAAA;AACrC,EAAM,MAAA,OAAA,GAAU,OAAO,UAAU,CAAA;AACjC,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAM,MAAA,WAAA,GAAc,CAClB,KACG,KAAA;AACH,IAAA,KAAA,CAAM,eAAgB,EAAA;AACtB,IAAQ,OAAA,CAAA,SAAA,CAAU,OAAO,EAAE,CAAA;AAAA,GAC7B;AAEA,EAAA,uBACG,GAAA,CAAA,OAAA,EAAA,EAAQ,KAAO,EAAA,CAAA,CAAE,WAAW,CAC3B,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,GAAA;AAAA,MACV,MAAM,MAAO,CAAA,GAAA;AAAA,MACb,MAAO,EAAA,QAAA;AAAA,MACP,GAAI,EAAA,qBAAA;AAAA,MACJ,YAAA,EAAY,EAAE,WAAW,CAAA;AAAA,MACzB,IAAK,EAAA,OAAA;AAAA,MACL,OAAS,EAAA,WAAA;AAAA,MACT,SAAA;AAAA,MACA,KAAA;AAAA,MAEA,8BAAC,YAAa,EAAA,EAAA;AAAA;AAAA,GAElB,EAAA,CAAA;AAEJ;;;;"}

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

@@ -1,13 +1,12 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
 import CreateIcon from '@material-ui/icons/Create';
 import { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';
-import { LinkButton } from '@backstage/core-components';
 import { useRouteRef } from '@backstage/core-plugin-api';
 import { writeRouteRef } from '../../routes.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { qetaTranslationRef } from '../../translation.esm.js';
-import { Box } from '@material-ui/core';
 import { OptionalRequirePermission } from '../Utility/OptionalRequirePermission.esm.js';
+import { ContentHeaderButton } from './ContentHeaderButton.esm.js';
 
 const WriteArticleButton = (props) => {
   const { entity, entityPage, tags } = props;
@@ -28,17 +27,15 @@ const WriteArticleButton = (props) => {
     {
       permission: qetaCreatePostPermission,
       errorPage: /* @__PURE__ */ jsx(Fragment, {}),
-      children: /* @__PURE__ */ jsx(Box, { sx: { marginLeft: 2 }, children: /* @__PURE__ */ jsx(
-        LinkButton,
+      children: /* @__PURE__ */ jsx(
+        ContentHeaderButton,
         {
-          size: "small",
-          variant: "contained",
           to: entity || tags ? `${writeRoute()}?${params.toString()}` : writeRoute(),
           color: "primary",
-          startIcon: /* @__PURE__ */ jsx(CreateIcon, {}),
+          icon: /* @__PURE__ */ jsx(CreateIcon, {}),
           children: t("writeArticleButton.title")
         }
-      ) })
+      )
     }
   );
 };

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

@@ -1 +1 @@
-{"version":3,"file":"WriteArticleButton.esm.js","sources":["../../../src/components/Buttons/WriteArticleButton.tsx"],"sourcesContent":["import CreateIcon from '@material-ui/icons/Create';\nimport { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';\nimport { LinkButton } from '@backstage/core-components';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { writeRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { Box } from '@material-ui/core';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\n\nexport const WriteArticleButton = (props: {\n  entity?: string;\n  tags?: string[];\n  entityPage?: boolean;\n}) => {\n  const { entity, entityPage, tags } = props;\n  const writeRoute = useRouteRef(writeRouteRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const params = new URLSearchParams();\n  if (entity) {\n    params.set('entity', entity);\n  }\n  if (entityPage) {\n    params.set('entityPage', 'true');\n  }\n  if (tags && tags.length > 0) {\n    params.set('tags', tags.join(','));\n  }\n\n  return (\n    <OptionalRequirePermission\n      permission={qetaCreatePostPermission}\n      errorPage={<></>}\n    >\n      <Box sx={{ marginLeft: 2 }}>\n        <LinkButton\n          size=\"small\"\n          variant=\"contained\"\n          to={\n            entity || tags\n              ? `${writeRoute()}?${params.toString()}`\n              : writeRoute()\n          }\n          color=\"primary\"\n          startIcon={<CreateIcon />}\n        >\n          {t('writeArticleButton.title')}\n        </LinkButton>\n      </Box>\n    </OptionalRequirePermission>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAUa,MAAA,kBAAA,GAAqB,CAAC,KAI7B,KAAA;AACJ,EAAA,MAAM,EAAE,MAAA,EAAQ,UAAY,EAAA,IAAA,EAAS,GAAA,KAAA;AACrC,EAAM,MAAA,UAAA,GAAa,YAAY,aAAa,CAAA;AAC5C,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAM,MAAA,MAAA,GAAS,IAAI,eAAgB,EAAA;AACnC,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,GAAA,CAAI,UAAU,MAAM,CAAA;AAAA;AAE7B,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,MAAA,CAAA,GAAA,CAAI,cAAc,MAAM,CAAA;AAAA;AAEjC,EAAI,IAAA,IAAA,IAAQ,IAAK,CAAA,MAAA,GAAS,CAAG,EAAA;AAC3B,IAAA,MAAA,CAAO,GAAI,CAAA,MAAA,EAAQ,IAAK,CAAA,IAAA,CAAK,GAAG,CAAC,CAAA;AAAA;AAGnC,EACE,uBAAA,GAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,wBAAA;AAAA,MACZ,2BAAa,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AAAA,MAEb,8BAAC,GAAI,EAAA,EAAA,EAAA,EAAI,EAAE,UAAA,EAAY,GACrB,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,IAAK,EAAA,OAAA;AAAA,UACL,OAAQ,EAAA,WAAA;AAAA,UACR,EAAA,EACE,MAAU,IAAA,IAAA,GACN,CAAG,EAAA,UAAA,EAAY,CAAA,CAAA,EAAI,MAAO,CAAA,QAAA,EAAU,CAAA,CAAA,GACpC,UAAW,EAAA;AAAA,UAEjB,KAAM,EAAA,SAAA;AAAA,UACN,SAAA,sBAAY,UAAW,EAAA,EAAA,CAAA;AAAA,UAEtB,YAAE,0BAA0B;AAAA;AAAA,OAEjC,EAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"WriteArticleButton.esm.js","sources":["../../../src/components/Buttons/WriteArticleButton.tsx"],"sourcesContent":["import CreateIcon from '@material-ui/icons/Create';\nimport { qetaCreatePostPermission } from '@drodil/backstage-plugin-qeta-common';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { writeRouteRef } from '../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\nimport { ContentHeaderButton } from './ContentHeaderButton';\n\nexport const WriteArticleButton = (props: {\n  entity?: string;\n  tags?: string[];\n  entityPage?: boolean;\n}) => {\n  const { entity, entityPage, tags } = props;\n  const writeRoute = useRouteRef(writeRouteRef);\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const params = new URLSearchParams();\n  if (entity) {\n    params.set('entity', entity);\n  }\n  if (entityPage) {\n    params.set('entityPage', 'true');\n  }\n  if (tags && tags.length > 0) {\n    params.set('tags', tags.join(','));\n  }\n\n  return (\n    <OptionalRequirePermission\n      permission={qetaCreatePostPermission}\n      errorPage={<></>}\n    >\n      <ContentHeaderButton\n        to={\n          entity || tags ? `${writeRoute()}?${params.toString()}` : writeRoute()\n        }\n        color=\"primary\"\n        icon={<CreateIcon />}\n      >\n        {t('writeArticleButton.title')}\n      </ContentHeaderButton>\n    </OptionalRequirePermission>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AASa,MAAA,kBAAA,GAAqB,CAAC,KAI7B,KAAA;AACJ,EAAA,MAAM,EAAE,MAAA,EAAQ,UAAY,EAAA,IAAA,EAAS,GAAA,KAAA;AACrC,EAAM,MAAA,UAAA,GAAa,YAAY,aAAa,CAAA;AAC5C,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAM,MAAA,MAAA,GAAS,IAAI,eAAgB,EAAA;AACnC,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,GAAA,CAAI,UAAU,MAAM,CAAA;AAAA;AAE7B,EAAA,IAAI,UAAY,EAAA;AACd,IAAO,MAAA,CAAA,GAAA,CAAI,cAAc,MAAM,CAAA;AAAA;AAEjC,EAAI,IAAA,IAAA,IAAQ,IAAK,CAAA,MAAA,GAAS,CAAG,EAAA;AAC3B,IAAA,MAAA,CAAO,GAAI,CAAA,MAAA,EAAQ,IAAK,CAAA,IAAA,CAAK,GAAG,CAAC,CAAA;AAAA;AAGnC,EACE,uBAAA,GAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,wBAAA;AAAA,MACZ,2BAAa,GAAA,CAAA,QAAA,EAAA,EAAA,CAAA;AAAA,MAEb,QAAA,kBAAA,GAAA;AAAA,QAAC,mBAAA;AAAA,QAAA;AAAA,UACC,EAAA,EACE,MAAU,IAAA,IAAA,GAAO,CAAG,EAAA,UAAA,EAAY,CAAA,CAAA,EAAI,MAAO,CAAA,QAAA,EAAU,CAAA,CAAA,GAAK,UAAW,EAAA;AAAA,UAEvE,KAAM,EAAA,SAAA;AAAA,UACN,IAAA,sBAAO,UAAW,EAAA,EAAA,CAAA;AAAA,UAEjB,YAAE,0BAA0B;AAAA;AAAA;AAC/B;AAAA,GACF;AAEJ;;;;"}

package/dist/components/CollectionsGrid/CollectionsGrid.esm.js

@@ -169,6 +169,7 @@ const CollectionsGrid = (props) => {
       {
         onChange: onFilterChange,
         filters,
+        mode: "collections",
         ...props.filterPanelProps
       }
     ) }),

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

@@ -1 +1 @@
-{"version":3,"file":"CollectionsGrid.esm.js","sources":["../../../src/components/CollectionsGrid/CollectionsGrid.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { Box, Button, Collapse } from '@material-ui/core';\nimport { CollectionsGridContent } from './CollectionsGridContent';\nimport { useQetaApi } from '../../hooks';\nimport useDebounce from 'react-use/lib/useDebounce';\nimport { QetaPagination } from '../QetaPagination/QetaPagination';\nimport {\n  CollectionFilters,\n  CommonFilterPanelProps,\n  FilterKey,\n  filterKeys,\n  FilterPanel,\n} from '../FilterPanel/FilterPanel';\nimport FilterList from '@material-ui/icons/FilterList';\nimport { getFiltersWithDateRange } from '../../utils';\nimport { useSearchParams } from 'react-router-dom';\nimport { filterTags } from '@drodil/backstage-plugin-qeta-common';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { QetaGridHeader } from '../Utility/QetaGridHeader';\n\nexport type CollectionsGridProps = {\n  owner?: string;\n  showFilters?: boolean;\n  filterPanelProps?: CommonFilterPanelProps;\n};\n\nexport type CollectionFilterChange = {\n  key: keyof CollectionFilters;\n  value?: CollectionFilters[keyof CollectionFilters];\n};\n\nconst EXPANDED_LOCAL_STORAGE_KEY = 'qeta-collection-filters-expanded';\n\nexport const CollectionsGrid = (props: CollectionsGridProps) => {\n  const { showFilters, owner } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const [page, setPage] = useState(1);\n  const [pageCount, setPageCount] = useState(1);\n  const [searchParams, setSearchParams] = useSearchParams();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [collectionsPerPage, setCollectionsPerPage] = useState(25);\n  const [showFilterPanel, setShowFilterPanel] = useState(\n    localStorage.getItem(EXPANDED_LOCAL_STORAGE_KEY) === 'true',\n  );\n  const [filters, setFilters] = useState<CollectionFilters>({\n    order: 'desc',\n    searchQuery: '',\n    orderBy: 'created',\n  });\n\n  useEffect(() => {\n    localStorage.setItem(\n      EXPANDED_LOCAL_STORAGE_KEY,\n      showFilterPanel ? 'true' : 'false',\n    );\n  }, [showFilterPanel]);\n\n  const {\n    value: response,\n    loading,\n    error,\n  } = useQetaApi(\n    api => {\n      return api.getCollections({\n        limit: collectionsPerPage,\n        offset: (page - 1) * collectionsPerPage,\n        includePosts: false,\n        includeExperts: false,\n        owner,\n        ...(getFiltersWithDateRange(filters) as any),\n      });\n    },\n    [collectionsPerPage, page, filters],\n  );\n\n  useDebounce(\n    () => {\n      if (filters.searchQuery !== searchQuery) {\n        setFilters({ ...filters, searchQuery: searchQuery });\n      }\n    },\n    400,\n    [searchQuery],\n  );\n\n  useEffect(() => {\n    if (response) {\n      setPageCount(Math.ceil(response.total / collectionsPerPage));\n    }\n  }, [response, collectionsPerPage]);\n\n  const onFilterChange = (\n    changes: CollectionFilterChange | CollectionFilterChange[],\n  ) => {\n    const changesArray = Array.isArray(changes) ? changes : [changes];\n    setPage(1);\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 (!filterKeys.includes(key as FilterKey)) {\n          continue;\n        }\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 (typeof value === 'number') {\n          newValue.set(key, String(value));\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  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          }\n        } else if (key === 'collectionsPerPage') {\n          const qpp = Number.parseInt(value, 10);\n          if (qpp > 0) setCollectionsPerPage(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  return (\n    <Box>\n      <QetaGridHeader\n        title={t('common.collections', { count: response?.total ?? 0 })}\n        searchBarLabel={t('collectionsPage.search.label')}\n        loading={loading}\n        onSearch={setSearchQuery}\n        buttons={\n          response &&\n          (showFilters ?? true) && (\n            <Button\n              onClick={() => {\n                setShowFilterPanel(!showFilterPanel);\n              }}\n              className=\"qetaCollectionsContainerFilterPanelBtn\"\n              startIcon={<FilterList />}\n            >\n              {t('filterPanel.filterButton')}\n            </Button>\n          )\n        }\n      />\n      {(showFilters ?? true) && (\n        <Collapse in={showFilterPanel}>\n          <FilterPanel<CollectionFilters>\n            onChange={onFilterChange}\n            filters={filters}\n            {...props.filterPanelProps}\n          />\n        </Collapse>\n      )}\n      <CollectionsGridContent\n        loading={loading}\n        error={error}\n        response={response}\n      />\n      {response && response?.total > 0 && (\n        <QetaPagination\n          pageSize={collectionsPerPage}\n          handlePageChange={(_e, p) => setPage(p)}\n          handlePageSizeChange={e =>\n            setCollectionsPerPage(Number(e.target.value))\n          }\n          page={page}\n          pageCount={pageCount}\n        />\n      )}\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAgCA,MAAM,0BAA6B,GAAA,kCAAA;AAEtB,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAM,MAAA,EAAE,WAAa,EAAA,KAAA,EAAU,GAAA,KAAA;AAC/B,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,CAAC,CAAA;AAClC,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,CAAC,CAAA;AAC5C,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,eAAgB,EAAA;AACxD,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAS,EAAE,CAAA;AACjD,EAAA,MAAM,CAAC,kBAAA,EAAoB,qBAAqB,CAAA,GAAI,SAAS,EAAE,CAAA;AAC/D,EAAM,MAAA,CAAC,eAAiB,EAAA,kBAAkB,CAAI,GAAA,QAAA;AAAA,IAC5C,YAAA,CAAa,OAAQ,CAAA,0BAA0B,CAAM,KAAA;AAAA,GACvD;AACA,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,QAA4B,CAAA;AAAA,IACxD,KAAO,EAAA,MAAA;AAAA,IACP,WAAa,EAAA,EAAA;AAAA,IACb,OAAS,EAAA;AAAA,GACV,CAAA;AAED,EAAA,SAAA,CAAU,MAAM;AACd,IAAa,YAAA,CAAA,OAAA;AAAA,MACX,0BAAA;AAAA,MACA,kBAAkB,MAAS,GAAA;AAAA,KAC7B;AAAA,GACF,EAAG,CAAC,eAAe,CAAC,CAAA;AAEpB,EAAM,MAAA;AAAA,IACJ,KAAO,EAAA,QAAA;AAAA,IACP,OAAA;AAAA,IACA;AAAA,GACE,GAAA,UAAA;AAAA,IACF,CAAO,GAAA,KAAA;AACL,MAAA,OAAO,IAAI,cAAe,CAAA;AAAA,QACxB,KAAO,EAAA,kBAAA;AAAA,QACP,MAAA,EAAA,CAAS,OAAO,CAAK,IAAA,kBAAA;AAAA,QACrB,YAAc,EAAA,KAAA;AAAA,QACd,cAAgB,EAAA,KAAA;AAAA,QAChB,KAAA;AAAA,QACA,GAAI,wBAAwB,OAAO;AAAA,OACpC,CAAA;AAAA,KACH;AAAA,IACA,CAAC,kBAAoB,EAAA,IAAA,EAAM,OAAO;AAAA,GACpC;AAEA,EAAA,WAAA;AAAA,IACE,MAAM;AACJ,MAAI,IAAA,OAAA,CAAQ,gBAAgB,WAAa,EAAA;AACvC,QAAA,UAAA,CAAW,EAAE,GAAG,OAAS,EAAA,WAAA,EAA0B,CAAA;AAAA;AACrD,KACF;AAAA,IACA,GAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,QAAU,EAAA;AACZ,MAAA,YAAA,CAAa,IAAK,CAAA,IAAA,CAAK,QAAS,CAAA,KAAA,GAAQ,kBAAkB,CAAC,CAAA;AAAA;AAC7D,GACC,EAAA,CAAC,QAAU,EAAA,kBAAkB,CAAC,CAAA;AAEjC,EAAM,MAAA,cAAA,GAAiB,CACrB,OACG,KAAA;AACH,IAAA,MAAM,eAAe,KAAM,CAAA,OAAA,CAAQ,OAAO,CAAI,GAAA,OAAA,GAAU,CAAC,OAAO,CAAA;AAChE,IAAA,OAAA,CAAQ,CAAC,CAAA;AACT,IAAA,UAAA,CAAW,CAAQ,IAAA,KAAA;AACjB,MAAM,MAAA,QAAA,GAAW,EAAE,GAAG,IAAK,EAAA;AAC3B,MAAA,KAAA,MAAW,EAAE,GAAA,EAAK,KAAM,EAAA,IAAK,YAAc,EAAA;AACzC,QAAC,QAAA,CAAiB,GAAG,CAAI,GAAA,KAAA;AAAA;AAE3B,MAAO,OAAA,QAAA;AAAA,KACR,CAAA;AACD,IAAA,eAAA,CAAgB,CAAQ,IAAA,KAAA;AACtB,MAAA,MAAM,QAAW,GAAA,IAAA;AACjB,MAAA,KAAA,MAAW,EAAE,GAAA,EAAK,KAAM,EAAA,IAAK,YAAc,EAAA;AACzC,QAAA,IAAI,CAAC,UAAA,CAAW,QAAS,CAAA,GAAgB,CAAG,EAAA;AAC1C,UAAA;AAAA;AAEF,QAAI,IAAA,CAAC,KAAS,IAAA,KAAA,KAAU,OAAS,EAAA;AAC/B,UAAA,QAAA,CAAS,OAAO,GAAG,CAAA;AAAA,SACV,MAAA,IAAA,KAAA,CAAM,OAAQ,CAAA,KAAK,CAAG,EAAA;AAC/B,UAAI,IAAA,KAAA,CAAM,WAAW,CAAG,EAAA;AACtB,YAAA,QAAA,CAAS,OAAO,GAAG,CAAA;AAAA,WACd,MAAA;AACL,YAAA,QAAA,CAAS,GAAI,CAAA,GAAA,EAAK,KAAM,CAAA,IAAA,CAAK,GAAG,CAAC,CAAA;AAAA;AACnC,SACF,MAAA,IAAW,OAAO,KAAA,KAAU,QAAU,EAAA;AACpC,UAAA,QAAA,CAAS,GAAI,CAAA,GAAA,EAAK,MAAO,CAAA,KAAK,CAAC,CAAA;AAAA,SACjC,MAAA,IAAW,KAAM,CAAA,MAAA,GAAS,CAAG,EAAA;AAC3B,UAAS,QAAA,CAAA,GAAA,CAAI,KAAK,KAAK,CAAA;AAAA,SAClB,MAAA;AACL,UAAA,QAAA,CAAS,OAAO,GAAG,CAAA;AAAA;AACrB;AAEF,MAAO,OAAA,QAAA;AAAA,KACR,CAAA;AAAA,GACH;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,cAAiB,GAAA,KAAA;AACrB,IAAa,YAAA,CAAA,OAAA,CAAQ,CAAC,KAAA,EAAO,GAAQ,KAAA;AACnC,MAAI,IAAA;AACF,QAAA,IAAI,QAAQ,MAAQ,EAAA;AAClB,UAAA,MAAM,EAAK,GAAA,MAAA,CAAO,QAAS,CAAA,KAAA,EAAO,EAAE,CAAA;AACpC,UAAA,IAAI,KAAK,CAAG,EAAA;AACV,YAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,WACL,MAAA;AACL,YAAA,OAAA,CAAQ,CAAC,CAAA;AAAA;AACX,SACF,MAAA,IAAW,QAAQ,oBAAsB,EAAA;AACvC,UAAA,MAAM,GAAM,GAAA,MAAA,CAAO,QAAS,CAAA,KAAA,EAAO,EAAE,CAAA;AACrC,UAAI,IAAA,GAAA,GAAM,CAAG,EAAA,qBAAA,CAAsB,GAAG,CAAA;AAAA,SAC7B,MAAA,IAAA,UAAA,CAAW,QAAS,CAAA,GAAgB,CAAG,EAAA;AAChD,UAAiB,cAAA,GAAA,IAAA;AACjB,UAAA,IAAI,QAAQ,MAAQ,EAAA;AAClB,YAAA,OAAA,CAAQ,OAAO,UAAW,CAAA,KAAA,CAAM,MAAM,GAAG,CAAC,KAAK,EAAC;AAAA,WAClD,MAAA,IAAW,QAAQ,UAAY,EAAA;AAC7B,YAAQ,OAAA,CAAA,QAAA,GAAW,KAAM,CAAA,KAAA,CAAM,GAAG,CAAA;AAAA,WAC7B,MAAA;AACL,YAAC,OAAA,CAAgB,GAAG,CAAI,GAAA,KAAA;AAAA;AAC1B;AACF,eACO,EAAI,EAAA;AAAA;AAEb,KACD,CAAA;AACD,IAAA,UAAA,CAAW,OAAO,CAAA;AAClB,IAAA,IAAI,cAAgB,EAAA;AAClB,MAAA,kBAAA,CAAmB,IAAI,CAAA;AAAA;AACzB,GACC,EAAA,CAAC,YAAc,EAAA,OAAO,CAAC,CAAA;AAE1B,EAAA,4BACG,GACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,EAAE,oBAAsB,EAAA,EAAE,OAAO,QAAU,EAAA,KAAA,IAAS,GAAG,CAAA;AAAA,QAC9D,cAAA,EAAgB,EAAE,8BAA8B,CAAA;AAAA,QAChD,OAAA;AAAA,QACA,QAAU,EAAA,cAAA;AAAA,QACV,OAAA,EACE,QACC,KAAA,WAAA,IAAe,IACd,CAAA,oBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,SAAS,MAAM;AACb,cAAA,kBAAA,CAAmB,CAAC,eAAe,CAAA;AAAA,aACrC;AAAA,YACA,SAAU,EAAA,wCAAA;AAAA,YACV,SAAA,sBAAY,UAAW,EAAA,EAAA,CAAA;AAAA,YAEtB,YAAE,0BAA0B;AAAA;AAAA;AAC/B;AAAA,KAGN;AAAA,IAAA,CACE,WAAe,IAAA,IAAA,qBACd,GAAA,CAAA,QAAA,EAAA,EAAS,IAAI,eACZ,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,WAAA;AAAA,MAAA;AAAA,QACC,QAAU,EAAA,cAAA;AAAA,QACV,OAAA;AAAA,QACC,GAAG,KAAM,CAAA;AAAA;AAAA,KAEd,EAAA,CAAA;AAAA,oBAEF,GAAA;AAAA,MAAC,sBAAA;AAAA,MAAA;AAAA,QACC,OAAA;AAAA,QACA,KAAA;AAAA,QACA;AAAA;AAAA,KACF;AAAA,IACC,QAAA,IAAY,QAAU,EAAA,KAAA,GAAQ,CAC7B,oBAAA,GAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACC,QAAU,EAAA,kBAAA;AAAA,QACV,gBAAkB,EAAA,CAAC,EAAI,EAAA,CAAA,KAAM,QAAQ,CAAC,CAAA;AAAA,QACtC,sBAAsB,CACpB,CAAA,KAAA,qBAAA,CAAsB,OAAO,CAAE,CAAA,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,QAE9C,IAAA;AAAA,QACA;AAAA;AAAA;AACF,GAEJ,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"CollectionsGrid.esm.js","sources":["../../../src/components/CollectionsGrid/CollectionsGrid.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { Box, Button, Collapse } from '@material-ui/core';\nimport { CollectionsGridContent } from './CollectionsGridContent';\nimport { useQetaApi } from '../../hooks';\nimport useDebounce from 'react-use/lib/useDebounce';\nimport { QetaPagination } from '../QetaPagination/QetaPagination';\nimport {\n  CollectionFilters,\n  CommonFilterPanelProps,\n  FilterKey,\n  filterKeys,\n  FilterPanel,\n} from '../FilterPanel/FilterPanel';\nimport FilterList from '@material-ui/icons/FilterList';\nimport { getFiltersWithDateRange } from '../../utils';\nimport { useSearchParams } from 'react-router-dom';\nimport { filterTags } from '@drodil/backstage-plugin-qeta-common';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { QetaGridHeader } from '../Utility/QetaGridHeader';\n\nexport type CollectionsGridProps = {\n  owner?: string;\n  showFilters?: boolean;\n  filterPanelProps?: CommonFilterPanelProps;\n};\n\nexport type CollectionFilterChange = {\n  key: keyof CollectionFilters;\n  value?: CollectionFilters[keyof CollectionFilters];\n};\n\nconst EXPANDED_LOCAL_STORAGE_KEY = 'qeta-collection-filters-expanded';\n\nexport const CollectionsGrid = (props: CollectionsGridProps) => {\n  const { showFilters, owner } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const [page, setPage] = useState(1);\n  const [pageCount, setPageCount] = useState(1);\n  const [searchParams, setSearchParams] = useSearchParams();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [collectionsPerPage, setCollectionsPerPage] = useState(25);\n  const [showFilterPanel, setShowFilterPanel] = useState(\n    localStorage.getItem(EXPANDED_LOCAL_STORAGE_KEY) === 'true',\n  );\n  const [filters, setFilters] = useState<CollectionFilters>({\n    order: 'desc',\n    searchQuery: '',\n    orderBy: 'created',\n  });\n\n  useEffect(() => {\n    localStorage.setItem(\n      EXPANDED_LOCAL_STORAGE_KEY,\n      showFilterPanel ? 'true' : 'false',\n    );\n  }, [showFilterPanel]);\n\n  const {\n    value: response,\n    loading,\n    error,\n  } = useQetaApi(\n    api => {\n      return api.getCollections({\n        limit: collectionsPerPage,\n        offset: (page - 1) * collectionsPerPage,\n        includePosts: false,\n        includeExperts: false,\n        owner,\n        ...(getFiltersWithDateRange(filters) as any),\n      });\n    },\n    [collectionsPerPage, page, filters],\n  );\n\n  useDebounce(\n    () => {\n      if (filters.searchQuery !== searchQuery) {\n        setFilters({ ...filters, searchQuery: searchQuery });\n      }\n    },\n    400,\n    [searchQuery],\n  );\n\n  useEffect(() => {\n    if (response) {\n      setPageCount(Math.ceil(response.total / collectionsPerPage));\n    }\n  }, [response, collectionsPerPage]);\n\n  const onFilterChange = (\n    changes: CollectionFilterChange | CollectionFilterChange[],\n  ) => {\n    const changesArray = Array.isArray(changes) ? changes : [changes];\n    setPage(1);\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 (!filterKeys.includes(key as FilterKey)) {\n          continue;\n        }\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 (typeof value === 'number') {\n          newValue.set(key, String(value));\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  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          }\n        } else if (key === 'collectionsPerPage') {\n          const qpp = Number.parseInt(value, 10);\n          if (qpp > 0) setCollectionsPerPage(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  return (\n    <Box>\n      <QetaGridHeader\n        title={t('common.collections', { count: response?.total ?? 0 })}\n        searchBarLabel={t('collectionsPage.search.label')}\n        loading={loading}\n        onSearch={setSearchQuery}\n        buttons={\n          response &&\n          (showFilters ?? true) && (\n            <Button\n              onClick={() => {\n                setShowFilterPanel(!showFilterPanel);\n              }}\n              className=\"qetaCollectionsContainerFilterPanelBtn\"\n              startIcon={<FilterList />}\n            >\n              {t('filterPanel.filterButton')}\n            </Button>\n          )\n        }\n      />\n      {(showFilters ?? true) && (\n        <Collapse in={showFilterPanel}>\n          <FilterPanel<CollectionFilters>\n            onChange={onFilterChange}\n            filters={filters}\n            mode=\"collections\"\n            {...props.filterPanelProps}\n          />\n        </Collapse>\n      )}\n      <CollectionsGridContent\n        loading={loading}\n        error={error}\n        response={response}\n      />\n      {response && response?.total > 0 && (\n        <QetaPagination\n          pageSize={collectionsPerPage}\n          handlePageChange={(_e, p) => setPage(p)}\n          handlePageSizeChange={e =>\n            setCollectionsPerPage(Number(e.target.value))\n          }\n          page={page}\n          pageCount={pageCount}\n        />\n      )}\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/CollectionsGrid/CollectionsGridContent.esm.js

@@ -26,19 +26,9 @@ const CollectionsGridContent = (props) => {
   if (!response.collections || response.collections.length === 0) {
     return /* @__PURE__ */ jsx(NoCollectionsCard, {});
   }
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
-    Grid,
-    {
-      container: true,
-      item: true,
-      direction: "row",
-      alignItems: "stretch",
-      style: { marginTop: "1rem" },
-      children: response.collections.map((p) => {
-        return /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, md: 4, lg: 3, children: /* @__PURE__ */ jsx(CollectionsGridItem, { collection: p }) }, p.id);
-      })
-    }
-  ) });
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Grid, { container: true, spacing: 3, direction: "row", alignItems: "stretch", children: response.collections.map((p) => {
+    return /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, md: 12, lg: 6, children: /* @__PURE__ */ jsx(CollectionsGridItem, { collection: p }) }, p.id);
+  }) }) });
 };
 
 export { CollectionsGridContent };

package/dist/components/CollectionsGrid/CollectionsGridContent.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CollectionsGridContent.esm.js","sources":["../../../src/components/CollectionsGrid/CollectionsGridContent.tsx"],"sourcesContent":["import { CollectionsResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { WarningPanel } from '@backstage/core-components';\nimport { Grid } from '@material-ui/core';\nimport { CollectionsGridItem } from './CollectionsGridItem';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { LoadingGrid } from '../LoadingGrid/LoadingGrid';\nimport { NoCollectionsCard } from './NoCollectionsCard';\n\nexport const CollectionsGridContent = (props: {\n  loading: boolean;\n  error: any;\n  response?: CollectionsResponse;\n}) => {\n  const { loading, error, response } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  if (loading) {\n    return <LoadingGrid />;\n  }\n\n  if (error || response === undefined) {\n    return (\n      <WarningPanel\n        severity=\"error\"\n        title={t('postsList.errorLoading', { itemType: 'collections' })}\n      >\n        {error?.message}\n      </WarningPanel>\n    );\n  }\n\n  if (!response.collections || response.collections.length === 0) {\n    return <NoCollectionsCard />;\n  }\n\n  return (\n    <>\n      <Grid\n        container\n        item\n        direction=\"row\"\n        alignItems=\"stretch\"\n        style={{ marginTop: '1rem' }}\n      >\n        {response.collections.map(p => {\n          return (\n            <Grid item xs={12} md={4} lg={3} key={p.id}>\n              <CollectionsGridItem collection={p} />\n            </Grid>\n          );\n        })}\n      </Grid>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AASa,MAAA,sBAAA,GAAyB,CAAC,KAIjC,KAAA;AACJ,EAAA,MAAM,EAAE,OAAA,EAAS,KAAO,EAAA,QAAA,EAAa,GAAA,KAAA;AACrC,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAA,IAAI,OAAS,EAAA;AACX,IAAA,2BAAQ,WAAY,EAAA,EAAA,CAAA;AAAA;AAGtB,EAAI,IAAA,KAAA,IAAS,aAAa,KAAW,CAAA,EAAA;AACnC,IACE,uBAAA,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,QAAS,EAAA,OAAA;AAAA,QACT,OAAO,CAAE,CAAA,wBAAA,EAA0B,EAAE,QAAA,EAAU,eAAe,CAAA;AAAA,QAE7D,QAAO,EAAA,KAAA,EAAA;AAAA;AAAA,KACV;AAAA;AAIJ,EAAA,IAAI,CAAC,QAAS,CAAA,WAAA,IAAe,QAAS,CAAA,WAAA,CAAY,WAAW,CAAG,EAAA;AAC9D,IAAA,2BAAQ,iBAAkB,EAAA,EAAA,CAAA;AAAA;AAG5B,EAAA,uBAEI,GAAA,CAAA,QAAA,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAS,EAAA,IAAA;AAAA,MACT,IAAI,EAAA,IAAA;AAAA,MACJ,SAAU,EAAA,KAAA;AAAA,MACV,UAAW,EAAA,SAAA;AAAA,MACX,KAAA,EAAO,EAAE,SAAA,EAAW,MAAO,EAAA;AAAA,MAE1B,QAAA,EAAA,QAAA,CAAS,WAAY,CAAA,GAAA,CAAI,CAAK,CAAA,KAAA;AAC7B,QAAA,2BACG,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,EAAA,EAAI,IAAI,EAAI,EAAA,CAAA,EAAG,EAAI,EAAA,CAAA,EAC5B,8BAAC,mBAAoB,EAAA,EAAA,UAAA,EAAY,CAAG,EAAA,CAAA,EAAA,EADA,EAAE,EAExC,CAAA;AAAA,OAEH;AAAA;AAAA,GAEL,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"CollectionsGridContent.esm.js","sources":["../../../src/components/CollectionsGrid/CollectionsGridContent.tsx"],"sourcesContent":["import { CollectionsResponse } from '@drodil/backstage-plugin-qeta-common';\nimport { WarningPanel } from '@backstage/core-components';\nimport { Grid } from '@material-ui/core';\nimport { CollectionsGridItem } from './CollectionsGridItem';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { LoadingGrid } from '../LoadingGrid/LoadingGrid';\nimport { NoCollectionsCard } from './NoCollectionsCard';\n\nexport const CollectionsGridContent = (props: {\n  loading: boolean;\n  error: any;\n  response?: CollectionsResponse;\n}) => {\n  const { loading, error, response } = props;\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  if (loading) {\n    return <LoadingGrid />;\n  }\n\n  if (error || response === undefined) {\n    return (\n      <WarningPanel\n        severity=\"error\"\n        title={t('postsList.errorLoading', { itemType: 'collections' })}\n      >\n        {error?.message}\n      </WarningPanel>\n    );\n  }\n\n  if (!response.collections || response.collections.length === 0) {\n    return <NoCollectionsCard />;\n  }\n\n  return (\n    <>\n      <Grid container spacing={3} direction=\"row\" alignItems=\"stretch\">\n        {response.collections.map(p => {\n          return (\n            <Grid item xs={12} md={12} lg={6} key={p.id}>\n              <CollectionsGridItem collection={p} />\n            </Grid>\n          );\n        })}\n      </Grid>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AASa,MAAA,sBAAA,GAAyB,CAAC,KAIjC,KAAA;AACJ,EAAA,MAAM,EAAE,OAAA,EAAS,KAAO,EAAA,QAAA,EAAa,GAAA,KAAA;AACrC,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAA,IAAI,OAAS,EAAA;AACX,IAAA,2BAAQ,WAAY,EAAA,EAAA,CAAA;AAAA;AAGtB,EAAI,IAAA,KAAA,IAAS,aAAa,KAAW,CAAA,EAAA;AACnC,IACE,uBAAA,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,QAAS,EAAA,OAAA;AAAA,QACT,OAAO,CAAE,CAAA,wBAAA,EAA0B,EAAE,QAAA,EAAU,eAAe,CAAA;AAAA,QAE7D,QAAO,EAAA,KAAA,EAAA;AAAA;AAAA,KACV;AAAA;AAIJ,EAAA,IAAI,CAAC,QAAS,CAAA,WAAA,IAAe,QAAS,CAAA,WAAA,CAAY,WAAW,CAAG,EAAA;AAC9D,IAAA,2BAAQ,iBAAkB,EAAA,EAAA,CAAA;AAAA;AAG5B,EAAA,uBAEI,GAAA,CAAA,QAAA,EAAA,EAAA,QAAA,kBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,SAAA,EAAS,MAAC,OAAS,EAAA,CAAA,EAAG,SAAU,EAAA,KAAA,EAAM,UAAW,EAAA,SAAA,EACpD,QAAS,EAAA,QAAA,CAAA,WAAA,CAAY,IAAI,CAAK,CAAA,KAAA;AAC7B,IAAA,2BACG,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,EAAA,EAAI,IAAI,EAAI,EAAA,EAAA,EAAI,EAAI,EAAA,CAAA,EAC7B,8BAAC,mBAAoB,EAAA,EAAA,UAAA,EAAY,CAAG,EAAA,CAAA,EAAA,EADC,EAAE,EAEzC,CAAA;AAAA,GAEH,GACH,CACF,EAAA,CAAA;AAEJ;;;;"}