npm - @drodil/backstage-plugin-qeta-react - Versions diffs - 3.35.2 → 3.36.0 - Mend

@drodil/backstage-plugin-qeta-react 3.35.2 → 3.36.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (51) hide show

package/dist/components/LeftMenu/LeftMenu.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LeftMenu.esm.js","sources":["../../../src/components/LeftMenu/LeftMenu.tsx"],"sourcesContent":["import {\n Box,\n Divider,\n ListItemIcon,\n makeStyles,\n MenuItem,\n MenuList,\n SvgIcon,\n Typography,\n} from '@material-ui/core';\nimport AccountBox from '@material-ui/icons/AccountBox';\nimport LoyaltyOutlined from '@material-ui/icons/LoyaltyOutlined';\nimport StarIcon from '@material-ui/icons/Star';\nimport { KeyboardEvent, MouseEvent, ReactNode } from 'react';\nimport { useApp, useRouteRef } from '@backstage/core-plugin-api';\nimport HelpOutlined from '@material-ui/icons/HelpOutlined';\nimport { useNavigate } from 'react-router-dom';\nimport Home from '@material-ui/icons/Home';\nimport { useLocation } from 'react-use';\nimport CollectionsBookmarkIcon from '@material-ui/icons/CollectionsBookmark';\nimport PlaylistPlay from '@material-ui/icons/PlaylistPlay';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport { GroupIcon } from '@backstage/core-components';\nimport {\n articlesRouteRef,\n collectionsRouteRef,\n entitiesRouteRef,\n favoriteQuestionsRouteRef,\n moderatorRouteRef,\n qetaRouteRef,\n questionsRouteRef,\n statisticsRouteRef,\n tagsRouteRef,\n userRouteRef,\n usersRouteRef,\n} from '../../routes';\nimport { TrophyIcon } from '../TopRankingUsersCard';\nimport { useIdentityApi, useIsModerator } from '../../hooks';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\n\nexport type QetaLeftMenuClassKey =\n \| 'leftMenu'\n \| 'inPopup'\n \| 'outsidePopup'\n \| 'selectedMenuItem'\n \| 'nonSelectedMenuItem'\n \| 'menuIcon';\n\nexport const useStyles = makeStyles(\n theme => {\n return {\n leftMenu: {\n top: '0',\n width: '200px',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n transition: 'all 0.2s ease-in-out',\n },\n inPopup: {\n marginRight: 0,\n padding: theme.spacing(1),\n },\n outsidePopup: {\n marginRight: theme.spacing(3),\n float: 'right',\n position: 'sticky',\n top: theme.spacing(2),\n },\n selectedMenuItem: {\n color: theme.palette.primary.contrastText,\n backgroundColor: theme.palette.primary.main,\n borderRadius: theme.shape.borderRadius,\n margin: theme.spacing(0.5, 1),\n padding: theme.spacing(0.75, 1.5),\n transition: 'all 0.2s ease-in-out',\n '&:hover': {\n backgroundColor: theme.palette.primary.dark,\n color: theme.palette.primary.contrastText,\n transform: 'translateX(4px)',\n },\n '& svg': {\n color: theme.palette.primary.contrastText,\n },\n },\n nonSelectedMenuItem: {\n margin: theme.spacing(0.5, 1),\n padding: theme.spacing(0.75, 1.5),\n borderRadius: theme.shape.borderRadius,\n transition: 'all 0.2s ease-in-out',\n color: theme.palette.text.primary,\n '&:hover': {\n backgroundColor: theme.palette.action.hover,\n transform: 'translateX(4px)',\n },\n },\n menuIcon: {\n minWidth: '32px',\n color: 'inherit',\n },\n sectionHeader: {\n padding: theme.spacing(1, 2, 0.5, 2),\n marginTop: theme.spacing(2),\n color: theme.palette.text.secondary,\n fontWeight: 600,\n textTransform: 'uppercase',\n letterSpacing: '0.5px',\n },\n divider: {\n margin: theme.spacing(1, 2),\n backgroundColor: theme.palette.divider,\n },\n };\n },\n { name: 'QetaLeftMenu' },\n);\n\nexport const LeftMenu = (props: {\n onKeyDown?: (event: KeyboardEvent) => void;\n autoFocusItem?: boolean;\n onClick?: (event: MouseEvent<EventTarget>) => void;\n inPopup?: boolean;\n}) => {\n const rootRoute = useRouteRef(qetaRouteRef);\n const tagsRoute = useRouteRef(tagsRouteRef);\n const favoritesRoute = useRouteRef(favoriteQuestionsRouteRef);\n const statisticsRoute = useRouteRef(statisticsRouteRef);\n const userRoute = useRouteRef(userRouteRef);\n const questionsRoute = useRouteRef(questionsRouteRef);\n const articlesRoute = useRouteRef(articlesRouteRef);\n const collectionsRoute = useRouteRef(collectionsRouteRef);\n const entitiesRoute = useRouteRef(entitiesRouteRef);\n const usersRoute = useRouteRef(usersRouteRef);\n const moderatorRoute = useRouteRef(moderatorRouteRef);\n const styles = useStyles();\n const { t } = useTranslationRef(qetaTranslationRef);\n const location = useLocation();\n const navigate = useNavigate();\n const { isModerator } = useIsModerator();\n const app = useApp();\n const {\n value: user,\n loading: loadingUser,\n error: userError,\n } = useIdentityApi(api => api.getBackstageIdentity(), []);\n\n const CustomMenuItem = ({\n route,\n hasSubRoutes,\n children,\n }: {\n route: string;\n hasSubRoutes?: boolean;\n children: ReactNode[];\n }) => {\n return (\n <MenuItem\n onClick={e => {\n if (e.ctrlKey \|\| e.metaKey \|\| e.shiftKey \|\| e.altKey) {\n return;\n }\n e.preventDefault();\n navigate(route);\n if (props.onClick) {\n props.onClick(e);\n }\n }}\n className={\n route === location.pathname \|\|\n (hasSubRoutes && location.pathname?.startsWith(route))\n ? styles.selectedMenuItem\n : styles.nonSelectedMenuItem\n }\n href={route}\n component=\"a\"\n >\n {children}\n </MenuItem>\n );\n };\n\n const EntityIcon = app.getSystemIcon('kind:system') ?? SvgIcon;\n\n return (\n <MenuList\n id=\"left-menu\"\n className={`${styles.leftMenu} ${\n props.inPopup ? styles.inPopup : styles.outsidePopup\n }`}\n onKeyDown={props.onKeyDown}\n autoFocusItem={props.autoFocusItem}\n >\n <Box\n display={\n props.inPopup\n ? {}\n : { xs: 'none', sm: 'none', md: 'none', lg: 'block' }\n }\n >\n <CustomMenuItem route={rootRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <Home fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.home')}\n </CustomMenuItem>\n\n <Typography className={styles.sectionHeader}>\n {t('leftMenu.content')}\n </Typography>\n <Divider className={styles.divider} />\n\n <CustomMenuItem route={questionsRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <HelpOutlined fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.questions')}\n </CustomMenuItem>\n\n <CustomMenuItem route={articlesRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <CollectionsBookmarkIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.articles')}\n </CustomMenuItem>\n\n <CustomMenuItem route={favoritesRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <StarIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.favoriteQuestions')}\n </CustomMenuItem>\n\n <CustomMenuItem route={entitiesRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <EntityIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.entities')}\n </CustomMenuItem>\n\n <CustomMenuItem route={tagsRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <LoyaltyOutlined fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.tags')}\n </CustomMenuItem>\n\n <Typography className={styles.sectionHeader}>\n {t('leftMenu.community')}\n </Typography>\n <Divider className={styles.divider} />\n\n <CustomMenuItem route={collectionsRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <PlaylistPlay fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.collections')}\n </CustomMenuItem>\n\n <CustomMenuItem route={usersRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <GroupIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.users')}\n </CustomMenuItem>\n\n {user && !loadingUser && !userError && (\n <CustomMenuItem route={`${userRoute()}/${user.userEntityRef}`}>\n <ListItemIcon className={styles.menuIcon}>\n <AccountBox fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.profile')}\n </CustomMenuItem>\n )}\n\n <CustomMenuItem route={statisticsRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <TrophyIcon />\n </ListItemIcon>\n {t('leftMenu.statistics')}\n </CustomMenuItem>\n\n {isModerator && (\n <>\n <Typography className={styles.sectionHeader}>\n {t('leftMenu.manage')}\n </Typography>\n <Divider className={styles.divider} />\n\n <CustomMenuItem route={moderatorRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <SettingsIcon />\n </ListItemIcon>\n {t('leftMenu.moderate')}\n </CustomMenuItem>\n </>\n )}\n </Box>\n </MenuList>\n );\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"LeftMenu.esm.js","sources":["../../../src/components/LeftMenu/LeftMenu.tsx"],"sourcesContent":["import {\n Box,\n Divider,\n ListItemIcon,\n makeStyles,\n MenuItem,\n MenuList,\n SvgIcon,\n Typography,\n} from '@material-ui/core';\nimport AccountBox from '@material-ui/icons/AccountBox';\nimport LoyaltyOutlined from '@material-ui/icons/LoyaltyOutlined';\nimport StarIcon from '@material-ui/icons/Star';\nimport { KeyboardEvent, MouseEvent, ReactNode } from 'react';\nimport { useApp, useRouteRef } from '@backstage/core-plugin-api';\nimport HelpOutlined from '@material-ui/icons/HelpOutlined';\nimport { useNavigate } from 'react-router-dom';\nimport Home from '@material-ui/icons/Home';\nimport { useLocation } from 'react-use';\nimport CollectionsBookmarkIcon from '@material-ui/icons/CollectionsBookmark';\nimport PlaylistPlay from '@material-ui/icons/PlaylistPlay';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport { GroupIcon } from '@backstage/core-components';\nimport {\n articlesRouteRef,\n collectionsRouteRef,\n entitiesRouteRef,\n favoriteQuestionsRouteRef,\n linksRouteRef,\n moderatorRouteRef,\n qetaRouteRef,\n questionsRouteRef,\n statisticsRouteRef,\n tagsRouteRef,\n userRouteRef,\n usersRouteRef,\n} from '../../routes';\nimport { TrophyIcon } from '../TopRankingUsersCard';\nimport { useIdentityApi, useIsModerator } from '../../hooks';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport LinkIcon from '@material-ui/icons/Link';\n\nexport type QetaLeftMenuClassKey =\n \| 'leftMenu'\n \| 'inPopup'\n \| 'outsidePopup'\n \| 'selectedMenuItem'\n \| 'nonSelectedMenuItem'\n \| 'menuIcon';\n\nexport const useStyles = makeStyles(\n theme => {\n return {\n leftMenu: {\n top: '0',\n width: '200px',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n transition: 'all 0.2s ease-in-out',\n },\n inPopup: {\n marginRight: 0,\n padding: theme.spacing(1),\n },\n outsidePopup: {\n marginRight: theme.spacing(3),\n float: 'right',\n position: 'sticky',\n top: theme.spacing(2),\n },\n selectedMenuItem: {\n color: theme.palette.primary.contrastText,\n backgroundColor: theme.palette.primary.main,\n borderRadius: theme.shape.borderRadius,\n margin: theme.spacing(0.5, 1),\n padding: theme.spacing(0.75, 1.5),\n transition: 'all 0.2s ease-in-out',\n '&:hover': {\n backgroundColor: theme.palette.primary.dark,\n color: theme.palette.primary.contrastText,\n transform: 'translateX(4px)',\n },\n '& svg': {\n color: theme.palette.primary.contrastText,\n },\n },\n nonSelectedMenuItem: {\n margin: theme.spacing(0.5, 1),\n padding: theme.spacing(0.75, 1.5),\n borderRadius: theme.shape.borderRadius,\n transition: 'all 0.2s ease-in-out',\n color: theme.palette.text.primary,\n '&:hover': {\n backgroundColor: theme.palette.action.hover,\n transform: 'translateX(4px)',\n },\n },\n menuIcon: {\n minWidth: '32px',\n color: 'inherit',\n },\n sectionHeader: {\n padding: theme.spacing(1, 2, 0.5, 2),\n marginTop: theme.spacing(2),\n color: theme.palette.text.secondary,\n fontWeight: 600,\n textTransform: 'uppercase',\n letterSpacing: '0.5px',\n },\n divider: {\n margin: theme.spacing(1, 2),\n backgroundColor: theme.palette.divider,\n },\n };\n },\n { name: 'QetaLeftMenu' },\n);\n\nexport const LeftMenu = (props: {\n onKeyDown?: (event: KeyboardEvent) => void;\n autoFocusItem?: boolean;\n onClick?: (event: MouseEvent<EventTarget>) => void;\n inPopup?: boolean;\n}) => {\n const rootRoute = useRouteRef(qetaRouteRef);\n const tagsRoute = useRouteRef(tagsRouteRef);\n const favoritesRoute = useRouteRef(favoriteQuestionsRouteRef);\n const statisticsRoute = useRouteRef(statisticsRouteRef);\n const userRoute = useRouteRef(userRouteRef);\n const questionsRoute = useRouteRef(questionsRouteRef);\n const articlesRoute = useRouteRef(articlesRouteRef);\n const linksRoute = useRouteRef(linksRouteRef);\n const collectionsRoute = useRouteRef(collectionsRouteRef);\n const entitiesRoute = useRouteRef(entitiesRouteRef);\n const usersRoute = useRouteRef(usersRouteRef);\n const moderatorRoute = useRouteRef(moderatorRouteRef);\n const styles = useStyles();\n const { t } = useTranslationRef(qetaTranslationRef);\n const location = useLocation();\n const navigate = useNavigate();\n const { isModerator } = useIsModerator();\n const app = useApp();\n const {\n value: user,\n loading: loadingUser,\n error: userError,\n } = useIdentityApi(api => api.getBackstageIdentity(), []);\n\n const CustomMenuItem = ({\n route,\n hasSubRoutes,\n children,\n }: {\n route: string;\n hasSubRoutes?: boolean;\n children: ReactNode[];\n }) => {\n return (\n <MenuItem\n onClick={e => {\n if (e.ctrlKey \|\| e.metaKey \|\| e.shiftKey \|\| e.altKey) {\n return;\n }\n e.preventDefault();\n navigate(route);\n if (props.onClick) {\n props.onClick(e);\n }\n }}\n className={\n route === location.pathname \|\|\n (hasSubRoutes && location.pathname?.startsWith(route))\n ? styles.selectedMenuItem\n : styles.nonSelectedMenuItem\n }\n href={route}\n component=\"a\"\n >\n {children}\n </MenuItem>\n );\n };\n\n const EntityIcon = app.getSystemIcon('kind:system') ?? SvgIcon;\n\n return (\n <MenuList\n id=\"left-menu\"\n className={`${styles.leftMenu} ${\n props.inPopup ? styles.inPopup : styles.outsidePopup\n }`}\n onKeyDown={props.onKeyDown}\n autoFocusItem={props.autoFocusItem}\n >\n <Box\n display={\n props.inPopup\n ? {}\n : { xs: 'none', sm: 'none', md: 'none', lg: 'block' }\n }\n >\n <CustomMenuItem route={rootRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <Home fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.home')}\n </CustomMenuItem>\n\n <Typography className={styles.sectionHeader}>\n {t('leftMenu.content')}\n </Typography>\n <Divider className={styles.divider} />\n\n <CustomMenuItem route={questionsRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <HelpOutlined fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.questions')}\n </CustomMenuItem>\n\n <CustomMenuItem route={articlesRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <CollectionsBookmarkIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.articles')}\n </CustomMenuItem>\n\n <CustomMenuItem route={linksRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <LinkIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.links')}\n </CustomMenuItem>\n\n <CustomMenuItem route={favoritesRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <StarIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.favoriteQuestions')}\n </CustomMenuItem>\n\n <CustomMenuItem route={entitiesRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <EntityIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.entities')}\n </CustomMenuItem>\n\n <CustomMenuItem route={tagsRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <LoyaltyOutlined fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.tags')}\n </CustomMenuItem>\n\n <Typography className={styles.sectionHeader}>\n {t('leftMenu.community')}\n </Typography>\n <Divider className={styles.divider} />\n\n <CustomMenuItem route={collectionsRoute()} hasSubRoutes>\n <ListItemIcon className={styles.menuIcon}>\n <PlaylistPlay fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.collections')}\n </CustomMenuItem>\n\n <CustomMenuItem route={usersRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <GroupIcon fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.users')}\n </CustomMenuItem>\n\n {user && !loadingUser && !userError && (\n <CustomMenuItem route={`${userRoute()}/${user.userEntityRef}`}>\n <ListItemIcon className={styles.menuIcon}>\n <AccountBox fontSize=\"small\" />\n </ListItemIcon>\n {t('leftMenu.profile')}\n </CustomMenuItem>\n )}\n\n <CustomMenuItem route={statisticsRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <TrophyIcon />\n </ListItemIcon>\n {t('leftMenu.statistics')}\n </CustomMenuItem>\n\n {isModerator && (\n <>\n <Typography className={styles.sectionHeader}>\n {t('leftMenu.manage')}\n </Typography>\n <Divider className={styles.divider} />\n\n <CustomMenuItem route={moderatorRoute()}>\n <ListItemIcon className={styles.menuIcon}>\n <SettingsIcon />\n </ListItemIcon>\n {t('leftMenu.moderate')}\n </CustomMenuItem>\n </>\n )}\n </Box>\n </MenuList>\n );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/LinkCard/LinkCard.esm.js ADDED Viewed

@@ -0,0 +1,220 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { DeleteModal } from '../DeleteModal/DeleteModal.esm.js';
+import DeleteIcon from '@material-ui/icons/Delete';
+import EditIcon from '@material-ui/icons/Edit';
+import RestoreIcon from '@material-ui/icons/Restore';
+import { FavoriteButton } from '../Buttons/FavoriteButton.esm.js';
+import { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities.esm.js';
+import { CommentSection } from '../CommentSection/CommentSection.esm.js';
+import { useApi, useRouteRef } from '@backstage/core-plugin-api';
+import { LinkButton } from '../Buttons/LinkButton.esm.js';
+import { MarkdownRenderer } from '../MarkdownRenderer/MarkdownRenderer.esm.js';
+import { editLinkRouteRef } from '../../routes.esm.js';
+import { useNavigate } from 'react-router-dom';
+import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
+import { qetaTranslationRef } from '../../translation.esm.js';
+import { makeStyles, Card, CardContent, Box, Grid, Button } from '@material-ui/core';
+import { qetaApiRef } from '../../api.esm.js';
+import 'react-use';
+import '@backstage/catalog-model';
+import 'dataloader';
+import '@backstage/plugin-catalog-react';
+import 'react-use/lib/useAsync';
+import { useIsModerator } from '../../hooks/useIsModerator.esm.js';
+import { AuthorBoxes } from '../AuthorBox/AuthorBoxes.esm.js';
+import { OpenLinkButton } from '../Buttons/OpenLinkButton.esm.js';
+const useStyles = makeStyles(
+  (theme) => ({
+    root: {},
+    contentContainer: {
+      marginLeft: "0.5em",
+      width: "calc(100% - 70px)"
+    },
+    markdownContainer: {
+      paddingBottom: "0.5em"
+    },
+    buttons: {
+      marginTop: "1em",
+      "& *:not(:last-child)": {
+        marginRight: "0.3em"
+      }
+    },
+    metadata: {
+      marginTop: theme.spacing(3)
+    }
+  }),
+  { name: "QetaLinkCard" }
+);
+const LinkCard = (props) => {
+  const { link } = props;
+  const navigate = useNavigate();
+  const qetaApi = useApi(qetaApiRef);
+  const editLinkRoute = useRouteRef(editLinkRouteRef);
+  const [deleteModalOpen, setDeleteModalOpen] = useState(false);
+  const [linkEntity, setLinkEntity] = useState(link);
+  const { isModerator } = useIsModerator();
+  const handleDeleteModalOpen = () => setDeleteModalOpen(true);
+  const handleDeleteModalClose = () => setDeleteModalOpen(false);
+  const { t } = useTranslationRef(qetaTranslationRef);
+  const onCommentAction = (l, _) => {
+    setLinkEntity(l);
+  };
+  const styles = useStyles();
+  const restoreLink = async () => {
+    qetaApi.restorePost(link.id).then((l) => {
+      setLinkEntity(l);
+    });
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Card, { variant: "outlined", className: styles.root, children: /* @__PURE__ */ jsxs(CardContent, { children: [
+      /* @__PURE__ */ jsxs(
+        Box,
+        {
+          display: "flex",
+          justifyContent: "flex-end",
+          alignItems: "flex-start",
+          mb: 1,
+          children: [
+            /* @__PURE__ */ jsx(Box, { display: "flex", alignItems: "center", flexGrow: 1, children: /* @__PURE__ */ jsx(
+              "a",
+              {
+                href: linkEntity.url,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                style: {
+                  fontWeight: 400,
+                  fontSize: "1.2rem",
+                  marginRight: 16,
+                  wordBreak: "break-all",
+                  textDecoration: "underline",
+                  cursor: "pointer"
+                },
+                onClick: (event) => {
+                  event.stopPropagation();
+                  qetaApi.clickLink(linkEntity.id);
+                },
+                children: linkEntity.url
+              }
+            ) }),
+            /* @__PURE__ */ jsx(LinkButton, { entity: linkEntity }),
+            /* @__PURE__ */ jsx(FavoriteButton, { entity: linkEntity }),
+            /* @__PURE__ */ jsx(OpenLinkButton, { entity: linkEntity })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Grid,
+        {
+          container: true,
+          spacing: 2,
+          justifyContent: "flex-start",
+          style: { flexWrap: "nowrap" },
+          children: /* @__PURE__ */ jsxs(
+            Grid,
+            {
+              item: true,
+              className: styles.contentContainer,
+              style: { flexGrow: "1" },
+              children: [
+                linkEntity.headerImage && /* @__PURE__ */ jsx(
+                  Grid,
+                  {
+                    item: true,
+                    justifyContent: "center",
+                    style: { textAlign: "center" },
+                    children: /* @__PURE__ */ jsx(
+                      "img",
+                      {
+                        src: linkEntity.headerImage,
+                        alt: linkEntity.title,
+                        style: {
+                          maxWidth: "90%",
+                          maxHeight: "300px",
+                          margin: "1rem"
+                        }
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx(Grid, { item: true, className: styles.markdownContainer, children: /* @__PURE__ */ jsx(MarkdownRenderer, { content: linkEntity.content }) }),
+                /* @__PURE__ */ jsxs(
+                  Box,
+                  {
+                    display: "flex",
+                    alignItems: "flex-start",
+                    justifyContent: "space-between",
+                    className: styles.metadata,
+                    style: { width: "100%" },
+                    children: [
+                      /* @__PURE__ */ jsxs(Box, { flex: "1 1 0%", minWidth: 0, children: [
+                        /* @__PURE__ */ jsx(TagsAndEntities, { entity: linkEntity }),
+                        /* @__PURE__ */ jsxs(Box, { className: styles.buttons, children: [
+                          (link.canEdit || link.canDelete) && /* @__PURE__ */ jsxs(Fragment, { children: [
+                            link.canEdit && /* @__PURE__ */ jsx(
+                              Button,
+                              {
+                                variant: "outlined",
+                                size: "small",
+                                startIcon: /* @__PURE__ */ jsx(EditIcon, {}),
+                                onClick: () => navigate(
+                                  editLinkRoute({
+                                    id: link.id.toString(10)
+                                  })
+                                ),
+                                className: "qetaQuestionCardEditBtn",
+                                children: t("linkPage.editButton")
+                              }
+                            ),
+                            link.canDelete && /* @__PURE__ */ jsxs(Fragment, { children: [
+                              /* @__PURE__ */ jsx(
+                                Button,
+                                {
+                                  variant: "outlined",
+                                  size: "small",
+                                  color: "secondary",
+                                  onClick: handleDeleteModalOpen,
+                                  startIcon: /* @__PURE__ */ jsx(DeleteIcon, {}),
+                                  children: t("deleteModal.deleteButton")
+                                }
+                              ),
+                              /* @__PURE__ */ jsx(
+                                DeleteModal,
+                                {
+                                  open: deleteModalOpen,
+                                  onClose: handleDeleteModalClose,
+                                  entity: linkEntity
+                                }
+                              )
+                            ] })
+                          ] }),
+                          isModerator && linkEntity.status === "deleted" && /* @__PURE__ */ jsx(
+                            Button,
+                            {
+                              variant: "contained",
+                              size: "small",
+                              startIcon: /* @__PURE__ */ jsx(RestoreIcon, {}),
+                              onClick: () => restoreLink(),
+                              className: "qetaLinkCardRestoreBtn",
+                              children: t("linkPage.restoreButton")
+                            }
+                          )
+                        ] })
+                      ] }),
+                      /* @__PURE__ */ jsx(AuthorBoxes, { entity: linkEntity })
+                    ]
+                  }
+                )
+              ]
+            }
+          )
+        }
+      )
+    ] }) }),
+    link.status === "active" && /* @__PURE__ */ jsx(CommentSection, { post: linkEntity, onCommentAction })
+  ] });
+};
+export { LinkCard };
+//# sourceMappingURL=LinkCard.esm.js.map

package/dist/components/LinkCard/LinkCard.esm.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"LinkCard.esm.js","sources":["../../../src/components/LinkCard/LinkCard.tsx"],"sourcesContent":["import {\n AnswerResponse,\n PostResponse,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { useState } from 'react';\nimport { DeleteModal } from '../DeleteModal/DeleteModal';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport EditIcon from '@material-ui/icons/Edit';\nimport RestoreIcon from '@material-ui/icons/Restore';\nimport { FavoriteButton } from '../Buttons/FavoriteButton';\nimport { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities';\nimport { CommentSection } from '../CommentSection/CommentSection';\nimport { useApi, useRouteRef } from '@backstage/core-plugin-api';\nimport { LinkButton } from '../Buttons/LinkButton';\nimport { MarkdownRenderer } from '../MarkdownRenderer/MarkdownRenderer';\nimport { editLinkRouteRef } from '../../routes';\nimport { useNavigate } from 'react-router-dom';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport {\n Box,\n Button,\n Card,\n CardContent,\n Grid,\n makeStyles,\n} from '@material-ui/core';\nimport { useIsModerator } from '../../hooks';\nimport { AuthorBoxes } from '../AuthorBox/AuthorBoxes.tsx';\nimport { OpenLinkButton } from '../Buttons/OpenLinkButton.tsx';\nimport { qetaApiRef } from '../../api.ts';\n\nexport type LinkCardClassKeys =\n | 'root'\n | 'contentContainer'\n | 'markdownContainer'\n | 'buttons'\n | 'metadata';\n\nconst useStyles = makeStyles(\n theme => ({\n root: {},\n contentContainer: {\n marginLeft: '0.5em',\n width: 'calc(100% - 70px)',\n },\n markdownContainer: {\n paddingBottom: '0.5em',\n },\n buttons: {\n marginTop: '1em',\n '& *:not(:last-child)': {\n marginRight: '0.3em',\n },\n },\n metadata: {\n marginTop: theme.spacing(3),\n },\n }),\n { name: 'QetaLinkCard' },\n);\n\nexport const LinkCard = (props: { link: PostResponse }) => {\n const { link } = props;\n const navigate = useNavigate();\n const qetaApi = useApi(qetaApiRef);\n const editLinkRoute = useRouteRef(editLinkRouteRef);\n const [deleteModalOpen, setDeleteModalOpen] = useState(false);\n const [linkEntity, setLinkEntity] = useState(link);\n const { isModerator } = useIsModerator();\n const handleDeleteModalOpen = () => setDeleteModalOpen(true);\n const handleDeleteModalClose = () => setDeleteModalOpen(false);\n const { t } = useTranslationRef(qetaTranslationRef);\n const onCommentAction = (l: PostResponse, _?: AnswerResponse) => {\n setLinkEntity(l);\n };\n const styles = useStyles();\n\n const restoreLink = async () => {\n qetaApi.restorePost(link.id).then(l => {\n setLinkEntity(l);\n });\n };\n\n return (\n <>\n <Card variant=\"outlined\" className={styles.root}>\n <CardContent>\n <Box\n display=\"flex\"\n justifyContent=\"flex-end\"\n alignItems=\"flex-start\"\n mb={1}\n >\n <Box display=\"flex\" alignItems=\"center\" flexGrow={1}>\n <a\n href={linkEntity.url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n style={{\n fontWeight: 400,\n fontSize: '1.2rem',\n marginRight: 16,\n wordBreak: 'break-all',\n textDecoration: 'underline',\n cursor: 'pointer',\n }}\n onClick={event => {\n event.stopPropagation();\n qetaApi.clickLink(linkEntity.id);\n }}\n >\n {linkEntity.url}\n </a>\n </Box>\n <LinkButton entity={linkEntity} />\n <FavoriteButton entity={linkEntity} />\n <OpenLinkButton entity={linkEntity} />\n </Box>\n <Grid\n container\n spacing={2}\n justifyContent=\"flex-start\"\n style={{ flexWrap: 'nowrap' }}\n >\n <Grid\n item\n className={styles.contentContainer}\n style={{ flexGrow: '1' }}\n >\n {linkEntity.headerImage && (\n <Grid\n item\n justifyContent=\"center\"\n style={{ textAlign: 'center' }}\n >\n <img\n src={linkEntity.headerImage}\n alt={linkEntity.title}\n style={{\n maxWidth: '90%',\n maxHeight: '300px',\n margin: '1rem',\n }}\n />\n </Grid>\n )}\n <Grid item className={styles.markdownContainer}>\n <MarkdownRenderer content={linkEntity.content} />\n </Grid>\n <Box\n display=\"flex\"\n alignItems=\"flex-start\"\n justifyContent=\"space-between\"\n className={styles.metadata}\n style={{ width: '100%' }}\n >\n <Box flex=\"1 1 0%\" minWidth={0}>\n <TagsAndEntities entity={linkEntity} />\n <Box className={styles.buttons}>\n {(link.canEdit || link.canDelete) && (\n <>\n {link.canEdit && (\n <Button\n variant=\"outlined\"\n size=\"small\"\n startIcon={<EditIcon />}\n onClick={() =>\n navigate(\n editLinkRoute({\n id: link.id.toString(10),\n }),\n )\n }\n className=\"qetaQuestionCardEditBtn\"\n >\n {t('linkPage.editButton')}\n </Button>\n )}\n {link.canDelete && (\n <>\n <Button\n variant=\"outlined\"\n size=\"small\"\n color=\"secondary\"\n onClick={handleDeleteModalOpen}\n startIcon={<DeleteIcon />}\n >\n {t('deleteModal.deleteButton')}\n </Button>\n <DeleteModal\n open={deleteModalOpen}\n onClose={handleDeleteModalClose}\n entity={linkEntity}\n />\n </>\n )}\n </>\n )}\n {isModerator && linkEntity.status === 'deleted' && (\n <Button\n variant=\"contained\"\n size=\"small\"\n startIcon={<RestoreIcon />}\n onClick={() => restoreLink()}\n className=\"qetaLinkCardRestoreBtn\"\n >\n {t('linkPage.restoreButton')}\n </Button>\n )}\n </Box>\n </Box>\n <AuthorBoxes entity={linkEntity} />\n </Box>\n </Grid>\n </Grid>\n </CardContent>\n </Card>\n {link.status === 'active' && (\n <CommentSection post={linkEntity} onCommentAction={onCommentAction} />\n )}\n </>\n );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/PostForm/PostForm.esm.js CHANGED Viewed

@@ -5,13 +5,14 @@ import { Alert } from '@material-ui/lab';
 import { useState, useCallback, useEffect } from 'react';
 import { useForm, Controller } from 'react-hook-form';
 import { useNavigate, useSearchParams } from 'react-router-dom';
+import { selectByPostType } from '@drodil/backstage-plugin-qeta-common';
 import { MarkdownEditor } from '../MarkdownEditor/MarkdownEditor.esm.js';
 import { catalogApiRef } from '@backstage/plugin-catalog-react';
 import { stringifyEntityRef } from '@backstage/catalog-model';
 import { compact } from 'lodash';
 import { TagInput } from './TagInput.esm.js';
 import { EntitiesInput } from './EntitiesInput.esm.js';
-import { questionRouteRef, articleRouteRef } from '../../routes.esm.js';
+import { questionRouteRef, articleRouteRef, linkRouteRef } from '../../routes.esm.js';
 import { PostAnonymouslyCheckbox } from '../PostAnonymouslyCheckbox/PostAnonymouslyCheckbox.esm.js';
 import { useConfirmNavigationIfEdited } from '../../utils/utils.esm.js';
 import { qetaApiRef } from '../../api.esm.js';
@@ -72,6 +73,7 @@ const getValues = async (api, catalogApi, type, id) => {
     entities: "items" in entities ? compact(entities.items) : [],
     type,
     headerImage: post.headerImage,
+    url: post.url,
     images: post.images ?? [],
     status: post.status
   };
@@ -80,6 +82,7 @@ const PostForm = (props) => {
   const { id, entity, onPost, entityPage, type, template, onFormChange } = props;
   const questionRoute = useRouteRef(questionRouteRef);
   const articleRoute = useRouteRef(articleRouteRef);
+  const linkRoute = useRouteRef(linkRouteRef);
   const navigate = useNavigate();
   const analytics = useAnalytics();
   const [entityRef, setEntityRef] = useState(entity);
@@ -96,6 +99,9 @@ const PostForm = (props) => {
   const [images, setImages] = useState([]);
   const [status, setStatus] = useState("draft");
   const [searchParams, _setSearchParams] = useSearchParams();
+  const [urlToCheck, setUrlToCheck] = useState("");
+  const validUrl = /^https?:\/\/\S+$/;
+  const [favicon, setFavicon] = useState(false);
   const { t } = useTranslationRef(qetaTranslationRef);
   const qetaApi = useApi(qetaApiRef);
   const catalogApi = useApi(catalogApiRef);
@@ -104,6 +110,7 @@ const PostForm = (props) => {
   const allowAnonymouns = configApi.getOptionalBoolean("qeta.allowAnonymous");
   const minEntities = configApi.getOptionalNumber("qeta.entities.min") ?? 0;
   const minTags = configApi.getOptionalNumber("qeta.tags.min") ?? 0;
+  const isLink = type === "link";
   const {
     handleSubmit,
     control,
@@ -118,7 +125,12 @@ const PostForm = (props) => {
   const postQuestion = useCallback(
     (data, autoSave = false) => {
       setPosting(true);
-      const route = type === "question" ? questionRoute : articleRoute;
+      const route = selectByPostType(
+        type,
+        questionRoute,
+        articleRoute,
+        linkRoute
+      );
       const queryParams = new URLSearchParams();
       if (entity) {
         queryParams.set("entity", entity);
@@ -216,6 +228,7 @@ const PostForm = (props) => {
       type,
       questionRoute,
       articleRoute,
+      linkRoute,
       entity,
       entityPage,
       draftId,
@@ -290,6 +303,42 @@ const PostForm = (props) => {
     setTitleCharCount(e.target.value.length);
     setValue("title", e.target.value, { shouldValidate: true });
   };
+  const handleUrlChange = (e) => {
+    setFavicon(false);
+    setValue("url", e.target.value, { shouldValidate: true });
+  };
+  const validateUrl = (value) => {
+    if (value === "") {
+      setFavicon(false);
+      return false;
+    } else if (!value || !validUrl.test(value)) {
+      setFavicon(false);
+      return t("postForm.urlInput.invalid");
+    }
+    setUrlToCheck(value);
+    return true;
+  };
+  useDebounce(
+    () => {
+      if (!urlToCheck.length || !validUrl.test(urlToCheck)) {
+        return;
+      }
+      qetaApi.fetchURLMetadata({ url: urlToCheck }).then((response) => {
+        setFavicon(true);
+        if (response.title) {
+          setValue("title", response.title, { shouldValidate: true });
+        }
+        if (response.content) {
+          setValue("content", response.content, { shouldValidate: true });
+        }
+        if (response.image) {
+          setValue("headerImage", response.image, { shouldValidate: true });
+        }
+      });
+    },
+    400,
+    [urlToCheck]
+  );
   const autoSavePost = useCallback(() => {
     if (autoSaveEnabled && edited && isValid && !posting) {
       const formData = getFormValues();
@@ -369,6 +418,63 @@ const PostForm = (props) => {
             name: "headerImage"
           }
         ),
+        isLink && /* @__PURE__ */ jsxs(Box, { mb: 2, display: "flex", alignItems: "center", style: { gap: 8 }, children: [
+          favicon && /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: `https://www.google.com/s2/favicons?domain=${encodeURIComponent(
+                urlToCheck
+              )}&sz=16`,
+              alt: "Favicon",
+              style: {
+                width: 16,
+                height: 16,
+                marginRight: 4,
+                marginBottom: 16
+              },
+              onError: (e) => e.currentTarget.style.display = "none"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Controller,
+            {
+              name: "url",
+              control,
+              rules: {
+                required: true,
+                validate: validateUrl
+              },
+              render: () => /* @__PURE__ */ jsx(
+                TextField,
+                {
+                  label: t("postForm.urlInput.label"),
+                  className: "qetaAskFormTitle",
+                  required: true,
+                  fullWidth: true,
+                  error: !!errors.url,
+                  margin: "normal",
+                  variant: "outlined",
+                  name: "url",
+                  helperText: errors.url?.message || /* @__PURE__ */ jsx("span", { children: t("postForm.urlInput.helperText") }),
+                  placeholder: t("postForm.urlInput.placeholder"),
+                  FormHelperTextProps: {
+                    style: { marginLeft: "0.2em" }
+                  },
+                  value: control._formValues.url ?? "",
+                  onChange: handleUrlChange
+                }
+              )
+            }
+          ),
+          control._formValues.headerImage && /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: control._formValues.headerImage,
+              alt: "Preview",
+              style: { maxHeight: 54, marginBottom: 14 }
+            }
+          )
+        ] }),
         /* @__PURE__ */ jsx(Box, { mb: 2, children: /* @__PURE__ */ jsx(
           TextField,
           {
@@ -388,7 +494,9 @@ const PostForm = (props) => {
                 "/255"
               ] })
             ] }),
-            placeholder: t("postForm.titleInput.placeholder"),
+            placeholder: t(
+              isLink ? "postForm.titleInput.placeholder_link" : "postForm.titleInput.placeholder"
+            ),
             FormHelperTextProps: {
               style: { marginLeft: "0.2em" }
             },
@@ -431,32 +539,46 @@ const PostForm = (props) => {
             ]
           }
         ),
-        /* @__PURE__ */ jsx(Collapse, { in: showTips, children: /* @__PURE__ */ jsx(Box, { mb: 2, p: 2, children: /* @__PURE__ */ jsx(Typography, { variant: "body2", children: /* @__PURE__ */ jsx("ul", { style: { margin: 0, paddingLeft: 20 }, children: type === "article" ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("li", { children: t("postForm.tips_article_1") }),
-          /* @__PURE__ */ jsx("li", { children: t("postForm.tips_article_2") }),
-          /* @__PURE__ */ jsx("li", { children: t("postForm.tips_article_3") }),
-          /* @__PURE__ */ jsx("li", { children: t("postForm.tips_article_4") })
-        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("li", { children: t("postForm.tips_question_1") }),
-          /* @__PURE__ */ jsx("li", { children: t("postForm.tips_question_2") }),
-          /* @__PURE__ */ jsx("li", { children: t("postForm.tips_question_3") }),
-          /* @__PURE__ */ jsx("li", { children: t("postForm.tips_question_4") })
-        ] }) }) }) }) }),
+        /* @__PURE__ */ jsx(Collapse, { in: showTips, children: /* @__PURE__ */ jsx(Box, { mb: 2, p: 2, children: /* @__PURE__ */ jsx(Typography, { variant: "body2", children: /* @__PURE__ */ jsx("ul", { style: { margin: 0, paddingLeft: 20 }, children: selectByPostType(
+          type,
+          /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_question_1") }),
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_question_2") }),
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_question_3") }),
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_question_4") })
+          ] }),
+          /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_article_1") }),
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_article_2") }),
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_article_3") }),
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_article_4") })
+          ] }),
+          /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_link_1") }),
+            /* @__PURE__ */ jsx("li", { children: t("postForm.tips_link_2") })
+          ] })
+        ) }) }) }) }),
         /* @__PURE__ */ jsx(
           Controller,
           {
             control,
             rules: {
-              required: true
+              required: !isLink
             },
             render: ({ field: { onChange, value } }) => /* @__PURE__ */ jsx(
               MarkdownEditor,
               {
+                required: !isLink,
                 value,
                 onChange,
-                height: 400,
+                height: !isLink ? 400 : 150,
                 error: "content" in errors,
-                placeholder: type === "article" ? t("postForm.contentInput.placeholder_article") : t("postForm.contentInput.placeholder_question"),
+                placeholder: selectByPostType(
+                  type,
+                  t("postForm.contentInput.placeholder_question"),
+                  t("postForm.contentInput.placeholder_article"),
+                  t("postForm.contentInput.placeholder_link")
+                ),
                 onImageUpload,
                 postId: id ? Number(id) : void 0,
                 onTagsChange: (tags) => {