@drodil/backstage-plugin-qeta 3.59.10 → 4.0.0

package/README.md

@@ -15,21 +15,16 @@ Add the plugin to your frontend app:
 cd packages/app && yarn add @drodil/backstage-plugin-qeta
 ```
 
-Expose the questions page:
+Register the plugin in your frontend app:
 
 ```ts
 // packages/app/src/App.tsx
-import { QetaPage } from '@drodil/backstage-plugin-qeta';
+import { createApp } from '@backstage/frontend-defaults';
+import qetaPlugin from '@drodil/backstage-plugin-qeta';
 
-// ...
-
-const AppRoutes = () => (
-  <FlatRoutes>
-    // ...
-    <Route path="/qeta" element={<QetaPage />} />
-    // ...
-  </FlatRoutes>
-);
+const app = createApp({
+  features: [qetaPlugin],
+});
 ```
 
 An interface for Q&A is now available at `/qeta`.

package/config.schema.json

@@ -26,6 +26,11 @@
         "entities": {
           "type": "object",
           "properties": {
+            "disabled": {
+              "type": "boolean",
+              "description": "Disable entity pages and entity pickers.",
+              "visibility": "frontend"
+            },
             "kinds": {
               "type": "array",
               "items": {
@@ -51,6 +56,11 @@
         "tags": {
           "type": "object",
           "properties": {
+            "disabled": {
+              "type": "boolean",
+              "description": "Disable tags pages and tag pickers.",
+              "visibility": "frontend"
+            },
             "allowCreation": {
               "type": "boolean",
               "description": "Allow creation of new tags. Default: true",
@@ -101,6 +111,54 @@
           "description": "List of users/groups that can moderate questions and answers in case permission framework is not in use. In case permission framework is in use, this list is used to determine if user can access the moderator panel",
           "visibility": "frontend"
         },
+        "questions": {
+          "type": "object",
+          "properties": {
+            "disabled": {
+              "type": "boolean",
+              "description": "Disable questions in the UI.",
+              "visibility": "frontend"
+            }
+          },
+          "description": "Questions specific configuration.",
+          "visibility": "frontend"
+        },
+        "articles": {
+          "type": "object",
+          "properties": {
+            "disabled": {
+              "type": "boolean",
+              "description": "Disable articles in the UI.",
+              "visibility": "frontend"
+            }
+          },
+          "description": "Articles specific configuration.",
+          "visibility": "frontend"
+        },
+        "links": {
+          "type": "object",
+          "properties": {
+            "disabled": {
+              "type": "boolean",
+              "description": "Disable links in the UI.",
+              "visibility": "frontend"
+            }
+          },
+          "description": "Links specific configuration.",
+          "visibility": "frontend"
+        },
+        "collections": {
+          "type": "object",
+          "properties": {
+            "disabled": {
+              "type": "boolean",
+              "description": "Disable collections in the UI.",
+              "visibility": "frontend"
+            }
+          },
+          "description": "Collections specific configuration.",
+          "visibility": "frontend"
+        },
         "storage": {
           "type": "object",
           "properties": {

package/dist/components/ArticlePage/ArticlePage.esm.js

@@ -2,16 +2,14 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useParams } from 'react-router-dom';
 import { useState, useEffect } from 'react';
 import { useSignal } from '@backstage/plugin-signals-react';
-import { WarningPanel } from '@backstage/core-components';
-import { qetaTranslationRef, useQetaApi, ContentHeader, PostHistoryButton, FollowPostButton, WriteArticleButton, AddToCollectionButton, AIAnswerCard, ArticleContent } from '@drodil/backstage-plugin-qeta-react';
-import { Container } from '@material-ui/core';
-import { Skeleton } from '@material-ui/lab';
+import { qetaTranslationRef, useQetaConfig, useQetaApi, EditButton, DeleteButton, RestoreButton, PostHistoryButton, FollowPostButton, AddToCollectionButton, AIAnswerCard, ArticleContent, RelativeTimeWithTooltip, AuthorHeaderItem } from '@drodil/backstage-plugin-qeta-react';
+import { Skeleton, Alert, Header, Box } from '@backstage/ui';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
-import LibraryBooksOutlined from '@material-ui/icons/LibraryBooksOutlined';
 
 const ArticlePage = () => {
   const { id } = useParams();
   const { t } = useTranslationRef(qetaTranslationRef);
+  const { disabled } = useQetaConfig();
   const [views, setViews] = useState(0);
   const { lastSignal } = useSignal(`qeta:post_${id}`);
   const {
@@ -30,30 +28,78 @@ const ArticlePage = () => {
       setViews(lastSignal.views);
     }
   }, [lastSignal]);
+  if (disabled.articles) {
+    return null;
+  }
   if (loading) {
-    return /* @__PURE__ */ jsx(Skeleton, { variant: "rect", height: 200 });
+    return /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: 200 });
   }
   if (error || post === void 0) {
-    return /* @__PURE__ */ jsx(WarningPanel, { severity: "error", title: t("articlePage.errorLoading"), children: error?.message });
+    return /* @__PURE__ */ jsx(
+      Alert,
+      {
+        status: "danger",
+        title: t("articlePage.errorLoading"),
+        description: error?.message
+      }
+    );
   }
   if (post.type !== "article") {
-    return /* @__PURE__ */ jsx(WarningPanel, { title: "Not found", message: t("articlePage.notFound") });
+    return /* @__PURE__ */ jsx(
+      Alert,
+      {
+        status: "warning",
+        title: "Not found",
+        description: t("articlePage.notFound")
+      }
+    );
   }
+  const getMetadata = (q) => {
+    const metadata = [
+      {
+        label: t("postHeader.postedAtTime"),
+        value: /* @__PURE__ */ jsx(RelativeTimeWithTooltip, { value: q.created })
+      },
+      {
+        label: t("postHeader.author"),
+        value: /* @__PURE__ */ jsx(AuthorHeaderItem, { userEntityRef: q.author })
+      }
+    ];
+    if (q.updated) {
+      metadata.push({
+        label: t("postHeader.updatedAtTime"),
+        value: /* @__PURE__ */ jsx(RelativeTimeWithTooltip, { value: q.updated })
+      });
+    }
+    if (q.updatedBy) {
+      metadata.push({
+        label: t("postHeader.updatedBy"),
+        value: /* @__PURE__ */ jsx(AuthorHeaderItem, { userEntityRef: q.updatedBy })
+      });
+    }
+    metadata.push({
+      label: t("postHeader.views"),
+      value: views
+    });
+    return metadata;
+  };
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(
-      ContentHeader,
+    /* @__PURE__ */ jsx(
+      Header,
       {
         title: post.title,
-        titleIcon: /* @__PURE__ */ jsx(LibraryBooksOutlined, { fontSize: "large" }),
-        children: [
+        metadata: getMetadata(post),
+        customActions: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(EditButton, { entity: post, compact: true }),
+          /* @__PURE__ */ jsx(DeleteButton, { entity: post, compact: true }),
+          /* @__PURE__ */ jsx(RestoreButton, { entity: post, compact: true }),
           /* @__PURE__ */ jsx(PostHistoryButton, { post, onRestore: retry }),
           /* @__PURE__ */ jsx(FollowPostButton, { post }),
-          /* @__PURE__ */ jsx(WriteArticleButton, {}),
           /* @__PURE__ */ jsx(AddToCollectionButton, { post })
-        ]
+        ] })
       }
     ),
-    /* @__PURE__ */ jsxs(Container, { maxWidth: false, children: [
+    /* @__PURE__ */ jsxs(Box, { children: [
       /* @__PURE__ */ jsx(
         AIAnswerCard,
         {

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

@@ -1 +1 @@
-{"version":3,"file":"ArticlePage.esm.js","sources":["../../../src/components/ArticlePage/ArticlePage.tsx"],"sourcesContent":["import { useParams } from 'react-router-dom';\nimport { useEffect, useState } from 'react';\nimport { useSignal } from '@backstage/plugin-signals-react';\nimport { WarningPanel } from '@backstage/core-components';\nimport { Article, QetaSignal } from '@drodil/backstage-plugin-qeta-common';\nimport {\n  AddToCollectionButton,\n  AIAnswerCard,\n  ArticleContent,\n  ContentHeader,\n  PostHistoryButton,\n  qetaTranslationRef,\n  useQetaApi,\n  WriteArticleButton,\n  FollowPostButton,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { Container } from '@material-ui/core';\nimport { Skeleton } from '@material-ui/lab';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport LibraryBooksOutlined from '@material-ui/icons/LibraryBooksOutlined';\n\nexport const ArticlePage = () => {\n  const { id } = useParams();\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  const [views, setViews] = useState(0);\n\n  const { lastSignal } = useSignal<QetaSignal>(`qeta:post_${id}`);\n\n  const {\n    value: post,\n    loading,\n    error,\n    retry,\n  } = useQetaApi(api => api.getPost(id), [id]);\n\n  useEffect(() => {\n    if (post) {\n      setViews(post.views);\n    }\n  }, [post]);\n\n  useEffect(() => {\n    if (lastSignal?.type === 'post_stats') {\n      setViews(lastSignal.views);\n    }\n  }, [lastSignal]);\n\n  if (loading) {\n    return <Skeleton variant=\"rect\" height={200} />;\n  }\n\n  if (error || post === undefined) {\n    return (\n      <WarningPanel severity=\"error\" title={t('articlePage.errorLoading')}>\n        {error?.message}\n      </WarningPanel>\n    );\n  }\n\n  if (post.type !== 'article') {\n    return (\n      <WarningPanel title=\"Not found\" message={t('articlePage.notFound')} />\n    );\n  }\n\n  return (\n    <>\n      <ContentHeader\n        title={post.title}\n        titleIcon={<LibraryBooksOutlined fontSize=\"large\" />}\n      >\n        <PostHistoryButton post={post} onRestore={retry} />\n        <FollowPostButton post={post} />\n        <WriteArticleButton />\n        <AddToCollectionButton post={post} />\n      </ContentHeader>\n      <Container maxWidth={false}>\n        <AIAnswerCard\n          article={post as Article}\n          style={{ marginBottom: '2em' }}\n        />\n        <ArticleContent post={post} views={views} />\n      </Container>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAqBO,MAAM,cAAc,MAAM;AAC/B,EAAA,MAAM,EAAE,EAAA,EAAG,GAAI,SAAA,EAAU;AACzB,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,CAAC,CAAA;AAEpC,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAsB,CAAA,UAAA,EAAa,EAAE,CAAA,CAAE,CAAA;AAE9D,EAAA,MAAM;AAAA,IACJ,KAAA,EAAO,IAAA;AAAA,IACP,OAAA;AAAA,IACA,KAAA;AAAA,IACA;AAAA,GACF,GAAI,WAAW,CAAA,GAAA,KAAO,GAAA,CAAI,QAAQ,EAAE,CAAA,EAAG,CAAC,EAAE,CAAC,CAAA;AAE3C,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,IAAA,EAAM;AACR,MAAA,QAAA,CAAS,KAAK,KAAK,CAAA;AAAA,IACrB;AAAA,EACF,CAAA,EAAG,CAAC,IAAI,CAAC,CAAA;AAET,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,UAAA,EAAY,SAAS,YAAA,EAAc;AACrC,MAAA,QAAA,CAAS,WAAW,KAAK,CAAA;AAAA,IAC3B;AAAA,EACF,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAA,IAAI,OAAA,EAAS;AACX,IAAA,uBAAO,GAAA,CAAC,QAAA,EAAA,EAAS,OAAA,EAAQ,MAAA,EAAO,QAAQ,GAAA,EAAK,CAAA;AAAA,EAC/C;AAEA,EAAA,IAAI,KAAA,IAAS,SAAS,MAAA,EAAW;AAC/B,IAAA,uBACE,GAAA,CAAC,gBAAa,QAAA,EAAS,OAAA,EAAQ,OAAO,CAAA,CAAE,0BAA0B,CAAA,EAC/D,QAAA,EAAA,KAAA,EAAO,OAAA,EACV,CAAA;AAAA,EAEJ;AAEA,EAAA,IAAI,IAAA,CAAK,SAAS,SAAA,EAAW;AAC3B,IAAA,2BACG,YAAA,EAAA,EAAa,KAAA,EAAM,aAAY,OAAA,EAAS,CAAA,CAAE,sBAAsB,CAAA,EAAG,CAAA;AAAA,EAExE;AAEA,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,OAAO,IAAA,CAAK,KAAA;AAAA,QACZ,SAAA,kBAAW,GAAA,CAAC,oBAAA,EAAA,EAAqB,QAAA,EAAS,OAAA,EAAQ,CAAA;AAAA,QAElD,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,iBAAA,EAAA,EAAkB,IAAA,EAAY,SAAA,EAAW,KAAA,EAAO,CAAA;AAAA,0BACjD,GAAA,CAAC,oBAAiB,IAAA,EAAY,CAAA;AAAA,8BAC7B,kBAAA,EAAA,EAAmB,CAAA;AAAA,0BACpB,GAAA,CAAC,yBAAsB,IAAA,EAAY;AAAA;AAAA;AAAA,KACrC;AAAA,oBACA,IAAA,CAAC,SAAA,EAAA,EAAU,QAAA,EAAU,KAAA,EACnB,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAS,IAAA;AAAA,UACT,KAAA,EAAO,EAAE,YAAA,EAAc,KAAA;AAAM;AAAA,OAC/B;AAAA,sBACA,GAAA,CAAC,cAAA,EAAA,EAAe,IAAA,EAAY,KAAA,EAAc;AAAA,KAAA,EAC5C;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ArticlePage.esm.js","sources":["../../../src/components/ArticlePage/ArticlePage.tsx"],"sourcesContent":["import { useParams } from 'react-router-dom';\nimport { useEffect, useState } from 'react';\nimport { useSignal } from '@backstage/plugin-signals-react';\nimport {\n  Article,\n  PostResponse,\n  QetaSignal,\n} from '@drodil/backstage-plugin-qeta-common';\nimport {\n  AddToCollectionButton,\n  AIAnswerCard,\n  ArticleContent,\n  AuthorHeaderItem,\n  DeleteButton,\n  EditButton,\n  FollowPostButton,\n  PostHistoryButton,\n  qetaTranslationRef,\n  RelativeTimeWithTooltip,\n  RestoreButton,\n  useQetaApi,\n  useQetaConfig,\n} from '@drodil/backstage-plugin-qeta-react';\nimport {\n  Alert,\n  Box,\n  Header,\n  HeaderMetadataItem,\n  Skeleton,\n} from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport const ArticlePage = () => {\n  const { id } = useParams();\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const { disabled } = useQetaConfig();\n\n  const [views, setViews] = useState(0);\n\n  const { lastSignal } = useSignal<QetaSignal>(`qeta:post_${id}`);\n\n  const {\n    value: post,\n    loading,\n    error,\n    retry,\n  } = useQetaApi(api => api.getPost(id), [id]);\n\n  useEffect(() => {\n    if (post) {\n      setViews(post.views);\n    }\n  }, [post]);\n\n  useEffect(() => {\n    if (lastSignal?.type === 'post_stats') {\n      setViews(lastSignal.views);\n    }\n  }, [lastSignal]);\n\n  if (disabled.articles) {\n    return null;\n  }\n\n  if (loading) {\n    return <Skeleton width=\"100%\" height={200} />;\n  }\n\n  if (error || post === undefined) {\n    return (\n      <Alert\n        status=\"danger\"\n        title={t('articlePage.errorLoading')}\n        description={error?.message}\n      />\n    );\n  }\n\n  if (post.type !== 'article') {\n    return (\n      <Alert\n        status=\"warning\"\n        title=\"Not found\"\n        description={t('articlePage.notFound')}\n      />\n    );\n  }\n\n  const getMetadata = (q: PostResponse): HeaderMetadataItem[] => {\n    const metadata: HeaderMetadataItem[] = [\n      {\n        label: t('postHeader.postedAtTime'),\n        value: <RelativeTimeWithTooltip value={q.created} />,\n      },\n      {\n        label: t('postHeader.author'),\n        value: <AuthorHeaderItem userEntityRef={q.author} />,\n      },\n    ];\n\n    if (q.updated) {\n      metadata.push({\n        label: t('postHeader.updatedAtTime'),\n        value: <RelativeTimeWithTooltip value={q.updated} />,\n      });\n    }\n    if (q.updatedBy) {\n      metadata.push({\n        label: t('postHeader.updatedBy'),\n        value: <AuthorHeaderItem userEntityRef={q.updatedBy} />,\n      });\n    }\n    metadata.push({\n      label: t('postHeader.views'),\n      value: views,\n    });\n\n    return metadata;\n  };\n\n  return (\n    <>\n      <Header\n        title={post.title}\n        metadata={getMetadata(post)}\n        customActions={\n          <>\n            <EditButton entity={post} compact />\n            <DeleteButton entity={post} compact />\n            <RestoreButton entity={post} compact />\n            <PostHistoryButton post={post} onRestore={retry} />\n            <FollowPostButton post={post} />\n            <AddToCollectionButton post={post} />\n          </>\n        }\n      />\n      <Box>\n        <AIAnswerCard\n          article={post as Article}\n          style={{ marginBottom: '2em' }}\n        />\n        <ArticleContent post={post} views={views} />\n      </Box>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/ArticlesPage/ArticlesPage.esm.js

@@ -1,10 +1,9 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useSearchParams } from 'react-router-dom';
 import { useState, useEffect } from 'react';
-import { qetaTranslationRef, ContentHeader, WriteArticleButton, PostsContainer } from '@drodil/backstage-plugin-qeta-react';
+import { qetaTranslationRef, useQetaConfig, WriteArticleButton, PostsContainer } from '@drodil/backstage-plugin-qeta-react';
 import { filterTags } from '@drodil/backstage-plugin-qeta-common';
-import LibraryBooksOutlined from '@material-ui/icons/LibraryBooksOutlined';
-import { Typography } from '@material-ui/core';
+import { Header } from '@backstage/ui';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 
 const ArticlesPage = () => {
@@ -12,32 +11,20 @@ const ArticlesPage = () => {
   const [entityRef, setEntityRef] = useState(void 0);
   const [tags, setTags] = useState(void 0);
   const { t } = useTranslationRef(qetaTranslationRef);
+  const { disabled } = useQetaConfig();
   useEffect(() => {
     setEntityRef(searchParams.get("entity") ?? void 0);
     setTags(filterTags(searchParams.get("tags")));
   }, [searchParams, setEntityRef]);
+  if (disabled.articles) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
-      ContentHeader,
+      Header,
       {
-        titleComponent: /* @__PURE__ */ jsxs(
-          Typography,
-          {
-            variant: "h4",
-            style: { display: "flex", alignItems: "center" },
-            children: [
-              /* @__PURE__ */ jsx(
-                LibraryBooksOutlined,
-                {
-                  fontSize: "large",
-                  style: { marginRight: "8px" }
-                }
-              ),
-              t("articlesPage.title")
-            ]
-          }
-        ),
-        children: /* @__PURE__ */ jsx(WriteArticleButton, { entity: entityRef, tags })
+        title: t("articlesPage.title"),
+        customActions: /* @__PURE__ */ jsx(WriteArticleButton, { entity: entityRef, tags })
       }
     ),
     /* @__PURE__ */ jsx(PostsContainer, { type: "article", defaultView: "grid" })

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

@@ -1 +1 @@
-{"version":3,"file":"ArticlesPage.esm.js","sources":["../../../src/components/ArticlesPage/ArticlesPage.tsx"],"sourcesContent":["import { useSearchParams } from 'react-router-dom';\nimport { useEffect, useState } from 'react';\nimport {\n  ContentHeader,\n  PostsContainer,\n  qetaTranslationRef,\n  WriteArticleButton,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { filterTags } from '@drodil/backstage-plugin-qeta-common';\nimport LibraryBooksOutlined from '@material-ui/icons/LibraryBooksOutlined';\nimport { Typography } from '@material-ui/core';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport const ArticlesPage = () => {\n  const [searchParams] = useSearchParams();\n\n  const [entityRef, setEntityRef] = useState<string | undefined>(undefined);\n  const [tags, setTags] = useState<string[] | undefined>(undefined);\n  const { t } = useTranslationRef(qetaTranslationRef);\n  useEffect(() => {\n    setEntityRef(searchParams.get('entity') ?? undefined);\n    setTags(filterTags(searchParams.get('tags')));\n  }, [searchParams, setEntityRef]);\n\n  return (\n    <>\n      <ContentHeader\n        titleComponent={\n          <Typography\n            variant=\"h4\"\n            style={{ display: 'flex', alignItems: 'center' }}\n          >\n            <LibraryBooksOutlined\n              fontSize=\"large\"\n              style={{ marginRight: '8px' }}\n            />\n            {t('articlesPage.title')}\n          </Typography>\n        }\n      >\n        <WriteArticleButton entity={entityRef} tags={tags} />\n      </ContentHeader>\n      <PostsContainer type=\"article\" defaultView=\"grid\" />\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAaO,MAAM,eAAe,MAAM;AAChC,EAAA,MAAM,CAAC,YAAY,CAAA,GAAI,eAAA,EAAgB;AAEvC,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAA6B,MAAS,CAAA;AACxE,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAA+B,MAAS,CAAA;AAChE,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,YAAA,CAAa,YAAA,CAAa,GAAA,CAAI,QAAQ,CAAA,IAAK,MAAS,CAAA;AACpD,IAAA,OAAA,CAAQ,UAAA,CAAW,YAAA,CAAa,GAAA,CAAI,MAAM,CAAC,CAAC,CAAA;AAAA,EAC9C,CAAA,EAAG,CAAC,YAAA,EAAc,YAAY,CAAC,CAAA;AAE/B,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,cAAA,kBACE,IAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAQ,IAAA;AAAA,YACR,KAAA,EAAO,EAAE,OAAA,EAAS,MAAA,EAAQ,YAAY,QAAA,EAAS;AAAA,YAE/C,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,oBAAA;AAAA,gBAAA;AAAA,kBACC,QAAA,EAAS,OAAA;AAAA,kBACT,KAAA,EAAO,EAAE,WAAA,EAAa,KAAA;AAAM;AAAA,eAC9B;AAAA,cACC,EAAE,oBAAoB;AAAA;AAAA;AAAA,SACzB;AAAA,QAGF,QAAA,kBAAA,GAAA,CAAC,kBAAA,EAAA,EAAmB,MAAA,EAAQ,SAAA,EAAW,IAAA,EAAY;AAAA;AAAA,KACrD;AAAA,oBACA,GAAA,CAAC,cAAA,EAAA,EAAe,IAAA,EAAK,SAAA,EAAU,aAAY,MAAA,EAAO;AAAA,GAAA,EACpD,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ArticlesPage.esm.js","sources":["../../../src/components/ArticlesPage/ArticlesPage.tsx"],"sourcesContent":["import { useSearchParams } from 'react-router-dom';\nimport { useEffect, useState } from 'react';\nimport {\n  PostsContainer,\n  qetaTranslationRef,\n  useQetaConfig,\n  WriteArticleButton,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { filterTags } from '@drodil/backstage-plugin-qeta-common';\nimport { Header } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport const ArticlesPage = () => {\n  const [searchParams] = useSearchParams();\n\n  const [entityRef, setEntityRef] = useState<string | undefined>(undefined);\n  const [tags, setTags] = useState<string[] | undefined>(undefined);\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const { disabled } = useQetaConfig();\n\n  useEffect(() => {\n    setEntityRef(searchParams.get('entity') ?? undefined);\n    setTags(filterTags(searchParams.get('tags')));\n  }, [searchParams, setEntityRef]);\n\n  if (disabled.articles) {\n    return null;\n  }\n\n  return (\n    <>\n      <Header\n        title={t('articlesPage.title')}\n        customActions={<WriteArticleButton entity={entityRef} tags={tags} />}\n      />\n      <PostsContainer type=\"article\" defaultView=\"grid\" />\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAYO,MAAM,eAAe,MAAM;AAChC,EAAA,MAAM,CAAC,YAAY,CAAA,GAAI,eAAA,EAAgB;AAEvC,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAA6B,MAAS,CAAA;AACxE,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAA+B,MAAS,CAAA;AAChE,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,aAAA,EAAc;AAEnC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,YAAA,CAAa,YAAA,CAAa,GAAA,CAAI,QAAQ,CAAA,IAAK,MAAS,CAAA;AACpD,IAAA,OAAA,CAAQ,UAAA,CAAW,YAAA,CAAa,GAAA,CAAI,MAAM,CAAC,CAAC,CAAA;AAAA,EAC9C,CAAA,EAAG,CAAC,YAAA,EAAc,YAAY,CAAC,CAAA;AAE/B,EAAA,IAAI,SAAS,QAAA,EAAU;AACrB,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,EAAE,oBAAoB,CAAA;AAAA,QAC7B,aAAA,kBAAe,GAAA,CAAC,kBAAA,EAAA,EAAmB,MAAA,EAAQ,WAAW,IAAA,EAAY;AAAA;AAAA,KACpE;AAAA,oBACA,GAAA,CAAC,cAAA,EAAA,EAAe,IAAA,EAAK,SAAA,EAAU,aAAY,MAAA,EAAO;AAAA,GAAA,EACpD,CAAA;AAEJ;;;;"}

package/dist/components/AskPage/AskPage.esm.js

@@ -1,17 +1,17 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Progress, InfoCard } from '@backstage/core-components';
 import { useState, useEffect } from 'react';
 import { stringifyEntityRef } from '@backstage/catalog-model';
-import { useAI, useQetaApi, useQetaContext, qetaTranslationRef, SelectTemplateList, ContentHeader, PostForm, AIAnswerCard } from '@drodil/backstage-plugin-qeta-react';
+import { useQetaConfig, useAI, useQetaApi, useQetaContext, qetaTranslationRef, SelectTemplateList, PostForm, AIAnswerCard } from '@drodil/backstage-plugin-qeta-react';
 import { useParams, useSearchParams } from 'react-router-dom';
 import { useEntityPresentation } from '@backstage/plugin-catalog-react';
 import { filterTags } from '@drodil/backstage-plugin-qeta-common';
-import { Box, Grid } from '@material-ui/core';
+import { Box, Skeleton, Header } from '@backstage/ui';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 
 const AskPage = () => {
   const { id } = useParams();
   const [searchParams] = useSearchParams();
+  const { disabled } = useQetaConfig();
   const { isNewQuestionsEnabled } = useAI();
   const { value, loading } = useQetaApi((api) => api.getTemplates());
   const [draft, setDraft] = useState(void 0);
@@ -41,8 +41,11 @@ const AskPage = () => {
   } else {
     title = t("askPage.title.newQuestion");
   }
+  if (disabled.questions) {
+    return null;
+  }
   if (loading) {
-    return /* @__PURE__ */ jsx(Box, { role: "status", "aria-label": t("common.loading"), children: /* @__PURE__ */ jsx(Progress, {}) });
+    return /* @__PURE__ */ jsx(Box, { role: "status", "aria-label": t("common.loading"), children: /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: 200 }) });
   }
   if (!id && value && value.templates && value.total > 0 && template === void 0) {
     return /* @__PURE__ */ jsx(Box, { role: "region", "aria-label": t("askPage.templateSelection"), children: /* @__PURE__ */ jsx(
@@ -72,8 +75,8 @@ const AskPage = () => {
     });
   };
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(ContentHeader, { title }),
-    /* @__PURE__ */ jsx(Grid, { container: true, spacing: 3, direction: "column", children: /* @__PURE__ */ jsx(Grid, { item: true, style: { width: "100%" }, children: /* @__PURE__ */ jsxs(InfoCard, { children: [
+    /* @__PURE__ */ jsx(Header, { title }),
+    /* @__PURE__ */ jsxs(Box, { children: [
       /* @__PURE__ */ jsx(
         PostForm,
         {
@@ -90,7 +93,7 @@ const AskPage = () => {
         }
       ),
       /* @__PURE__ */ jsx(AIAnswerCard, { draft })
-    ] }) }) })
+    ] })
   ] });
 };
 

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

@@ -1 +1 @@
-{"version":3,"file":"AskPage.esm.js","sources":["../../../src/components/AskPage/AskPage.tsx"],"sourcesContent":["import { InfoCard, Progress } from '@backstage/core-components';\nimport { useEffect, useState } from 'react';\nimport { stringifyEntityRef } from '@backstage/catalog-model';\nimport {\n  AIAnswerCard,\n  ContentHeader,\n  PostForm,\n  qetaTranslationRef,\n  QuestionFormValues,\n  SelectTemplateList,\n  useAI,\n  useQetaApi,\n  useQetaContext,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { useParams, useSearchParams } from 'react-router-dom';\nimport { useEntityPresentation } from '@backstage/plugin-catalog-react';\nimport { filterTags, Template } from '@drodil/backstage-plugin-qeta-common';\nimport { Box, Grid } from '@material-ui/core';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport const AskPage = () => {\n  const { id } = useParams();\n  const [searchParams] = useSearchParams();\n  const { isNewQuestionsEnabled } = useAI();\n  const { value, loading } = useQetaApi(api => api.getTemplates());\n  const [draft, setDraft] = useState<\n    { title: string; content: string } | undefined\n  >(undefined);\n  const { setDraftQuestion } = useQetaContext();\n\n  useEffect(() => {\n    return () => {\n      setDraftQuestion?.(undefined);\n    };\n  }, [setDraftQuestion]);\n\n  const [template, setTemplate] = useState<Template | null | undefined>(\n    undefined,\n  );\n\n  const entity = searchParams.get('entity') ?? undefined;\n  const entityPage = searchParams.get('entityPage') === 'true';\n  const questionTitle = searchParams.get('title') ?? undefined;\n  const content = searchParams.get('content') ?? undefined;\n  const tags = filterTags(searchParams.get('tags'));\n  const { t } = useTranslationRef(qetaTranslationRef);\n  let title;\n  if (id) {\n    title = t('askPage.title.existingQuestion');\n  } else if (entity) {\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const representation = useEntityPresentation(entity);\n    title = t('askPage.title.entityQuestion', {\n      entity: representation.primaryTitle,\n    });\n  } else {\n    title = t('askPage.title.newQuestion');\n  }\n\n  if (loading) {\n    return (\n      <Box role=\"status\" aria-label={t('common.loading')}>\n        <Progress />\n      </Box>\n    );\n  }\n\n  if (\n    !id &&\n    value &&\n    value.templates &&\n    value.total > 0 &&\n    template === undefined\n  ) {\n    return (\n      <Box role=\"region\" aria-label={t('askPage.templateSelection')}>\n        <SelectTemplateList\n          templates={value}\n          onTemplateSelect={temp => setTemplate(temp)}\n          aria-label={t('askPage.selectTemplate')}\n        />\n      </Box>\n    );\n  }\n\n  const handleFormChange = (data: QuestionFormValues) => {\n    if (setDraftQuestion) {\n      setDraftQuestion({\n        title: data.title,\n        content: data.content,\n        tags: data.tags,\n        entities: data.entities?.map(stringifyEntityRef),\n      });\n    }\n    if (!isNewQuestionsEnabled) {\n      return;\n    }\n    setDraft({\n      title: data.title,\n      content: data.content,\n    });\n  };\n\n  return (\n    <>\n      <ContentHeader title={title} />\n      <Grid container spacing={3} direction=\"column\">\n        <Grid item style={{ width: '100%' }}>\n          <InfoCard>\n            <PostForm\n              id={id}\n              entity={entity}\n              entityPage={entityPage}\n              tags={tags}\n              type=\"question\"\n              template={template}\n              onFormChange={handleFormChange}\n              aria-label={t('askPage.questionForm')}\n              title={questionTitle}\n              content={content}\n            />\n            <AIAnswerCard draft={draft} />\n          </InfoCard>\n        </Grid>\n      </Grid>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"AskPage.esm.js","sources":["../../../src/components/AskPage/AskPage.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { stringifyEntityRef } from '@backstage/catalog-model';\nimport {\n  AIAnswerCard,\n  PostForm,\n  qetaTranslationRef,\n  QuestionFormValues,\n  SelectTemplateList,\n  useAI,\n  useQetaApi,\n  useQetaConfig,\n  useQetaContext,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { useParams, useSearchParams } from 'react-router-dom';\nimport { useEntityPresentation } from '@backstage/plugin-catalog-react';\nimport { filterTags, Template } from '@drodil/backstage-plugin-qeta-common';\nimport { Box, Header, Skeleton } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport const AskPage = () => {\n  const { id } = useParams();\n  const [searchParams] = useSearchParams();\n  const { disabled } = useQetaConfig();\n  const { isNewQuestionsEnabled } = useAI();\n  const { value, loading } = useQetaApi(api => api.getTemplates());\n  const [draft, setDraft] = useState<\n    { title: string; content: string } | undefined\n  >(undefined);\n  const { setDraftQuestion } = useQetaContext();\n\n  useEffect(() => {\n    return () => {\n      setDraftQuestion?.(undefined);\n    };\n  }, [setDraftQuestion]);\n\n  const [template, setTemplate] = useState<Template | null | undefined>(\n    undefined,\n  );\n\n  const entity = searchParams.get('entity') ?? undefined;\n  const entityPage = searchParams.get('entityPage') === 'true';\n  const questionTitle = searchParams.get('title') ?? undefined;\n  const content = searchParams.get('content') ?? undefined;\n  const tags = filterTags(searchParams.get('tags'));\n  const { t } = useTranslationRef(qetaTranslationRef);\n  let title;\n  if (id) {\n    title = t('askPage.title.existingQuestion');\n  } else if (entity) {\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const representation = useEntityPresentation(entity);\n    title = t('askPage.title.entityQuestion', {\n      entity: representation.primaryTitle,\n    });\n  } else {\n    title = t('askPage.title.newQuestion');\n  }\n\n  if (disabled.questions) {\n    return null;\n  }\n\n  if (loading) {\n    return (\n      <Box role=\"status\" aria-label={t('common.loading')}>\n        <Skeleton width=\"100%\" height={200} />\n      </Box>\n    );\n  }\n\n  if (\n    !id &&\n    value &&\n    value.templates &&\n    value.total > 0 &&\n    template === undefined\n  ) {\n    return (\n      <Box role=\"region\" aria-label={t('askPage.templateSelection')}>\n        <SelectTemplateList\n          templates={value}\n          onTemplateSelect={temp => setTemplate(temp)}\n          aria-label={t('askPage.selectTemplate')}\n        />\n      </Box>\n    );\n  }\n\n  const handleFormChange = (data: QuestionFormValues) => {\n    if (setDraftQuestion) {\n      setDraftQuestion({\n        title: data.title,\n        content: data.content,\n        tags: data.tags,\n        entities: data.entities?.map(stringifyEntityRef),\n      });\n    }\n    if (!isNewQuestionsEnabled) {\n      return;\n    }\n    setDraft({\n      title: data.title,\n      content: data.content,\n    });\n  };\n\n  return (\n    <>\n      <Header title={title} />\n      <Box>\n        <PostForm\n          id={id}\n          entity={entity}\n          entityPage={entityPage}\n          tags={tags}\n          type=\"question\"\n          template={template}\n          onFormChange={handleFormChange}\n          aria-label={t('askPage.questionForm')}\n          title={questionTitle}\n          content={content}\n        />\n        <AIAnswerCard draft={draft} />\n      </Box>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/CollectionCreatePage/CollectionCreatePage.esm.js

@@ -1,13 +1,16 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useParams } from 'react-router-dom';
-import { ContentHeader, InfoCard } from '@backstage/core-components';
-import { qetaTranslationRef, CollectionForm } from '@drodil/backstage-plugin-qeta-react';
-import { Grid } from '@material-ui/core';
+import { qetaTranslationRef, useQetaConfig, CollectionForm } from '@drodil/backstage-plugin-qeta-react';
+import { Header, Box } from '@backstage/ui';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 
 const CollectionCreatePage = () => {
   const { id } = useParams();
   const { t } = useTranslationRef(qetaTranslationRef);
+  const { disabled } = useQetaConfig();
+  if (disabled.collections) {
+    return null;
+  }
   let title;
   if (id) {
     title = t("collectionCreatePage.title.existingCollection");
@@ -15,8 +18,8 @@ const CollectionCreatePage = () => {
     title = t("collectionCreatePage.title.newCollection");
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(ContentHeader, { title }),
-    /* @__PURE__ */ jsx(Grid, { container: true, spacing: 3, direction: "column", children: /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(InfoCard, { children: /* @__PURE__ */ jsx(CollectionForm, { id }) }) }) })
+    /* @__PURE__ */ jsx(Header, { title }),
+    /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(CollectionForm, { id }) })
   ] });
 };
 

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

@@ -1 +1 @@
-{"version":3,"file":"CollectionCreatePage.esm.js","sources":["../../../src/components/CollectionCreatePage/CollectionCreatePage.tsx"],"sourcesContent":["import { useParams } from 'react-router-dom';\nimport { ContentHeader, InfoCard } from '@backstage/core-components';\nimport {\n  CollectionForm,\n  qetaTranslationRef,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { Grid } from '@material-ui/core';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport const CollectionCreatePage = () => {\n  const { id } = useParams();\n  const { t } = useTranslationRef(qetaTranslationRef);\n\n  let title;\n  if (id) {\n    title = t('collectionCreatePage.title.existingCollection');\n  } else {\n    title = t('collectionCreatePage.title.newCollection');\n  }\n  return (\n    <>\n      <ContentHeader title={title} />\n      <Grid container spacing={3} direction=\"column\">\n        <Grid item>\n          <InfoCard>\n            <CollectionForm id={id} />\n          </InfoCard>\n        </Grid>\n      </Grid>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AASO,MAAM,uBAAuB,MAAM;AACxC,EAAA,MAAM,EAAE,EAAA,EAAG,GAAI,SAAA,EAAU;AACzB,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,kBAAkB,CAAA;AAElD,EAAA,IAAI,KAAA;AACJ,EAAA,IAAI,EAAA,EAAI;AACN,IAAA,KAAA,GAAQ,EAAE,+CAA+C,CAAA;AAAA,EAC3D,CAAA,MAAO;AACL,IAAA,KAAA,GAAQ,EAAE,0CAA0C,CAAA;AAAA,EACtD;AACA,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,iBAAc,KAAA,EAAc,CAAA;AAAA,wBAC5B,IAAA,EAAA,EAAK,SAAA,EAAS,MAAC,OAAA,EAAS,CAAA,EAAG,WAAU,QAAA,EACpC,QAAA,kBAAA,GAAA,CAAC,QAAK,IAAA,EAAI,IAAA,EACR,8BAAC,QAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,kBAAe,EAAA,EAAQ,CAAA,EAC1B,GACF,CAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"CollectionCreatePage.esm.js","sources":["../../../src/components/CollectionCreatePage/CollectionCreatePage.tsx"],"sourcesContent":["import { useParams } from 'react-router-dom';\nimport {\n  CollectionForm,\n  qetaTranslationRef,\n  useQetaConfig,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { Box, Header } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport const CollectionCreatePage = () => {\n  const { id } = useParams();\n  const { t } = useTranslationRef(qetaTranslationRef);\n  const { disabled } = useQetaConfig();\n\n  if (disabled.collections) {\n    return null;\n  }\n\n  let title;\n  if (id) {\n    title = t('collectionCreatePage.title.existingCollection');\n  } else {\n    title = t('collectionCreatePage.title.newCollection');\n  }\n  return (\n    <>\n      <Header title={title} />\n      <Box>\n        <CollectionForm id={id} />\n      </Box>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;AASO,MAAM,uBAAuB,MAAM;AACxC,EAAA,MAAM,EAAE,EAAA,EAAG,GAAI,SAAA,EAAU;AACzB,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,aAAA,EAAc;AAEnC,EAAA,IAAI,SAAS,WAAA,EAAa;AACxB,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,IAAI,KAAA;AACJ,EAAA,IAAI,EAAA,EAAI;AACN,IAAA,KAAA,GAAQ,EAAE,+CAA+C,CAAA;AAAA,EAC3D,CAAA,MAAO;AACL,IAAA,KAAA,GAAQ,EAAE,0CAA0C,CAAA;AAAA,EACtD;AACA,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,UAAO,KAAA,EAAc,CAAA;AAAA,oBACtB,GAAA,CAAC,GAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EAAe,IAAQ,CAAA,EAC1B;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/CollectionPage/CollectionPage.esm.js

@@ -1,97 +1,65 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { useParams, useNavigate } from 'react-router-dom';
-import { qetaTranslationRef, collectionEditRouteRef, useQetaApi, ContentHeader, CollectionFollowButton, ContentHeaderCard, PostsContainer, DeleteModal } from '@drodil/backstage-plugin-qeta-react';
-import { Skeleton } from '@material-ui/lab';
-import { WarningPanel } from '@backstage/core-components';
-import { Typography, Button, Grid } from '@material-ui/core';
+import { useParams } from 'react-router-dom';
+import { qetaTranslationRef, useQetaConfig, useQetaApi, EditButton, DeleteButton, CollectionFollowButton, TagsAndEntities, PostsContainer } from '@drodil/backstage-plugin-qeta-react';
+import { Skeleton, Alert, Header, Grid, Box } from '@backstage/ui';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
-import { useState } from 'react';
-import EditIcon from '@material-ui/icons/Edit';
-import DeleteIcon from '@material-ui/icons/Delete';
-import PlaylistPlayIcon from '@material-ui/icons/PlaylistPlay';
-import QuestionAnswerIcon from '@material-ui/icons/QuestionAnswer';
-import PeopleIcon from '@material-ui/icons/People';
-import { useRouteRef } from '@backstage/core-plugin-api';
+import { EntityRefLink } from '@backstage/plugin-catalog-react';
 
 const CollectionPage = () => {
   const { id } = useParams();
   const { t } = useTranslationRef(qetaTranslationRef);
-  const navigate = useNavigate();
-  const editCollectionRoute = useRouteRef(collectionEditRouteRef);
-  const [deleteModalOpen, setDeleteModalOpen] = useState(false);
-  const handleDeleteModalOpen = () => setDeleteModalOpen(true);
-  const handleDeleteModalClose = () => setDeleteModalOpen(false);
+  const { disabled } = useQetaConfig();
   const {
     value: collection,
     loading,
     error
   } = useQetaApi((api) => api.getCollection(id), [id]);
+  if (disabled.collections) {
+    return null;
+  }
   if (loading) {
-    return /* @__PURE__ */ jsx(Skeleton, { variant: "rect", height: 200 });
+    return /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: 200 });
   }
   if (error || collection === void 0) {
-    return /* @__PURE__ */ jsx(WarningPanel, { severity: "error", title: t("questionPage.errorLoading", {}), children: error?.message });
+    return /* @__PURE__ */ jsx(
+      Alert,
+      {
+        status: "danger",
+        title: t("questionPage.errorLoading", {}),
+        description: error?.message
+      }
+    );
   }
-  const title = /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center" }, children: [
-    /* @__PURE__ */ jsx(PlaylistPlayIcon, { fontSize: "large", style: { marginRight: "8px" } }),
-    /* @__PURE__ */ jsx(Typography, { variant: "h5", component: "h2", children: collection.title })
-  ] });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(ContentHeader, { titleComponent: title, children: [
-      /* @__PURE__ */ jsx(CollectionFollowButton, { collection }),
-      collection.canEdit && /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: "contained",
-          color: "primary",
-          startIcon: /* @__PURE__ */ jsx(EditIcon, {}),
-          onClick: () => editCollectionRoute && navigate(
-            editCollectionRoute({
-              id: collection.id.toString(10)
-            })
-          ),
-          children: t("templateList.editButton", {})
-        }
-      ),
-      collection.canDelete && /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: "outlined",
-          color: "secondary",
-          startIcon: /* @__PURE__ */ jsx(DeleteIcon, {}),
-          onClick: handleDeleteModalOpen,
-          children: t("templateList.deleteButton", {})
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs(Grid, { container: true, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
-        ContentHeaderCard,
-        {
-          description: collection.description,
-          image: collection.headerImage,
-          imageIcon: /* @__PURE__ */ jsx(PlaylistPlayIcon, { style: { fontSize: 80 } }),
-          tagsAndEntities: { entity: collection },
-          stats: [
-            {
-              label: t("common.postsLabel", {
-                count: collection.postsCount,
-                itemType: "post"
-              }),
-              value: collection.postsCount,
-              icon: /* @__PURE__ */ jsx(QuestionAnswerIcon, { fontSize: "small" })
-            },
-            {
-              label: t("common.followersLabel", {
-                count: collection.followers
-              }),
-              value: collection.followers,
-              icon: /* @__PURE__ */ jsx(PeopleIcon, { fontSize: "small" })
-            }
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(
+      Header,
+      {
+        title: collection.title,
+        description: collection.description,
+        metadata: [
+          {
+            label: t("metadata.posts"),
+            value: collection.postsCount
+          },
+          {
+            label: t("metadata.followers"),
+            value: collection.followers
+          },
+          {
+            label: t("metadata.owner"),
+            value: /* @__PURE__ */ jsx(EntityRefLink, { entityRef: collection.owner })
+          }
+        ],
+        customActions: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(EditButton, { entity: collection, compact: true }),
+          /* @__PURE__ */ jsx(DeleteButton, { entity: collection, compact: true }),
+          /* @__PURE__ */ jsx(CollectionFollowButton, { collection })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxs(Grid.Root, { columns: { sm: "12" }, gap: "6", children: [
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: { sm: "12" }, children: /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(TagsAndEntities, { entity: collection }) }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { colSpan: { sm: "12" }, children: /* @__PURE__ */ jsx(
         PostsContainer,
         {
           collectionId: collection.id,
@@ -101,15 +69,7 @@ const CollectionPage = () => {
           prefix: "collection-posts"
         }
       ) })
-    ] }),
-    collection.canDelete && /* @__PURE__ */ jsx(
-      DeleteModal,
-      {
-        open: deleteModalOpen,
-        onClose: handleDeleteModalClose,
-        entity: collection
-      }
-    )
+    ] })
   ] });
 };