@drodil/backstage-plugin-qeta 2.5.3 → 2.7.0

package/dist/components/HomePage/HomePage.esm.js

@@ -9,7 +9,7 @@ import { TagPage } from '../TagPage/TagPage.esm.js';
 import { UserPage } from '../UserPage/UserPage.esm.js';
 import LoyaltyOutlined from '@material-ui/icons/LoyaltyOutlined';
 import { QuestionHighlightList } from '../QuestionHighlightList/QuestionHighlightList.esm.js';
-import { useStyles, useIdentityApi } from '../../utils/hooks.esm.js';
+import { useTranslation, useStyles, useIdentityApi } from '../../utils/hooks.esm.js';
 import Whatshot from '@material-ui/icons/Whatshot';
 import MoreVertIcon from '@material-ui/icons/MoreVert';
 import StarIcon from '@material-ui/icons/Star';
@@ -32,6 +32,7 @@ const MoreMenu = () => {
   const userRoute = useRouteRef(userRouteRef);
   const open = Boolean(anchorEl);
   const styles = useStyles();
+  const { t } = useTranslation();
   const {
     value: user,
     loading: loadingUser,
@@ -43,7 +44,7 @@ const MoreMenu = () => {
   const handleMenuClose = () => {
     setAnchorEl(null);
   };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Tooltip, { arrow: true, title: "More" }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Tooltip, { arrow: true, title: t("homePage.moreMenu.title") }, /* @__PURE__ */ React.createElement(
     IconButton,
     {
       "aria-label": "more",
@@ -70,10 +71,10 @@ const MoreMenu = () => {
       },
       onClose: handleMenuClose
     },
-    user && !loadingUser && !userError && /* @__PURE__ */ React.createElement(MenuItem, { component: "a", href: `${userRoute()}/${user.userEntityRef}` }, /* @__PURE__ */ React.createElement(ListItemIcon, { className: styles.menuIcon }, /* @__PURE__ */ React.createElement(AccountBox, { fontSize: "small" })), "Profile"),
-    /* @__PURE__ */ React.createElement(MenuItem, { component: "a", href: tagsRoute() }, /* @__PURE__ */ React.createElement(ListItemIcon, { className: styles.menuIcon }, /* @__PURE__ */ React.createElement(LoyaltyOutlined, { fontSize: "small" })), "Tags"),
-    /* @__PURE__ */ React.createElement(MenuItem, { component: "a", href: favoritesRoute() }, /* @__PURE__ */ React.createElement(ListItemIcon, { className: styles.menuIcon }, /* @__PURE__ */ React.createElement(StarIcon, { fontSize: "small" })), "Favorite questions"),
-    /* @__PURE__ */ React.createElement(MenuItem, { component: "a", href: statisticsRoute() }, /* @__PURE__ */ React.createElement(ListItemIcon, { className: styles.menuIcon }, /* @__PURE__ */ React.createElement(TrophyIcon, null)), "Statistics")
+    user && !loadingUser && !userError && /* @__PURE__ */ React.createElement(MenuItem, { component: "a", href: `${userRoute()}/${user.userEntityRef}` }, /* @__PURE__ */ React.createElement(ListItemIcon, { className: styles.menuIcon }, /* @__PURE__ */ React.createElement(AccountBox, { fontSize: "small" })), t("homePage.moreMenu.profile")),
+    /* @__PURE__ */ React.createElement(MenuItem, { component: "a", href: tagsRoute() }, /* @__PURE__ */ React.createElement(ListItemIcon, { className: styles.menuIcon }, /* @__PURE__ */ React.createElement(LoyaltyOutlined, { fontSize: "small" })), t("homePage.moreMenu.tags")),
+    /* @__PURE__ */ React.createElement(MenuItem, { component: "a", href: favoritesRoute() }, /* @__PURE__ */ React.createElement(ListItemIcon, { className: styles.menuIcon }, /* @__PURE__ */ React.createElement(StarIcon, { fontSize: "small" })), t("homePage.moreMenu.favoriteQuestions")),
+    /* @__PURE__ */ React.createElement(MenuItem, { component: "a", href: statisticsRoute() }, /* @__PURE__ */ React.createElement(ListItemIcon, { className: styles.menuIcon }, /* @__PURE__ */ React.createElement(TrophyIcon, null)), t("homePage.moreMenu.statistics"))
   ));
 };
 const HomePageContent = () => {
@@ -82,31 +83,36 @@ const HomePageContent = () => {
     void 0
   );
   const [tags, setTags] = React.useState(void 0);
+  const { t } = useTranslation();
   useEffect(() => {
     setEntityRef(searchParams.get("entity") ?? void 0);
     setTags(filterTags(searchParams.get("tags")));
   }, [searchParams, setEntityRef]);
-  return /* @__PURE__ */ React.createElement(Content, { className: "qetaHomePage" }, /* @__PURE__ */ React.createElement(Container, { maxWidth: "lg" }, /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 3 }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, lg: 9, xl: 10 }, /* @__PURE__ */ React.createElement(ContentHeader, { title: "All questions" }, /* @__PURE__ */ React.createElement(MoreMenu, null), /* @__PURE__ */ React.createElement(AskQuestionButton, { entity: entityRef, tags })), /* @__PURE__ */ React.createElement(QuestionsContainer, { entity: entityRef, tags })), /* @__PURE__ */ React.createElement(Grid, { item: true, lg: 3, xl: 2 }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(Content, { className: "qetaHomePage" }, /* @__PURE__ */ React.createElement(Container, { maxWidth: "lg" }, /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 3 }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, lg: 9, xl: 10 }, /* @__PURE__ */ React.createElement(ContentHeader, { title: t("homePage.title") }, /* @__PURE__ */ React.createElement(MoreMenu, null), /* @__PURE__ */ React.createElement(AskQuestionButton, { entity: entityRef, tags })), /* @__PURE__ */ React.createElement(QuestionsContainer, { entity: entityRef, tags })), /* @__PURE__ */ React.createElement(Grid, { item: true, lg: 3, xl: 2 }, /* @__PURE__ */ React.createElement(
     QuestionHighlightList,
     {
       type: "hot",
-      title: "Hot questions",
-      noQuestionsLabel: "No questions",
+      title: t("homePage.highlights.hot.title"),
+      noQuestionsLabel: t("homePage.highlights.hot.noQuestionsLabel"),
       icon: /* @__PURE__ */ React.createElement(Whatshot, { fontSize: "small" })
     }
   ), /* @__PURE__ */ React.createElement(
     QuestionHighlightList,
     {
       type: "unanswered",
-      title: "Unanswered questions",
-      noQuestionsLabel: "No unanswered questions"
+      title: t("homePage.highlights.unanswered.title"),
+      noQuestionsLabel: t(
+        "homePage.highlights.unanswered.noQuestionsLabel"
+      )
     }
   ), /* @__PURE__ */ React.createElement(
     QuestionHighlightList,
     {
       type: "incorrect",
-      title: "Questions without correct answer",
-      noQuestionsLabel: "No questions without correct answers"
+      title: t("homePage.highlights.incorrect.title"),
+      noQuestionsLabel: t(
+        "homePage.highlights.incorrect.noQuestionsLabel"
+      )
     }
   )))));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"HomePage.esm.js","sources":["../../../src/components/HomePage/HomePage.tsx"],"sourcesContent":["import React, { ReactNode, useEffect } from 'react';\nimport {\n  Container,\n  Grid,\n  IconButton,\n  ListItemIcon,\n  Menu,\n  MenuItem,\n  Tooltip,\n} from '@material-ui/core';\nimport {\n  Content,\n  ContentHeader,\n  Header,\n  Page,\n} from '@backstage/core-components';\nimport { Route, Routes, useSearchParams } from 'react-router-dom';\nimport { AskPage } from '../AskPage';\nimport { QuestionPage } from '../QuestionPage/QuestionPage';\nimport { QuestionsContainer } from '../QuestionsContainer/QuestionsContainer';\nimport { TagPage } from '../TagPage/TagPage';\nimport { UserPage } from '../UserPage/UserPage';\nimport LoyaltyOutlined from '@material-ui/icons/LoyaltyOutlined';\nimport { QuestionHighlightList } from '../QuestionHighlightList/QuestionHighlightList';\nimport { useIdentityApi, useStyles } from '../../utils/hooks';\nimport Whatshot from '@material-ui/icons/Whatshot';\nimport MoreVertIcon from '@material-ui/icons/MoreVert';\nimport StarIcon from '@material-ui/icons/Star';\nimport { FavoritePage } from '../FavoritePage/FavoritePage';\nimport { AskQuestionButton } from '../Buttons/AskQuestionButton';\nimport { StatisticsPage, TrophyIcon } from '../Statistics';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport {\n  askRouteRef,\n  editQuestionRouteRef,\n  favoriteQuestionsRouteRef,\n  questionRouteRef,\n  statisticsRouteRef,\n  tagRouteRef,\n  tagsRouteRef,\n  userRouteRef,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { filterTags } from '@drodil/backstage-plugin-qeta-common';\nimport AccountBox from '@material-ui/icons/AccountBox';\n\nconst MoreMenu = () => {\n  const [anchorEl, setAnchorEl] = React.useState(null);\n  const tagsRoute = useRouteRef(tagsRouteRef);\n  const favoritesRoute = useRouteRef(favoriteQuestionsRouteRef);\n  const statisticsRoute = useRouteRef(statisticsRouteRef);\n  const userRoute = useRouteRef(userRouteRef);\n  const open = Boolean(anchorEl);\n  const styles = useStyles();\n  const {\n    value: user,\n    loading: loadingUser,\n    error: userError,\n  } = useIdentityApi(api => api.getBackstageIdentity(), []);\n\n  const handleMenuOpen = (event: any) => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handleMenuClose = () => {\n    setAnchorEl(null);\n  };\n\n  return (\n    <>\n      <Tooltip arrow title=\"More\">\n        <IconButton\n          aria-label=\"more\"\n          aria-controls=\"long-menu\"\n          aria-haspopup=\"true\"\n          onClick={handleMenuOpen}\n        >\n          <MoreVertIcon />\n        </IconButton>\n      </Tooltip>\n      <Menu\n        id=\"long-menu\"\n        anchorEl={anchorEl}\n        keepMounted\n        open={open}\n        getContentAnchorEl={null}\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'center',\n        }}\n        transformOrigin={{\n          vertical: 'top',\n          horizontal: 'center',\n        }}\n        onClose={handleMenuClose}\n      >\n        {user && !loadingUser && !userError && (\n          <MenuItem component=\"a\" href={`${userRoute()}/${user.userEntityRef}`}>\n            <ListItemIcon className={styles.menuIcon}>\n              <AccountBox fontSize=\"small\" />\n            </ListItemIcon>\n            Profile\n          </MenuItem>\n        )}\n        <MenuItem component=\"a\" href={tagsRoute()}>\n          <ListItemIcon className={styles.menuIcon}>\n            <LoyaltyOutlined fontSize=\"small\" />\n          </ListItemIcon>\n          Tags\n        </MenuItem>\n        <MenuItem component=\"a\" href={favoritesRoute()}>\n          <ListItemIcon className={styles.menuIcon}>\n            <StarIcon fontSize=\"small\" />\n          </ListItemIcon>\n          Favorite questions\n        </MenuItem>\n        <MenuItem component=\"a\" href={statisticsRoute()}>\n          <ListItemIcon className={styles.menuIcon}>\n            <TrophyIcon />\n          </ListItemIcon>\n          Statistics\n        </MenuItem>\n      </Menu>\n    </>\n  );\n};\n\nexport const HomePageContent = () => {\n  const [searchParams] = useSearchParams();\n  const [entityRef, setEntityRef] = React.useState<string | undefined>(\n    undefined,\n  );\n  const [tags, setTags] = React.useState<string[] | undefined>(undefined);\n  useEffect(() => {\n    setEntityRef(searchParams.get('entity') ?? undefined);\n    setTags(filterTags(searchParams.get('tags')));\n  }, [searchParams, setEntityRef]);\n\n  return (\n    <Content className=\"qetaHomePage\">\n      <Container maxWidth=\"lg\">\n        <Grid container spacing={3}>\n          <Grid item xs={12} lg={9} xl={10}>\n            <ContentHeader title=\"All questions\">\n              <MoreMenu />\n              <AskQuestionButton entity={entityRef} tags={tags} />\n            </ContentHeader>\n            <QuestionsContainer entity={entityRef} tags={tags} />\n          </Grid>\n          <Grid item lg={3} xl={2}>\n            <QuestionHighlightList\n              type=\"hot\"\n              title=\"Hot questions\"\n              noQuestionsLabel=\"No questions\"\n              icon={<Whatshot fontSize=\"small\" />}\n            />\n            <QuestionHighlightList\n              type=\"unanswered\"\n              title=\"Unanswered questions\"\n              noQuestionsLabel=\"No unanswered questions\"\n            />\n            <QuestionHighlightList\n              type=\"incorrect\"\n              title=\"Questions without correct answer\"\n              noQuestionsLabel=\"No questions without correct answers\"\n            />\n          </Grid>\n        </Grid>\n      </Container>\n    </Content>\n  );\n};\n\ntype Props = {\n  title?: string;\n  subtitle?: string;\n  headerElements?: ReactNode[];\n  themeId?: string;\n  headerTooltip?: string;\n  headerType?: string;\n  headerTypeLink?: string;\n};\n\nexport const HomePage = (props?: Props) => {\n  const {\n    title = 'Q&A',\n    subtitle,\n    headerElements,\n    themeId = 'tool',\n    headerTooltip,\n    headerType,\n    headerTypeLink,\n  } = props ?? {};\n\n  return (\n    <Page themeId={themeId}>\n      <Header\n        title={title}\n        subtitle={subtitle}\n        type={headerType}\n        typeLink={headerTypeLink}\n        tooltip={headerTooltip}\n      >\n        {headerElements}\n      </Header>\n      <Routes>\n        <Route path=\"/\" element={<HomePageContent />} />\n        <Route path={askRouteRef.path} element={<AskPage />} />\n        <Route\n          path={favoriteQuestionsRouteRef.path}\n          element={<FavoritePage />}\n        />\n        <Route path={editQuestionRouteRef.path} element={<AskPage />} />\n        <Route path={questionRouteRef.path} element={<QuestionPage />} />\n        <Route path={tagsRouteRef.path} element={<TagPage />} />\n        <Route path={tagRouteRef.path} element={<TagPage />} />\n        <Route path={userRouteRef.path} element={<UserPage />} />\n        <Route path={statisticsRouteRef.path} element={<StatisticsPage />} />\n      </Routes>\n    </Page>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"HomePage.esm.js","sources":["../../../src/components/HomePage/HomePage.tsx"],"sourcesContent":["import React, { ReactNode, useEffect } from 'react';\nimport {\n  Container,\n  Grid,\n  IconButton,\n  ListItemIcon,\n  Menu,\n  MenuItem,\n  Tooltip,\n} from '@material-ui/core';\nimport {\n  Content,\n  ContentHeader,\n  Header,\n  Page,\n} from '@backstage/core-components';\nimport { Route, Routes, useSearchParams } from 'react-router-dom';\nimport { AskPage } from '../AskPage';\nimport { QuestionPage } from '../QuestionPage/QuestionPage';\nimport { QuestionsContainer } from '../QuestionsContainer/QuestionsContainer';\nimport { TagPage } from '../TagPage/TagPage';\nimport { UserPage } from '../UserPage/UserPage';\nimport LoyaltyOutlined from '@material-ui/icons/LoyaltyOutlined';\nimport { QuestionHighlightList } from '../QuestionHighlightList/QuestionHighlightList';\nimport { useIdentityApi, useStyles, useTranslation } from '../../utils/hooks';\nimport Whatshot from '@material-ui/icons/Whatshot';\nimport MoreVertIcon from '@material-ui/icons/MoreVert';\nimport StarIcon from '@material-ui/icons/Star';\nimport { FavoritePage } from '../FavoritePage/FavoritePage';\nimport { AskQuestionButton } from '../Buttons/AskQuestionButton';\nimport { StatisticsPage, TrophyIcon } from '../Statistics';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport {\n  askRouteRef,\n  editQuestionRouteRef,\n  favoriteQuestionsRouteRef,\n  questionRouteRef,\n  statisticsRouteRef,\n  tagRouteRef,\n  tagsRouteRef,\n  userRouteRef,\n} from '@drodil/backstage-plugin-qeta-react';\nimport { filterTags } from '@drodil/backstage-plugin-qeta-common';\nimport AccountBox from '@material-ui/icons/AccountBox';\n\nconst MoreMenu = () => {\n  const [anchorEl, setAnchorEl] = React.useState(null);\n  const tagsRoute = useRouteRef(tagsRouteRef);\n  const favoritesRoute = useRouteRef(favoriteQuestionsRouteRef);\n  const statisticsRoute = useRouteRef(statisticsRouteRef);\n  const userRoute = useRouteRef(userRouteRef);\n  const open = Boolean(anchorEl);\n  const styles = useStyles();\n  const { t } = useTranslation();\n  const {\n    value: user,\n    loading: loadingUser,\n    error: userError,\n  } = useIdentityApi(api => api.getBackstageIdentity(), []);\n\n  const handleMenuOpen = (event: any) => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handleMenuClose = () => {\n    setAnchorEl(null);\n  };\n\n  return (\n    <>\n      <Tooltip arrow title={t('homePage.moreMenu.title')}>\n        <IconButton\n          aria-label=\"more\"\n          aria-controls=\"long-menu\"\n          aria-haspopup=\"true\"\n          onClick={handleMenuOpen}\n        >\n          <MoreVertIcon />\n        </IconButton>\n      </Tooltip>\n      <Menu\n        id=\"long-menu\"\n        anchorEl={anchorEl}\n        keepMounted\n        open={open}\n        getContentAnchorEl={null}\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'center',\n        }}\n        transformOrigin={{\n          vertical: 'top',\n          horizontal: 'center',\n        }}\n        onClose={handleMenuClose}\n      >\n        {user && !loadingUser && !userError && (\n          <MenuItem component=\"a\" href={`${userRoute()}/${user.userEntityRef}`}>\n            <ListItemIcon className={styles.menuIcon}>\n              <AccountBox fontSize=\"small\" />\n            </ListItemIcon>\n            {t('homePage.moreMenu.profile')}\n          </MenuItem>\n        )}\n        <MenuItem component=\"a\" href={tagsRoute()}>\n          <ListItemIcon className={styles.menuIcon}>\n            <LoyaltyOutlined fontSize=\"small\" />\n          </ListItemIcon>\n          {t('homePage.moreMenu.tags')}\n        </MenuItem>\n        <MenuItem component=\"a\" href={favoritesRoute()}>\n          <ListItemIcon className={styles.menuIcon}>\n            <StarIcon fontSize=\"small\" />\n          </ListItemIcon>\n          {t('homePage.moreMenu.favoriteQuestions')}\n        </MenuItem>\n        <MenuItem component=\"a\" href={statisticsRoute()}>\n          <ListItemIcon className={styles.menuIcon}>\n            <TrophyIcon />\n          </ListItemIcon>\n          {t('homePage.moreMenu.statistics')}\n        </MenuItem>\n      </Menu>\n    </>\n  );\n};\n\nexport const HomePageContent = () => {\n  const [searchParams] = useSearchParams();\n  const [entityRef, setEntityRef] = React.useState<string | undefined>(\n    undefined,\n  );\n  const [tags, setTags] = React.useState<string[] | undefined>(undefined);\n  const { t } = useTranslation();\n  useEffect(() => {\n    setEntityRef(searchParams.get('entity') ?? undefined);\n    setTags(filterTags(searchParams.get('tags')));\n  }, [searchParams, setEntityRef]);\n\n  return (\n    <Content className=\"qetaHomePage\">\n      <Container maxWidth=\"lg\">\n        <Grid container spacing={3}>\n          <Grid item xs={12} lg={9} xl={10}>\n            <ContentHeader title={t('homePage.title')}>\n              <MoreMenu />\n              <AskQuestionButton entity={entityRef} tags={tags} />\n            </ContentHeader>\n            <QuestionsContainer entity={entityRef} tags={tags} />\n          </Grid>\n          <Grid item lg={3} xl={2}>\n            <QuestionHighlightList\n              type=\"hot\"\n              title={t('homePage.highlights.hot.title')}\n              noQuestionsLabel={t('homePage.highlights.hot.noQuestionsLabel')}\n              icon={<Whatshot fontSize=\"small\" />}\n            />\n            <QuestionHighlightList\n              type=\"unanswered\"\n              title={t('homePage.highlights.unanswered.title')}\n              noQuestionsLabel={t(\n                'homePage.highlights.unanswered.noQuestionsLabel',\n              )}\n            />\n            <QuestionHighlightList\n              type=\"incorrect\"\n              title={t('homePage.highlights.incorrect.title')}\n              noQuestionsLabel={t(\n                'homePage.highlights.incorrect.noQuestionsLabel',\n              )}\n            />\n          </Grid>\n        </Grid>\n      </Container>\n    </Content>\n  );\n};\n\ntype Props = {\n  title?: string;\n  subtitle?: string;\n  headerElements?: ReactNode[];\n  themeId?: string;\n  headerTooltip?: string;\n  headerType?: string;\n  headerTypeLink?: string;\n};\n\nexport const HomePage = (props?: Props) => {\n  const {\n    title = 'Q&A',\n    subtitle,\n    headerElements,\n    themeId = 'tool',\n    headerTooltip,\n    headerType,\n    headerTypeLink,\n  } = props ?? {};\n\n  return (\n    <Page themeId={themeId}>\n      <Header\n        title={title}\n        subtitle={subtitle}\n        type={headerType}\n        typeLink={headerTypeLink}\n        tooltip={headerTooltip}\n      >\n        {headerElements}\n      </Header>\n      <Routes>\n        <Route path=\"/\" element={<HomePageContent />} />\n        <Route path={askRouteRef.path} element={<AskPage />} />\n        <Route\n          path={favoriteQuestionsRouteRef.path}\n          element={<FavoritePage />}\n        />\n        <Route path={editQuestionRouteRef.path} element={<AskPage />} />\n        <Route path={questionRouteRef.path} element={<QuestionPage />} />\n        <Route path={tagsRouteRef.path} element={<TagPage />} />\n        <Route path={tagRouteRef.path} element={<TagPage />} />\n        <Route path={userRouteRef.path} element={<UserPage />} />\n        <Route path={statisticsRouteRef.path} element={<StatisticsPage />} />\n      </Routes>\n    </Page>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Links/Links.esm.js

@@ -3,15 +3,17 @@ import { useRouteRef } from '@backstage/core-plugin-api';
 import { userRouteRef } from '@drodil/backstage-plugin-qeta-react';
 import { useEntityPresentation } from '@backstage/plugin-catalog-react';
 import { Link } from '@backstage/core-components';
+import { useTranslation } from '../../utils/hooks.esm.js';
 
 const UserLink = (props) => {
   const { entityRef, linkProps } = props;
   const userRoute = useRouteRef(userRouteRef);
+  const { t } = useTranslation();
   const { primaryTitle: userName } = useEntityPresentation(
     entityRef.startsWith("user:") ? entityRef : `user:${entityRef}`
   );
   if (entityRef === "anonymous") {
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, "Anonymous");
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, t("userLink.anonymous"));
   }
   return /* @__PURE__ */ React.createElement(Link, { to: `${userRoute()}/${entityRef}`, ...linkProps }, userName);
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Links.esm.js","sources":["../../../src/components/Links/Links.tsx"],"sourcesContent":["import {\n  Answer,\n  Comment,\n  Question,\n} from '@drodil/backstage-plugin-qeta-common';\nimport React from 'react';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { userRouteRef } from '@drodil/backstage-plugin-qeta-react';\nimport { useEntityPresentation } from '@backstage/plugin-catalog-react';\nimport { Link, LinkProps } from '@backstage/core-components';\n\nexport const UserLink = (props: {\n  entityRef: string;\n  linkProps?: LinkProps;\n}) => {\n  const { entityRef, linkProps } = props;\n  const userRoute = useRouteRef(userRouteRef);\n  const { primaryTitle: userName } = useEntityPresentation(\n    entityRef.startsWith('user:') ? entityRef : `user:${entityRef}`,\n  );\n  if (entityRef === 'anonymous') {\n    return <>Anonymous</>;\n  }\n  return (\n    <Link to={`${userRoute()}/${entityRef}`} {...linkProps}>\n      {userName}\n    </Link>\n  );\n};\n\nexport const AuthorLink = (props: {\n  entity: Question | Answer | Comment;\n  linkProps?: LinkProps;\n}) => {\n  const { entity, linkProps } = props;\n  return <UserLink entityRef={entity.author} linkProps={linkProps} />;\n};\n\nexport const UpdatedByLink = (props: {\n  entity: Question | Answer | Comment;\n  linkProps?: LinkProps;\n}) => {\n  const { entity, linkProps } = props;\n  if (!entity.updatedBy) {\n    return null;\n  }\n  return <UserLink entityRef={entity.updatedBy} linkProps={linkProps} />;\n};\n"],"names":[],"mappings":";;;;;;AAWa,MAAA,QAAA,GAAW,CAAC,KAGnB,KAAA;AACJ,EAAM,MAAA,EAAE,SAAW,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AACjC,EAAM,MAAA,SAAA,GAAY,YAAY,YAAY,CAAA,CAAA;AAC1C,EAAM,MAAA,EAAE,YAAc,EAAA,QAAA,EAAa,GAAA,qBAAA;AAAA,IACjC,UAAU,UAAW,CAAA,OAAO,CAAI,GAAA,SAAA,GAAY,QAAQ,SAAS,CAAA,CAAA;AAAA,GAC/D,CAAA;AACA,EAAA,IAAI,cAAc,WAAa,EAAA;AAC7B,IAAA,iEAAS,WAAS,CAAA,CAAA;AAAA,GACpB;AACA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,EAAA,EAAI,CAAG,EAAA,SAAA,EAAW,CAAA,CAAA,EAAI,SAAS,CAAA,CAAA,EAAK,GAAG,SAAA,EAAA,EAC1C,QACH,CAAA,CAAA;AAEJ,EAAA;AAEa,MAAA,UAAA,GAAa,CAAC,KAGrB,KAAA;AACJ,EAAM,MAAA,EAAE,MAAQ,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAC9B,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,SAAW,EAAA,MAAA,CAAO,QAAQ,SAAsB,EAAA,CAAA,CAAA;AACnE,EAAA;AAEa,MAAA,aAAA,GAAgB,CAAC,KAGxB,KAAA;AACJ,EAAM,MAAA,EAAE,MAAQ,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAC9B,EAAI,IAAA,CAAC,OAAO,SAAW,EAAA;AACrB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AACA,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,SAAW,EAAA,MAAA,CAAO,WAAW,SAAsB,EAAA,CAAA,CAAA;AACtE;;;;"}
+{"version":3,"file":"Links.esm.js","sources":["../../../src/components/Links/Links.tsx"],"sourcesContent":["import {\n  Answer,\n  Comment,\n  Question,\n} from '@drodil/backstage-plugin-qeta-common';\nimport React from 'react';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { userRouteRef } from '@drodil/backstage-plugin-qeta-react';\nimport { useEntityPresentation } from '@backstage/plugin-catalog-react';\nimport { Link, LinkProps } from '@backstage/core-components';\nimport { useTranslation } from '../../utils/hooks';\n\nexport const UserLink = (props: {\n  entityRef: string;\n  linkProps?: LinkProps;\n}) => {\n  const { entityRef, linkProps } = props;\n  const userRoute = useRouteRef(userRouteRef);\n  const { t } = useTranslation();\n  const { primaryTitle: userName } = useEntityPresentation(\n    entityRef.startsWith('user:') ? entityRef : `user:${entityRef}`,\n  );\n  if (entityRef === 'anonymous') {\n    return <>{t('userLink.anonymous')}</>;\n  }\n  return (\n    <Link to={`${userRoute()}/${entityRef}`} {...linkProps}>\n      {userName}\n    </Link>\n  );\n};\n\nexport const AuthorLink = (props: {\n  entity: Question | Answer | Comment;\n  linkProps?: LinkProps;\n}) => {\n  const { entity, linkProps } = props;\n  return <UserLink entityRef={entity.author} linkProps={linkProps} />;\n};\n\nexport const UpdatedByLink = (props: {\n  entity: Question | Answer | Comment;\n  linkProps?: LinkProps;\n}) => {\n  const { entity, linkProps } = props;\n  if (!entity.updatedBy) {\n    return null;\n  }\n  return <UserLink entityRef={entity.updatedBy} linkProps={linkProps} />;\n};\n"],"names":[],"mappings":";;;;;;;AAYa,MAAA,QAAA,GAAW,CAAC,KAGnB,KAAA;AACJ,EAAM,MAAA,EAAE,SAAW,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AACjC,EAAM,MAAA,SAAA,GAAY,YAAY,YAAY,CAAA,CAAA;AAC1C,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA,CAAA;AAC7B,EAAM,MAAA,EAAE,YAAc,EAAA,QAAA,EAAa,GAAA,qBAAA;AAAA,IACjC,UAAU,UAAW,CAAA,OAAO,CAAI,GAAA,SAAA,GAAY,QAAQ,SAAS,CAAA,CAAA;AAAA,GAC/D,CAAA;AACA,EAAA,IAAI,cAAc,WAAa,EAAA;AAC7B,IAAO,uBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EAAG,CAAE,CAAA,oBAAoB,CAAE,CAAA,CAAA;AAAA,GACpC;AACA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,EAAA,EAAI,CAAG,EAAA,SAAA,EAAW,CAAA,CAAA,EAAI,SAAS,CAAA,CAAA,EAAK,GAAG,SAAA,EAAA,EAC1C,QACH,CAAA,CAAA;AAEJ,EAAA;AAEa,MAAA,UAAA,GAAa,CAAC,KAGrB,KAAA;AACJ,EAAM,MAAA,EAAE,MAAQ,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAC9B,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,SAAW,EAAA,MAAA,CAAO,QAAQ,SAAsB,EAAA,CAAA,CAAA;AACnE,EAAA;AAEa,MAAA,aAAA,GAAgB,CAAC,KAGxB,KAAA;AACJ,EAAM,MAAA,EAAE,MAAQ,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAC9B,EAAI,IAAA,CAAC,OAAO,SAAW,EAAA;AACrB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AACA,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,SAAW,EAAA,MAAA,CAAO,WAAW,SAAsB,EAAA,CAAA,CAAA;AACtE;;;;"}

package/dist/components/QuestionHighlightList/QuestionHighlightList.esm.js

@@ -1,6 +1,6 @@
 import { Box, List, ListSubheader, ListItem, ListItemText, Divider } from '@material-ui/core';
 import React from 'react';
-import { useQetaApi, useStyles } from '../../utils/hooks.esm.js';
+import { useQetaApi, useStyles, useTranslation } from '../../utils/hooks.esm.js';
 import { Skeleton } from '@material-ui/lab';
 import { useRouteRef } from '@backstage/core-plugin-api';
 import { questionRouteRef } from '@drodil/backstage-plugin-qeta-react';
@@ -12,6 +12,7 @@ const QuestionHighlightList = (props) => {
     error
   } = useQetaApi((api) => api.getQuestionsList(props.type), []);
   const classes = useStyles();
+  const { t } = useTranslation();
   const questionRoute = useRouteRef(questionRouteRef);
   const questions = response?.questions ?? [];
   return /* @__PURE__ */ React.createElement(
@@ -39,7 +40,7 @@ const QuestionHighlightList = (props) => {
         )
       },
       loading && /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(Skeleton, { variant: "rect" })),
-      error && /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(ListItemText, null, "Failed to load questions")),
+      error && /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(ListItemText, null, t("homePage.highlights.loadError"))),
       !error && questions.length === 0 && /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(ListItemText, null, props.noQuestionsLabel)),
       !error && questions.map((q) => /* @__PURE__ */ React.createElement(React.Fragment, { key: q.id }, /* @__PURE__ */ React.createElement(Divider, null), /* @__PURE__ */ React.createElement(
         ListItem,

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

@@ -1 +1 @@
-{"version":3,"file":"QuestionHighlightList.esm.js","sources":["../../../src/components/QuestionHighlightList/QuestionHighlightList.tsx"],"sourcesContent":["import {\n  Box,\n  Divider,\n  List,\n  ListItem,\n  ListItemText,\n  ListSubheader,\n} from '@material-ui/core';\nimport React from 'react';\nimport { useQetaApi, useStyles } from '../../utils/hooks';\nimport { Skeleton } from '@material-ui/lab';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { questionRouteRef } from '@drodil/backstage-plugin-qeta-react';\n\nexport const QuestionHighlightList = (props: {\n  type: string;\n  title: string;\n  noQuestionsLabel: string;\n  icon?: JSX.Element;\n}) => {\n  const {\n    value: response,\n    loading,\n    error,\n  } = useQetaApi(api => api.getQuestionsList(props.type), []);\n  const classes = useStyles();\n  const questionRoute = useRouteRef(questionRouteRef);\n\n  const questions = response?.questions ?? [];\n\n  return (\n    <Box\n      className={`qetaQuestionHighlightList ${classes.questionHighlightList}`}\n      display={{ md: 'none', lg: 'block' }}\n    >\n      <List\n        component=\"nav\"\n        aria-labelledby=\"nested-list-subheader\"\n        className=\"qetaQuestionHighlightListList\"\n        subheader={\n          <ListSubheader\n            disableSticky\n            component=\"div\"\n            id=\"nested-list-subheader\"\n            color=\"primary\"\n          >\n            {props.title}\n            {props.icon}\n          </ListSubheader>\n        }\n      >\n        {loading && (\n          <ListItem>\n            <Skeleton variant=\"rect\" />\n          </ListItem>\n        )}\n        {error && (\n          <ListItem>\n            <ListItemText>Failed to load questions</ListItemText>\n          </ListItem>\n        )}\n        {!error && questions.length === 0 && (\n          <ListItem>\n            <ListItemText>{props.noQuestionsLabel}</ListItemText>\n          </ListItem>\n        )}\n        {!error &&\n          questions.map(q => (\n            <React.Fragment key={q.id}>\n              <Divider />\n              <ListItem\n                className=\"qetaQuestionHighlightListListItem\"\n                button\n                dense\n                component=\"a\"\n                href={questionRoute({ id: q.id.toString(10) })}\n              >\n                <ListItemText>{q.title}</ListItemText>\n              </ListItem>\n            </React.Fragment>\n          ))}\n      </List>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAca,MAAA,qBAAA,GAAwB,CAAC,KAKhC,KAAA;AACJ,EAAM,MAAA;AAAA,IACJ,KAAO,EAAA,QAAA;AAAA,IACP,OAAA;AAAA,IACA,KAAA;AAAA,GACF,GAAI,WAAW,CAAO,GAAA,KAAA,GAAA,CAAI,iBAAiB,KAAM,CAAA,IAAI,CAAG,EAAA,EAAE,CAAA,CAAA;AAC1D,EAAA,MAAM,UAAU,SAAU,EAAA,CAAA;AAC1B,EAAM,MAAA,aAAA,GAAgB,YAAY,gBAAgB,CAAA,CAAA;AAElD,EAAM,MAAA,SAAA,GAAY,QAAU,EAAA,SAAA,IAAa,EAAC,CAAA;AAE1C,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,CAA6B,0BAAA,EAAA,OAAA,CAAQ,qBAAqB,CAAA,CAAA;AAAA,MACrE,OAAS,EAAA,EAAE,EAAI,EAAA,MAAA,EAAQ,IAAI,OAAQ,EAAA;AAAA,KAAA;AAAA,oBAEnC,KAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,SAAU,EAAA,KAAA;AAAA,QACV,iBAAgB,EAAA,uBAAA;AAAA,QAChB,SAAU,EAAA,+BAAA;AAAA,QACV,SACE,kBAAA,KAAA,CAAA,aAAA;AAAA,UAAC,aAAA;AAAA,UAAA;AAAA,YACC,aAAa,EAAA,IAAA;AAAA,YACb,SAAU,EAAA,KAAA;AAAA,YACV,EAAG,EAAA,uBAAA;AAAA,YACH,KAAM,EAAA,SAAA;AAAA,WAAA;AAAA,UAEL,KAAM,CAAA,KAAA;AAAA,UACN,KAAM,CAAA,IAAA;AAAA,SACT;AAAA,OAAA;AAAA,MAGD,2BACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA,sCACE,QAAS,EAAA,EAAA,OAAA,EAAQ,QAAO,CAC3B,CAAA;AAAA,MAED,yBACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,IAAA,EAAa,0BAAwB,CACxC,CAAA;AAAA,MAED,CAAC,KAAS,IAAA,SAAA,CAAU,MAAW,KAAA,CAAA,oBAC7B,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,IAAA,EAAc,KAAM,CAAA,gBAAiB,CACxC,CAAA;AAAA,MAED,CAAC,KAAA,IACA,SAAU,CAAA,GAAA,CAAI,uBACX,KAAA,CAAA,aAAA,CAAA,KAAA,CAAM,QAAN,EAAA,EAAe,GAAK,EAAA,CAAA,CAAE,EACrB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,aAAQ,CACT,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,SAAU,EAAA,mCAAA;AAAA,UACV,MAAM,EAAA,IAAA;AAAA,UACN,KAAK,EAAA,IAAA;AAAA,UACL,SAAU,EAAA,GAAA;AAAA,UACV,IAAA,EAAM,cAAc,EAAE,EAAA,EAAI,EAAE,EAAG,CAAA,QAAA,CAAS,EAAE,CAAA,EAAG,CAAA;AAAA,SAAA;AAAA,wBAE7C,KAAA,CAAA,aAAA,CAAC,YAAc,EAAA,IAAA,EAAA,CAAA,CAAE,KAAM,CAAA;AAAA,OAE3B,CACD,CAAA;AAAA,KACL;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"QuestionHighlightList.esm.js","sources":["../../../src/components/QuestionHighlightList/QuestionHighlightList.tsx"],"sourcesContent":["import {\n  Box,\n  Divider,\n  List,\n  ListItem,\n  ListItemText,\n  ListSubheader,\n} from '@material-ui/core';\nimport React from 'react';\nimport { useQetaApi, useStyles, useTranslation } from '../../utils/hooks';\nimport { Skeleton } from '@material-ui/lab';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { questionRouteRef } from '@drodil/backstage-plugin-qeta-react';\n\nexport const QuestionHighlightList = (props: {\n  type: string;\n  title: string;\n  noQuestionsLabel: string;\n  icon?: React.ReactNode;\n}) => {\n  const {\n    value: response,\n    loading,\n    error,\n  } = useQetaApi(api => api.getQuestionsList(props.type), []);\n  const classes = useStyles();\n  const { t } = useTranslation();\n  const questionRoute = useRouteRef(questionRouteRef);\n\n  const questions = response?.questions ?? [];\n\n  return (\n    <Box\n      className={`qetaQuestionHighlightList ${classes.questionHighlightList}`}\n      display={{ md: 'none', lg: 'block' }}\n    >\n      <List\n        component=\"nav\"\n        aria-labelledby=\"nested-list-subheader\"\n        className=\"qetaQuestionHighlightListList\"\n        subheader={\n          <ListSubheader\n            disableSticky\n            component=\"div\"\n            id=\"nested-list-subheader\"\n            color=\"primary\"\n          >\n            {props.title}\n            {props.icon}\n          </ListSubheader>\n        }\n      >\n        {loading && (\n          <ListItem>\n            <Skeleton variant=\"rect\" />\n          </ListItem>\n        )}\n        {error && (\n          <ListItem>\n            <ListItemText>{t('homePage.highlights.loadError')}</ListItemText>\n          </ListItem>\n        )}\n        {!error && questions.length === 0 && (\n          <ListItem>\n            <ListItemText>{props.noQuestionsLabel}</ListItemText>\n          </ListItem>\n        )}\n        {!error &&\n          questions.map(q => (\n            <React.Fragment key={q.id}>\n              <Divider />\n              <ListItem\n                className=\"qetaQuestionHighlightListListItem\"\n                button\n                dense\n                component=\"a\"\n                href={questionRoute({ id: q.id.toString(10) })}\n              >\n                <ListItemText>{q.title}</ListItemText>\n              </ListItem>\n            </React.Fragment>\n          ))}\n      </List>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAca,MAAA,qBAAA,GAAwB,CAAC,KAKhC,KAAA;AACJ,EAAM,MAAA;AAAA,IACJ,KAAO,EAAA,QAAA;AAAA,IACP,OAAA;AAAA,IACA,KAAA;AAAA,GACF,GAAI,WAAW,CAAO,GAAA,KAAA,GAAA,CAAI,iBAAiB,KAAM,CAAA,IAAI,CAAG,EAAA,EAAE,CAAA,CAAA;AAC1D,EAAA,MAAM,UAAU,SAAU,EAAA,CAAA;AAC1B,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA,CAAA;AAC7B,EAAM,MAAA,aAAA,GAAgB,YAAY,gBAAgB,CAAA,CAAA;AAElD,EAAM,MAAA,SAAA,GAAY,QAAU,EAAA,SAAA,IAAa,EAAC,CAAA;AAE1C,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,CAA6B,0BAAA,EAAA,OAAA,CAAQ,qBAAqB,CAAA,CAAA;AAAA,MACrE,OAAS,EAAA,EAAE,EAAI,EAAA,MAAA,EAAQ,IAAI,OAAQ,EAAA;AAAA,KAAA;AAAA,oBAEnC,KAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,SAAU,EAAA,KAAA;AAAA,QACV,iBAAgB,EAAA,uBAAA;AAAA,QAChB,SAAU,EAAA,+BAAA;AAAA,QACV,SACE,kBAAA,KAAA,CAAA,aAAA;AAAA,UAAC,aAAA;AAAA,UAAA;AAAA,YACC,aAAa,EAAA,IAAA;AAAA,YACb,SAAU,EAAA,KAAA;AAAA,YACV,EAAG,EAAA,uBAAA;AAAA,YACH,KAAM,EAAA,SAAA;AAAA,WAAA;AAAA,UAEL,KAAM,CAAA,KAAA;AAAA,UACN,KAAM,CAAA,IAAA;AAAA,SACT;AAAA,OAAA;AAAA,MAGD,2BACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA,sCACE,QAAS,EAAA,EAAA,OAAA,EAAQ,QAAO,CAC3B,CAAA;AAAA,MAED,KAAA,wCACE,QACC,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,oBAAc,CAAE,CAAA,+BAA+B,CAAE,CACpD,CAAA;AAAA,MAED,CAAC,KAAS,IAAA,SAAA,CAAU,MAAW,KAAA,CAAA,oBAC7B,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,IAAA,EAAc,KAAM,CAAA,gBAAiB,CACxC,CAAA;AAAA,MAED,CAAC,KAAA,IACA,SAAU,CAAA,GAAA,CAAI,uBACX,KAAA,CAAA,aAAA,CAAA,KAAA,CAAM,QAAN,EAAA,EAAe,GAAK,EAAA,CAAA,CAAE,EACrB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,aAAQ,CACT,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,SAAU,EAAA,mCAAA;AAAA,UACV,MAAM,EAAA,IAAA;AAAA,UACN,KAAK,EAAA,IAAA;AAAA,UACL,SAAU,EAAA,GAAA;AAAA,UACV,IAAA,EAAM,cAAc,EAAE,EAAA,EAAI,EAAE,EAAG,CAAA,QAAA,CAAS,EAAE,CAAA,EAAG,CAAA;AAAA,SAAA;AAAA,wBAE7C,KAAA,CAAA,aAAA,CAAC,YAAc,EAAA,IAAA,EAAA,CAAA,CAAE,KAAM,CAAA;AAAA,OAE3B,CACD,CAAA;AAAA,KACL;AAAA,GACF,CAAA;AAEJ;;;;"}

package/dist/components/QuestionPage/AnswerCard.esm.js

@@ -2,7 +2,7 @@ import { Card, CardContent, Grid, Typography, Box, Button } from '@material-ui/c
 import { MarkdownContent } from '@backstage/core-components';
 import React from 'react';
 import { VoteButtons } from './VoteButtons.esm.js';
-import { useStyles } from '../../utils/hooks.esm.js';
+import { useStyles, useTranslation } from '../../utils/hooks.esm.js';
 import { DeleteModal } from '../DeleteModal/DeleteModal.esm.js';
 import { AnswerForm } from './AnswerForm.esm.js';
 import { AuthorBox } from './AuthorBox.esm.js';
@@ -16,6 +16,7 @@ const AnswerCard = (props) => {
   const styles = useStyles();
   const [editMode, setEditMode] = React.useState(false);
   const [answerEntity, setAnswerEntity] = React.useState(answer);
+  const { t } = useTranslation();
   const [deleteModalOpen, setDeleteModalOpen] = React.useState(false);
   const handleDeleteModalOpen = () => setDeleteModalOpen(true);
   const handleDeleteModalClose = () => setDeleteModalOpen(false);
@@ -64,7 +65,7 @@ const AnswerCard = (props) => {
           className: `${styles.marginRight} qetaAnswerCardDeleteBtn`,
           startIcon: /* @__PURE__ */ React.createElement(DeleteIcon, null)
         },
-        "Delete"
+        t("deleteModal.deleteButton")
       ), /* @__PURE__ */ React.createElement(
         DeleteModal,
         {
@@ -83,7 +84,7 @@ const AnswerCard = (props) => {
           onClick: () => setEditMode(true),
           className: "qetaAnswerCardEditBtn"
         },
-        "Edit"
+        t("questionPage.editButton")
       )
     )), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 3, className: styles.noPadding }, /* @__PURE__ */ React.createElement(AuthorBox, { entity: answerEntity }))))))
   ), /* @__PURE__ */ React.createElement(

package/dist/components/QuestionPage/AnswerCard.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnswerCard.esm.js","sources":["../../../src/components/QuestionPage/AnswerCard.tsx"],"sourcesContent":["import {\n  AnswerResponse,\n  QuestionResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport {\n  Box,\n  Button,\n  Card,\n  CardContent,\n  Grid,\n  Typography,\n} from '@material-ui/core';\nimport { MarkdownContent } from '@backstage/core-components';\nimport React from 'react';\nimport { VoteButtons } from './VoteButtons';\nimport { useStyles } from '../../utils/hooks';\nimport { DeleteModal } from '../DeleteModal/DeleteModal';\nimport { AnswerForm } from './AnswerForm';\nimport { AuthorBox } from './AuthorBox';\nimport { CommentSection } from '../CommentSection/CommentSection';\nimport { LinkButton } from './LinkButton';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport EditIcon from '@material-ui/icons/Edit';\n\nexport const AnswerCard = (props: {\n  answer: AnswerResponse;\n  question: QuestionResponse;\n}) => {\n  const { answer, question } = props;\n  const styles = useStyles();\n\n  const [editMode, setEditMode] = React.useState(false);\n  const [answerEntity, setAnswerEntity] = React.useState(answer);\n\n  const [deleteModalOpen, setDeleteModalOpen] = React.useState(false);\n  const handleDeleteModalOpen = () => setDeleteModalOpen(true);\n  const handleDeleteModalClose = () => setDeleteModalOpen(false);\n  const highlightedAnswer =\n    window.location.hash.slice(1) === `answer_${answer.id}`;\n\n  const onAnswerEdit = (a: AnswerResponse) => {\n    setEditMode(false);\n    setAnswerEntity(a);\n  };\n\n  const onCommentAction = (_: QuestionResponse, a?: AnswerResponse) => {\n    if (a) {\n      setAnswerEntity(a);\n    }\n  };\n\n  return (\n    <>\n      <Card\n        id={`answer_${answer.id}`}\n        className={`qetaAnswerCard ${styles.questionCard} ${\n          highlightedAnswer ? styles.highlight : ''\n        }`}\n      >\n        <CardContent>\n          <div className={styles.questionCardVote}>\n            <VoteButtons entity={answerEntity} question={question} />\n            <LinkButton entity={answerEntity} />\n          </div>\n          <div className={styles.answerCardContent}>\n            {editMode ? (\n              <AnswerForm\n                question={question}\n                onPost={onAnswerEdit}\n                id={answerEntity.id}\n              />\n            ) : (\n              <Grid container>\n                <Grid item xs={12}>\n                  <Typography variant=\"body1\" gutterBottom>\n                    <MarkdownContent\n                      className={`qetaAndwerCardAnswerContent ${styles.markdownContent}`}\n                      content={answerEntity.content}\n                      dialect=\"gfm\"\n                    />\n                  </Typography>\n                </Grid>\n                <Grid item container justifyContent=\"space-around\">\n                  <Grid item xs={9} style={{ alignSelf: 'flex-end' }}>\n                    {(answerEntity.own ||\n                      answerEntity.canDelete ||\n                      answerEntity.canEdit) && (\n                      <Box\n                        className={`qetaAnswerCardActions ${styles.questionCardActions}`}\n                      >\n                        {!answerEntity.correct &&\n                          (answerEntity.own || answerEntity.canDelete) && (\n                            <>\n                              <Button\n                                variant=\"outlined\"\n                                size=\"small\"\n                                color=\"secondary\"\n                                onClick={handleDeleteModalOpen}\n                                className={`${styles.marginRight} qetaAnswerCardDeleteBtn`}\n                                startIcon={<DeleteIcon />}\n                              >\n                                Delete\n                              </Button>\n                              <DeleteModal\n                                open={deleteModalOpen}\n                                onClose={handleDeleteModalClose}\n                                entity={answerEntity}\n                                question={question}\n                              />\n                            </>\n                          )}\n                        {(answerEntity.own || answerEntity.canEdit) && (\n                          <Button\n                            variant=\"outlined\"\n                            size=\"small\"\n                            startIcon={<EditIcon />}\n                            onClick={() => setEditMode(true)}\n                            className=\"qetaAnswerCardEditBtn\"\n                          >\n                            Edit\n                          </Button>\n                        )}\n                      </Box>\n                    )}\n                  </Grid>\n                  <Grid item xs={3} className={styles.noPadding}>\n                    <AuthorBox entity={answerEntity} />\n                  </Grid>\n                </Grid>\n              </Grid>\n            )}\n          </div>\n        </CardContent>\n      </Card>\n      <CommentSection\n        question={question}\n        answer={answerEntity}\n        onCommentPost={onCommentAction}\n        onCommentDelete={onCommentAction}\n      />\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"AnswerCard.esm.js","sources":["../../../src/components/QuestionPage/AnswerCard.tsx"],"sourcesContent":["import {\n  AnswerResponse,\n  QuestionResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport {\n  Box,\n  Button,\n  Card,\n  CardContent,\n  Grid,\n  Typography,\n} from '@material-ui/core';\nimport { MarkdownContent } from '@backstage/core-components';\nimport React from 'react';\nimport { VoteButtons } from './VoteButtons';\nimport { useStyles, useTranslation } from '../../utils/hooks';\nimport { DeleteModal } from '../DeleteModal/DeleteModal';\nimport { AnswerForm } from './AnswerForm';\nimport { AuthorBox } from './AuthorBox';\nimport { CommentSection } from '../CommentSection/CommentSection';\nimport { LinkButton } from './LinkButton';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport EditIcon from '@material-ui/icons/Edit';\n\nexport const AnswerCard = (props: {\n  answer: AnswerResponse;\n  question: QuestionResponse;\n}) => {\n  const { answer, question } = props;\n  const styles = useStyles();\n\n  const [editMode, setEditMode] = React.useState(false);\n  const [answerEntity, setAnswerEntity] = React.useState(answer);\n  const { t } = useTranslation();\n\n  const [deleteModalOpen, setDeleteModalOpen] = React.useState(false);\n  const handleDeleteModalOpen = () => setDeleteModalOpen(true);\n  const handleDeleteModalClose = () => setDeleteModalOpen(false);\n  const highlightedAnswer =\n    window.location.hash.slice(1) === `answer_${answer.id}`;\n\n  const onAnswerEdit = (a: AnswerResponse) => {\n    setEditMode(false);\n    setAnswerEntity(a);\n  };\n\n  const onCommentAction = (_: QuestionResponse, a?: AnswerResponse) => {\n    if (a) {\n      setAnswerEntity(a);\n    }\n  };\n\n  return (\n    <>\n      <Card\n        id={`answer_${answer.id}`}\n        className={`qetaAnswerCard ${styles.questionCard} ${\n          highlightedAnswer ? styles.highlight : ''\n        }`}\n      >\n        <CardContent>\n          <div className={styles.questionCardVote}>\n            <VoteButtons entity={answerEntity} question={question} />\n            <LinkButton entity={answerEntity} />\n          </div>\n          <div className={styles.answerCardContent}>\n            {editMode ? (\n              <AnswerForm\n                question={question}\n                onPost={onAnswerEdit}\n                id={answerEntity.id}\n              />\n            ) : (\n              <Grid container>\n                <Grid item xs={12}>\n                  <Typography variant=\"body1\" gutterBottom>\n                    <MarkdownContent\n                      className={`qetaAndwerCardAnswerContent ${styles.markdownContent}`}\n                      content={answerEntity.content}\n                      dialect=\"gfm\"\n                    />\n                  </Typography>\n                </Grid>\n                <Grid item container justifyContent=\"space-around\">\n                  <Grid item xs={9} style={{ alignSelf: 'flex-end' }}>\n                    {(answerEntity.own ||\n                      answerEntity.canDelete ||\n                      answerEntity.canEdit) && (\n                      <Box\n                        className={`qetaAnswerCardActions ${styles.questionCardActions}`}\n                      >\n                        {!answerEntity.correct &&\n                          (answerEntity.own || answerEntity.canDelete) && (\n                            <>\n                              <Button\n                                variant=\"outlined\"\n                                size=\"small\"\n                                color=\"secondary\"\n                                onClick={handleDeleteModalOpen}\n                                className={`${styles.marginRight} qetaAnswerCardDeleteBtn`}\n                                startIcon={<DeleteIcon />}\n                              >\n                                {t('deleteModal.deleteButton')}\n                              </Button>\n                              <DeleteModal\n                                open={deleteModalOpen}\n                                onClose={handleDeleteModalClose}\n                                entity={answerEntity}\n                                question={question}\n                              />\n                            </>\n                          )}\n                        {(answerEntity.own || answerEntity.canEdit) && (\n                          <Button\n                            variant=\"outlined\"\n                            size=\"small\"\n                            startIcon={<EditIcon />}\n                            onClick={() => setEditMode(true)}\n                            className=\"qetaAnswerCardEditBtn\"\n                          >\n                            {t('questionPage.editButton')}\n                          </Button>\n                        )}\n                      </Box>\n                    )}\n                  </Grid>\n                  <Grid item xs={3} className={styles.noPadding}>\n                    <AuthorBox entity={answerEntity} />\n                  </Grid>\n                </Grid>\n              </Grid>\n            )}\n          </div>\n        </CardContent>\n      </Card>\n      <CommentSection\n        question={question}\n        answer={answerEntity}\n        onCommentPost={onCommentAction}\n        onCommentDelete={onCommentAction}\n      />\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/QuestionPage/AnswerForm.esm.js

@@ -3,12 +3,13 @@ import { Typography, Button } from '@material-ui/core';
 import React, { useEffect } from 'react';
 import { useAnalytics, useApi, configApiRef } from '@backstage/core-plugin-api';
 import { qetaCreateAnswerPermission } from '@drodil/backstage-plugin-qeta-common';
-import { useStyles } from '../../utils/hooks.esm.js';
+import { useStyles, useTranslation } from '../../utils/hooks.esm.js';
 import { useForm, Controller } from 'react-hook-form';
 import { MarkdownEditor } from '../MarkdownEditor/MarkdownEditor.esm.js';
 import { RequirePermission } from '@backstage/plugin-permission-react';
 import { AskAnonymouslyCheckbox } from '../AskAnonymouslyCheckbox/AskAnonymouslyCheckbox.esm.js';
 import { qetaApiRef } from '../../api/QetaClient.esm.js';
+import { confirmNavigationIfEdited } from '../../utils/utils.esm.js';
 
 const getDefaultValues = (questionId) => {
   return { questionId, answer: "" };
@@ -19,10 +20,12 @@ const AnswerForm = (props) => {
   const analytics = useAnalytics();
   const [error, setError] = React.useState(false);
   const [images, setImages] = React.useState([]);
+  const [edited, setEdited] = React.useState(false);
   const qetaApi = useApi(qetaApiRef);
   const styles = useStyles();
   const configApi = useApi(configApiRef);
   const allowAnonymouns = configApi.getOptionalBoolean("qeta.allowAnonymous");
+  const { t } = useTranslation();
   const {
     handleSubmit,
     control,
@@ -78,51 +81,69 @@ const AnswerForm = (props) => {
   useEffect(() => {
     reset(values);
   }, [values, reset]);
+  useEffect(() => {
+    confirmNavigationIfEdited(edited);
+  }, [edited]);
   return /* @__PURE__ */ React.createElement(
     RequirePermission,
     {
       permission: qetaCreateAnswerPermission,
       errorPage: /* @__PURE__ */ React.createElement(React.Fragment, null)
     },
-    /* @__PURE__ */ React.createElement("form", { onSubmit: handleSubmit(postAnswer), className: "qetaAnswerForm" }, /* @__PURE__ */ React.createElement(Typography, { variant: "h6" }, "Your answer"), error && /* @__PURE__ */ React.createElement(WarningPanel, { severity: "error", title: "Could not post answer" }), /* @__PURE__ */ React.createElement(
-      Controller,
+    /* @__PURE__ */ React.createElement(
+      "form",
       {
-        control,
-        defaultValue: "",
-        rules: {
-          required: true
+        onSubmit: handleSubmit(postAnswer),
+        onChange: () => {
+          setEdited(true);
         },
-        render: ({ field: { onChange, value } }) => /* @__PURE__ */ React.createElement(
-          MarkdownEditor,
-          {
-            value,
-            onChange,
-            height: 200,
-            error: "answer" in errors,
-            config: configApi,
-            onImageUpload: (imageId) => {
-              setImages((prevImages) => [...prevImages, imageId]);
-            }
-          }
-        ),
-        name: "answer"
-      }
-    ), allowAnonymouns && !id && /* @__PURE__ */ React.createElement(
-      AskAnonymouslyCheckbox,
-      {
-        control,
-        label: "Answer anonymously"
-      }
-    ), /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        variant: "outlined",
-        type: "submit",
-        color: "primary",
-        className: `qetaAnswerFormPostBtn ${styles.postButton}`
+        className: "qetaAnswerForm"
       },
-      id ? "Save" : "Post"
-    ))
+      /* @__PURE__ */ React.createElement(Typography, { variant: "h6" }, "Your answer"),
+      error && /* @__PURE__ */ React.createElement(WarningPanel, { severity: "error", title: t("answerForm.errorPosting") }),
+      /* @__PURE__ */ React.createElement(
+        Controller,
+        {
+          control,
+          defaultValue: "",
+          rules: {
+            required: true
+          },
+          render: ({ field: { onChange, value } }) => /* @__PURE__ */ React.createElement(
+            MarkdownEditor,
+            {
+              value,
+              onChange,
+              height: 200,
+              error: "answer" in errors,
+              config: configApi,
+              placeholder: t("answerForm.contentInput.placeholder"),
+              onImageUpload: (imageId) => {
+                setImages((prevImages) => [...prevImages, imageId]);
+              }
+            }
+          ),
+          name: "answer"
+        }
+      ),
+      allowAnonymouns && !id && /* @__PURE__ */ React.createElement(
+        AskAnonymouslyCheckbox,
+        {
+          control,
+          label: t("anonymousCheckbox.answerAnonymously")
+        }
+      ),
+      /* @__PURE__ */ React.createElement(
+        Button,
+        {
+          variant: "outlined",
+          type: "submit",
+          color: "primary",
+          className: `qetaAnswerFormPostBtn ${styles.postButton}`
+        },
+        id ? t("answerForm.submit.existingAnswer") : t("answerForm.submit.newAnswer")
+      )
+    )
   );
 };
 

package/dist/components/QuestionPage/AnswerForm.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnswerForm.esm.js","sources":["../../../src/components/QuestionPage/AnswerForm.tsx"],"sourcesContent":["import { WarningPanel } from '@backstage/core-components';\nimport { Button, Typography } from '@material-ui/core';\nimport React, { useEffect } from 'react';\nimport { configApiRef, useAnalytics, useApi } from '@backstage/core-plugin-api';\nimport {\n  AnswerRequest,\n  AnswerResponse,\n  qetaCreateAnswerPermission,\n  QuestionResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { useStyles } from '../../utils/hooks';\nimport { Controller, useForm } from 'react-hook-form';\nimport { MarkdownEditor } from '../MarkdownEditor/MarkdownEditor';\nimport { RequirePermission } from '@backstage/plugin-permission-react';\nimport { AskAnonymouslyCheckbox } from '../AskAnonymouslyCheckbox/AskAnonymouslyCheckbox';\nimport { qetaApiRef } from '../../api';\n\nconst getDefaultValues = (questionId: number) => {\n  return { questionId, answer: '' };\n};\n\nexport const AnswerForm = (props: {\n  question: QuestionResponse;\n  onPost: (answer: AnswerResponse) => void;\n  id?: number;\n}) => {\n  const { question, onPost, id } = props;\n  const [values, setValues] = React.useState(getDefaultValues(question.id));\n  const analytics = useAnalytics();\n  const [error, setError] = React.useState(false);\n  const [images, setImages] = React.useState<number[]>([]);\n  const qetaApi = useApi(qetaApiRef);\n  const styles = useStyles();\n  const configApi = useApi(configApiRef);\n  const allowAnonymouns = configApi.getOptionalBoolean('qeta.allowAnonymous');\n\n  const {\n    handleSubmit,\n    control,\n    formState: { errors },\n    reset,\n  } = useForm<AnswerRequest>({\n    values,\n    defaultValues: getDefaultValues(question.id),\n  });\n\n  const postAnswer = (data: AnswerRequest) => {\n    if (id) {\n      qetaApi\n        .updateAnswer(id, {\n          questionId: question.id,\n          answer: data.answer,\n          images,\n        })\n        .then(a => {\n          if (!a || !('id' in a)) {\n            setError(true);\n            return;\n          }\n          analytics.captureEvent('edit', 'answer');\n          reset();\n          onPost(a);\n        })\n        .catch(_e => setError(true));\n      return;\n    }\n    // http://localhost:7007/api/qeta/attachments/36e551b1-3be7-479a-8942-b7018434e710\n    qetaApi\n      .postAnswer({\n        questionId: question.id,\n        answer: data.answer,\n        images,\n        anonymous: data.anonymous,\n      })\n      .then(a => {\n        if (!a || !('id' in a)) {\n          setError(true);\n          return;\n        }\n        analytics.captureEvent('post', 'answer');\n        reset();\n        onPost(a);\n      })\n      .catch(_e => setError(true));\n  };\n\n  useEffect(() => {\n    if (id) {\n      qetaApi.getAnswer(question.id, id).then(a => {\n        if ('content' in a) {\n          setValues({ questionId: question.id, answer: a.content });\n        } else {\n          setError(true);\n        }\n      });\n    }\n  }, [id, question, qetaApi]);\n\n  useEffect(() => {\n    reset(values);\n  }, [values, reset]);\n\n  return (\n    <RequirePermission\n      permission={qetaCreateAnswerPermission}\n      errorPage={<></>}\n    >\n      <form onSubmit={handleSubmit(postAnswer)} className=\"qetaAnswerForm\">\n        <Typography variant=\"h6\">Your answer</Typography>\n        {error && (\n          <WarningPanel severity=\"error\" title=\"Could not post answer\" />\n        )}\n        <Controller\n          control={control}\n          defaultValue=\"\"\n          rules={{\n            required: true,\n          }}\n          render={({ field: { onChange, value } }) => (\n            <MarkdownEditor\n              value={value}\n              onChange={onChange}\n              height={200}\n              error={'answer' in errors}\n              config={configApi}\n              onImageUpload={(imageId: number) => {\n                setImages(prevImages => [...prevImages, imageId]);\n              }}\n            />\n          )}\n          name=\"answer\"\n        />\n        {allowAnonymouns && !id && (\n          <AskAnonymouslyCheckbox\n            control={control}\n            label=\"Answer anonymously\"\n          />\n        )}\n        <Button\n          variant=\"outlined\"\n          type=\"submit\"\n          color=\"primary\"\n          className={`qetaAnswerFormPostBtn ${styles.postButton}`}\n        >\n          {id ? 'Save' : 'Post'}\n        </Button>\n      </form>\n    </RequirePermission>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"AnswerForm.esm.js","sources":["../../../src/components/QuestionPage/AnswerForm.tsx"],"sourcesContent":["import { WarningPanel } from '@backstage/core-components';\nimport { Button, Typography } from '@material-ui/core';\nimport React, { useEffect } from 'react';\nimport { configApiRef, useAnalytics, useApi } from '@backstage/core-plugin-api';\nimport {\n  AnswerRequest,\n  AnswerResponse,\n  qetaCreateAnswerPermission,\n  QuestionResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { useStyles, useTranslation } from '../../utils/hooks';\nimport { Controller, useForm } from 'react-hook-form';\nimport { MarkdownEditor } from '../MarkdownEditor/MarkdownEditor';\nimport { RequirePermission } from '@backstage/plugin-permission-react';\nimport { AskAnonymouslyCheckbox } from '../AskAnonymouslyCheckbox/AskAnonymouslyCheckbox';\nimport { qetaApiRef } from '../../api';\nimport { confirmNavigationIfEdited } from '../../utils/utils';\n\nconst getDefaultValues = (questionId: number) => {\n  return { questionId, answer: '' };\n};\n\nexport const AnswerForm = (props: {\n  question: QuestionResponse;\n  onPost: (answer: AnswerResponse) => void;\n  id?: number;\n}) => {\n  const { question, onPost, id } = props;\n  const [values, setValues] = React.useState(getDefaultValues(question.id));\n  const analytics = useAnalytics();\n  const [error, setError] = React.useState(false);\n  const [images, setImages] = React.useState<number[]>([]);\n  const [edited, setEdited] = React.useState(false);\n  const qetaApi = useApi(qetaApiRef);\n  const styles = useStyles();\n  const configApi = useApi(configApiRef);\n  const allowAnonymouns = configApi.getOptionalBoolean('qeta.allowAnonymous');\n  const { t } = useTranslation();\n\n  const {\n    handleSubmit,\n    control,\n    formState: { errors },\n    reset,\n  } = useForm<AnswerRequest>({\n    values,\n    defaultValues: getDefaultValues(question.id),\n  });\n\n  const postAnswer = (data: AnswerRequest) => {\n    if (id) {\n      qetaApi\n        .updateAnswer(id, {\n          questionId: question.id,\n          answer: data.answer,\n          images,\n        })\n        .then(a => {\n          if (!a || !('id' in a)) {\n            setError(true);\n            return;\n          }\n          analytics.captureEvent('edit', 'answer');\n          reset();\n          onPost(a);\n        })\n        .catch(_e => setError(true));\n      return;\n    }\n    // http://localhost:7007/api/qeta/attachments/36e551b1-3be7-479a-8942-b7018434e710\n    qetaApi\n      .postAnswer({\n        questionId: question.id,\n        answer: data.answer,\n        images,\n        anonymous: data.anonymous,\n      })\n      .then(a => {\n        if (!a || !('id' in a)) {\n          setError(true);\n          return;\n        }\n        analytics.captureEvent('post', 'answer');\n        reset();\n        onPost(a);\n      })\n      .catch(_e => setError(true));\n  };\n\n  useEffect(() => {\n    if (id) {\n      qetaApi.getAnswer(question.id, id).then(a => {\n        if ('content' in a) {\n          setValues({ questionId: question.id, answer: a.content });\n        } else {\n          setError(true);\n        }\n      });\n    }\n  }, [id, question, qetaApi]);\n\n  useEffect(() => {\n    reset(values);\n  }, [values, reset]);\n\n  useEffect(() => {\n    confirmNavigationIfEdited(edited);\n  }, [edited]);\n\n  return (\n    <RequirePermission\n      permission={qetaCreateAnswerPermission}\n      errorPage={<></>}\n    >\n      <form\n        onSubmit={handleSubmit(postAnswer)}\n        onChange={() => {\n          setEdited(true);\n        }}\n        className=\"qetaAnswerForm\"\n      >\n        <Typography variant=\"h6\">Your answer</Typography>\n        {error && (\n          <WarningPanel severity=\"error\" title={t('answerForm.errorPosting')} />\n        )}\n        <Controller\n          control={control}\n          defaultValue=\"\"\n          rules={{\n            required: true,\n          }}\n          render={({ field: { onChange, value } }) => (\n            <MarkdownEditor\n              value={value}\n              onChange={onChange}\n              height={200}\n              error={'answer' in errors}\n              config={configApi}\n              placeholder={t('answerForm.contentInput.placeholder')}\n              onImageUpload={(imageId: number) => {\n                setImages(prevImages => [...prevImages, imageId]);\n              }}\n            />\n          )}\n          name=\"answer\"\n        />\n        {allowAnonymouns && !id && (\n          <AskAnonymouslyCheckbox\n            control={control}\n            label={t('anonymousCheckbox.answerAnonymously')}\n          />\n        )}\n        <Button\n          variant=\"outlined\"\n          type=\"submit\"\n          color=\"primary\"\n          className={`qetaAnswerFormPostBtn ${styles.postButton}`}\n        >\n          {id\n            ? t('answerForm.submit.existingAnswer')\n            : t('answerForm.submit.newAnswer')}\n        </Button>\n      </form>\n    </RequirePermission>\n  );\n};\n"],"names":[],"mappings":"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"}

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

@@ -1,14 +1,15 @@
 import { Box, Grid, Typography, Avatar } from '@material-ui/core';
 import React from 'react';
-import { useStyles, useEntityAuthor } from '../../utils/hooks.esm.js';
+import { useStyles, useTranslation, useEntityAuthor } from '../../utils/hooks.esm.js';
 import { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip/RelativeTimeWithTooltip.esm.js';
 import { UpdatedByLink, AuthorLink } from '../Links/Links.esm.js';
 
 const AuthorBox = (props) => {
   const { entity } = props;
   const styles = useStyles();
+  const { t } = useTranslation();
   const { name, initials, user } = useEntityAuthor(entity);
-  return /* @__PURE__ */ React.createElement(Box, { className: `qetaAuthorBox ${styles.questionCardAuthor}` }, /* @__PURE__ */ React.createElement(Grid, { container: true, alignItems: "center" }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, style: { paddingBottom: 0 } }, /* @__PURE__ */ React.createElement(Typography, { className: "qetaAuthorBoxCreated", variant: "caption" }, "Posted ", /* @__PURE__ */ React.createElement(RelativeTimeWithTooltip, { value: entity.created }))), entity.updated && entity.updatedBy && /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, style: { paddingBottom: 0, paddingTop: 0 } }, /* @__PURE__ */ React.createElement(Typography, { className: "qetaAuthorBoxUpdated", variant: "caption" }, "Updated ", /* @__PURE__ */ React.createElement(RelativeTimeWithTooltip, { value: entity.updated }), " by", " ", /* @__PURE__ */ React.createElement(UpdatedByLink, { entity }))), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 2 }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(Box, { className: `qetaAuthorBox ${styles.questionCardAuthor}` }, /* @__PURE__ */ React.createElement(Grid, { container: true, alignItems: "center" }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, style: { paddingBottom: 0 } }, /* @__PURE__ */ React.createElement(Typography, { className: "qetaAuthorBoxCreated", variant: "caption" }, t("authorBox.postedAtTime"), " ", /* @__PURE__ */ React.createElement(RelativeTimeWithTooltip, { value: entity.created }))), entity.updated && entity.updatedBy && /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, style: { paddingBottom: 0, paddingTop: 0 } }, /* @__PURE__ */ React.createElement(Typography, { className: "qetaAuthorBoxUpdated", variant: "caption" }, t("authorBox.updatedAtTime"), " ", /* @__PURE__ */ React.createElement(RelativeTimeWithTooltip, { value: entity.updated }), " ", t("authorBox.updatedBy"), " ", /* @__PURE__ */ React.createElement(UpdatedByLink, { entity }))), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 2 }, /* @__PURE__ */ React.createElement(
     Avatar,
     {
       src: user?.spec?.profile?.picture,

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

@@ -1 +1 @@
-{"version":3,"file":"AuthorBox.esm.js","sources":["../../../src/components/QuestionPage/AuthorBox.tsx"],"sourcesContent":["import { Avatar, Box, Grid, Typography } from '@material-ui/core';\nimport React from 'react';\nimport { useEntityAuthor, useStyles } from '../../utils/hooks';\nimport {\n  AnswerResponse,\n  QuestionResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip/RelativeTimeWithTooltip';\nimport { AuthorLink, UpdatedByLink } from '../Links/Links';\n\nexport const AuthorBox = (props: {\n  entity: QuestionResponse | AnswerResponse;\n}) => {\n  const { entity } = props;\n  const styles = useStyles();\n  const { name, initials, user } = useEntityAuthor(entity);\n\n  return (\n    <Box className={`qetaAuthorBox ${styles.questionCardAuthor}`}>\n      <Grid container alignItems=\"center\">\n        <Grid item xs={12} style={{ paddingBottom: 0 }}>\n          <Typography className=\"qetaAuthorBoxCreated\" variant=\"caption\">\n            Posted <RelativeTimeWithTooltip value={entity.created} />\n          </Typography>\n        </Grid>\n        {entity.updated && entity.updatedBy && (\n          <Grid item xs={12} style={{ paddingBottom: 0, paddingTop: 0 }}>\n            <Typography className=\"qetaAuthorBoxUpdated\" variant=\"caption\">\n              Updated <RelativeTimeWithTooltip value={entity.updated} /> by{' '}\n              <UpdatedByLink entity={entity} />\n            </Typography>\n          </Grid>\n        )}\n        <Grid item xs={2}>\n          <Avatar\n            src={user?.spec?.profile?.picture}\n            className=\"qetaAuthorBoxAvatar avatar\"\n            alt={name}\n            variant=\"rounded\"\n          >\n            {initials}\n          </Avatar>\n        </Grid>\n        <Grid item xs={10} className={styles.authorLink}>\n          <Box style={{ paddingLeft: '5px' }}>\n            <AuthorLink entity={entity} />\n          </Box>\n        </Grid>\n      </Grid>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAUa,MAAA,SAAA,GAAY,CAAC,KAEpB,KAAA;AACJ,EAAM,MAAA,EAAE,QAAW,GAAA,KAAA,CAAA;AACnB,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AACzB,EAAA,MAAM,EAAE,IAAM,EAAA,QAAA,EAAU,IAAK,EAAA,GAAI,gBAAgB,MAAM,CAAA,CAAA;AAEvD,EAAA,2CACG,GAAI,EAAA,EAAA,SAAA,EAAW,CAAiB,cAAA,EAAA,MAAA,CAAO,kBAAkB,CACxD,CAAA,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,SAAA,EAAS,MAAC,UAAW,EAAA,QAAA,EAAA,sCACxB,IAAK,EAAA,EAAA,IAAA,EAAI,MAAC,EAAI,EAAA,EAAA,EAAI,KAAO,EAAA,EAAE,eAAe,CAAE,EAAA,EAAA,sCAC1C,UAAW,EAAA,EAAA,SAAA,EAAU,wBAAuB,OAAQ,EAAA,SAAA,EAAA,EAAU,SACtD,kBAAA,KAAA,CAAA,aAAA,CAAC,2BAAwB,KAAO,EAAA,MAAA,CAAO,SAAS,CACzD,CACF,GACC,MAAO,CAAA,OAAA,IAAW,MAAO,CAAA,SAAA,wCACvB,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,EAAA,EAAI,IAAI,KAAO,EAAA,EAAE,aAAe,EAAA,CAAA,EAAG,YAAY,CAAE,EAAA,EAAA,sCACzD,UAAW,EAAA,EAAA,SAAA,EAAU,wBAAuB,OAAQ,EAAA,SAAA,EAAA,EAAU,UACrD,kBAAA,KAAA,CAAA,aAAA,CAAC,2BAAwB,KAAO,EAAA,MAAA,CAAO,SAAS,CAAE,EAAA,KAAA,EAAI,qBAC7D,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA,EAAc,MAAgB,EAAA,CACjC,CACF,CAEF,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,IAAI,EAAA,IAAA,EAAC,IAAI,CACb,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,IAAM,EAAA,IAAA,EAAM,OAAS,EAAA,OAAA;AAAA,MAC1B,SAAU,EAAA,4BAAA;AAAA,MACV,GAAK,EAAA,IAAA;AAAA,MACL,OAAQ,EAAA,SAAA;AAAA,KAAA;AAAA,IAEP,QAAA;AAAA,GAEL,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,MAAC,EAAI,EAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,UACnC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,OAAI,KAAO,EAAA,EAAE,WAAa,EAAA,KAAA,EACzB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAW,MAAgB,EAAA,CAC9B,CACF,CACF,CACF,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AuthorBox.esm.js","sources":["../../../src/components/QuestionPage/AuthorBox.tsx"],"sourcesContent":["import { Avatar, Box, Grid, Typography } from '@material-ui/core';\nimport React from 'react';\nimport { useEntityAuthor, useStyles, useTranslation } from '../../utils/hooks';\nimport {\n  AnswerResponse,\n  QuestionResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip/RelativeTimeWithTooltip';\nimport { AuthorLink, UpdatedByLink } from '../Links/Links';\n\nexport const AuthorBox = (props: {\n  entity: QuestionResponse | AnswerResponse;\n}) => {\n  const { entity } = props;\n  const styles = useStyles();\n  const { t } = useTranslation();\n  const { name, initials, user } = useEntityAuthor(entity);\n\n  return (\n    <Box className={`qetaAuthorBox ${styles.questionCardAuthor}`}>\n      <Grid container alignItems=\"center\">\n        <Grid item xs={12} style={{ paddingBottom: 0 }}>\n          <Typography className=\"qetaAuthorBoxCreated\" variant=\"caption\">\n            {t('authorBox.postedAtTime')}{' '}\n            <RelativeTimeWithTooltip value={entity.created} />\n          </Typography>\n        </Grid>\n        {entity.updated && entity.updatedBy && (\n          <Grid item xs={12} style={{ paddingBottom: 0, paddingTop: 0 }}>\n            <Typography className=\"qetaAuthorBoxUpdated\" variant=\"caption\">\n              {t('authorBox.updatedAtTime')}{' '}\n              <RelativeTimeWithTooltip value={entity.updated} />{' '}\n              {t('authorBox.updatedBy')} <UpdatedByLink entity={entity} />\n            </Typography>\n          </Grid>\n        )}\n        <Grid item xs={2}>\n          <Avatar\n            src={user?.spec?.profile?.picture}\n            className=\"qetaAuthorBoxAvatar avatar\"\n            alt={name}\n            variant=\"rounded\"\n          >\n            {initials}\n          </Avatar>\n        </Grid>\n        <Grid item xs={10} className={styles.authorLink}>\n          <Box style={{ paddingLeft: '5px' }}>\n            <AuthorLink entity={entity} />\n          </Box>\n        </Grid>\n      </Grid>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAUa,MAAA,SAAA,GAAY,CAAC,KAEpB,KAAA;AACJ,EAAM,MAAA,EAAE,QAAW,GAAA,KAAA,CAAA;AACnB,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AACzB,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA,CAAA;AAC7B,EAAA,MAAM,EAAE,IAAM,EAAA,QAAA,EAAU,IAAK,EAAA,GAAI,gBAAgB,MAAM,CAAA,CAAA;AAEvD,EAAA,2CACG,GAAI,EAAA,EAAA,SAAA,EAAW,iBAAiB,MAAO,CAAA,kBAAkB,sBACvD,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,WAAS,IAAC,EAAA,UAAA,EAAW,4BACxB,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,IAAI,KAAO,EAAA,EAAE,eAAe,CAAE,EAAA,EAAA,sCAC1C,UAAW,EAAA,EAAA,SAAA,EAAU,wBAAuB,OAAQ,EAAA,SAAA,EAAA,EAClD,EAAE,wBAAwB,CAAA,EAAG,qBAC7B,KAAA,CAAA,aAAA,CAAA,uBAAA,EAAA,EAAwB,OAAO,MAAO,CAAA,OAAA,EAAS,CAClD,CACF,CAAA,EACC,OAAO,OAAW,IAAA,MAAA,CAAO,6BACvB,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,EAAA,EAAI,IAAI,KAAO,EAAA,EAAE,eAAe,CAAG,EAAA,UAAA,EAAY,GACxD,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAW,SAAU,EAAA,sBAAA,EAAuB,SAAQ,SAClD,EAAA,EAAA,CAAA,CAAE,yBAAyB,CAAG,EAAA,GAAA,sCAC9B,uBAAwB,EAAA,EAAA,KAAA,EAAO,OAAO,OAAS,EAAA,CAAA,EAAG,KAClD,CAAE,CAAA,qBAAqB,GAAE,GAAC,kBAAA,KAAA,CAAA,aAAA,CAAC,iBAAc,MAAgB,EAAA,CAC5D,CACF,CAEF,kBAAA,KAAA,CAAA,aAAA,CAAC,QAAK,IAAI,EAAA,IAAA,EAAC,IAAI,CACb,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,IAAM,EAAA,IAAA,EAAM,OAAS,EAAA,OAAA;AAAA,MAC1B,SAAU,EAAA,4BAAA;AAAA,MACV,GAAK,EAAA,IAAA;AAAA,MACL,OAAQ,EAAA,SAAA;AAAA,KAAA;AAAA,IAEP,QAAA;AAAA,GAEL,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,MAAC,EAAI,EAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,UACnC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,OAAI,KAAO,EAAA,EAAE,WAAa,EAAA,KAAA,EACzB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAW,MAAgB,EAAA,CAC9B,CACF,CACF,CACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/components/QuestionPage/FavoriteButton.esm.js

@@ -4,10 +4,12 @@ import { useApi } from '@backstage/core-plugin-api';
 import StarIcon from '@material-ui/icons/Star';
 import StarOutlineIcon from '@material-ui/icons/StarOutline';
 import { qetaApiRef } from '../../api/QetaClient.esm.js';
+import { useTranslation } from '../../utils/hooks.esm.js';
 
 const FavoriteButton = (props) => {
   const [entity, setEntity] = React.useState(props.entity);
   const qetaApi = useApi(qetaApiRef);
+  const { t } = useTranslation();
   const favoriteQuestion = () => {
     qetaApi.favoriteQuestion(entity.id).then((response) => {
       setEntity(response);
@@ -18,7 +20,7 @@ const FavoriteButton = (props) => {
       setEntity(response);
     });
   };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, entity.favorite ? /* @__PURE__ */ React.createElement(Tooltip, { title: "Remove this question from favorites" }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, entity.favorite ? /* @__PURE__ */ React.createElement(Tooltip, { title: t("favorite.remove") }, /* @__PURE__ */ React.createElement(
     IconButton,
     {
       "aria-label": "unfavorite",
@@ -27,7 +29,7 @@ const FavoriteButton = (props) => {
       className: "qetaUnfavoriteBtn"
     },
     /* @__PURE__ */ React.createElement(StarIcon, null)
-  )) : /* @__PURE__ */ React.createElement(Tooltip, { title: "Mark this question as favorite" }, /* @__PURE__ */ React.createElement(
+  )) : /* @__PURE__ */ React.createElement(Tooltip, { title: t("favorite.add") }, /* @__PURE__ */ React.createElement(
     IconButton,
     {
       "aria-label": "favorite",