@drodil/backstage-plugin-qeta-react 2.14.0 → 3.0.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.
- package/dist/api.esm.js +8 -0
- package/dist/api.esm.js.map +1 -0
- package/dist/components/AnswerCard/AnswerCard.esm.js +113 -0
- package/dist/components/AnswerCard/AnswerCard.esm.js.map +1 -0
- package/dist/components/AnswerForm/AnswerForm.esm.js +153 -0
- package/dist/components/AnswerForm/AnswerForm.esm.js.map +1 -0
- package/dist/components/AnswersContainer/AnswerList.esm.js +100 -0
- package/dist/components/AnswersContainer/AnswerList.esm.js.map +1 -0
- package/dist/components/AnswersContainer/AnswerListItem.esm.js +90 -0
- package/dist/components/AnswersContainer/AnswerListItem.esm.js.map +1 -0
- package/dist/components/AnswersContainer/AnswersContainer.esm.js +210 -0
- package/dist/components/AnswersContainer/AnswersContainer.esm.js.map +1 -0
- package/dist/components/ArticleContent/ArticleButtons.esm.js +90 -0
- package/dist/components/ArticleContent/ArticleButtons.esm.js.map +1 -0
- package/dist/components/ArticleContent/ArticleContent.esm.js +78 -0
- package/dist/components/ArticleContent/ArticleContent.esm.js.map +1 -0
- package/dist/components/AuthorBox/AuthorBox.esm.js +25 -0
- package/dist/components/AuthorBox/AuthorBox.esm.js.map +1 -0
- package/dist/components/Buttons/AddToCollectionButton.esm.js +68 -0
- package/dist/components/Buttons/AddToCollectionButton.esm.js.map +1 -0
- package/dist/components/Buttons/AskQuestionButton.esm.js +40 -0
- package/dist/components/Buttons/AskQuestionButton.esm.js.map +1 -0
- package/dist/components/Buttons/BackToArticlesButton.esm.js +40 -0
- package/dist/components/Buttons/BackToArticlesButton.esm.js.map +1 -0
- package/dist/components/Buttons/BackToCollectionsButton.esm.js +25 -0
- package/dist/components/Buttons/BackToCollectionsButton.esm.js.map +1 -0
- package/dist/components/Buttons/BackToQuestionsButton.esm.js +40 -0
- package/dist/components/Buttons/BackToQuestionsButton.esm.js.map +1 -0
- package/dist/components/Buttons/CreateCollectionButton.esm.js +29 -0
- package/dist/components/Buttons/CreateCollectionButton.esm.js.map +1 -0
- package/dist/components/Buttons/EntityFollowButton.esm.js +34 -0
- package/dist/components/Buttons/EntityFollowButton.esm.js.map +1 -0
- package/dist/components/Buttons/FavoriteButton.esm.js +45 -0
- package/dist/components/Buttons/FavoriteButton.esm.js.map +1 -0
- package/dist/components/Buttons/LinkButton.esm.js +28 -0
- package/dist/components/Buttons/LinkButton.esm.js.map +1 -0
- package/dist/components/Buttons/TagFollowButton.esm.js +34 -0
- package/dist/components/Buttons/TagFollowButton.esm.js.map +1 -0
- package/dist/components/Buttons/VoteButtons.esm.js +75 -0
- package/dist/components/Buttons/VoteButtons.esm.js.map +1 -0
- package/dist/components/Buttons/WriteArticleButton.esm.js +40 -0
- package/dist/components/Buttons/WriteArticleButton.esm.js.map +1 -0
- package/dist/components/CollectionCard/CollectionCard.esm.js +63 -0
- package/dist/components/CollectionCard/CollectionCard.esm.js.map +1 -0
- package/dist/components/CollectionForm/CollectionForm.esm.js +251 -0
- package/dist/components/CollectionForm/CollectionForm.esm.js.map +1 -0
- package/dist/components/CollectionsGrid/CollectionsGrid.esm.js +40 -0
- package/dist/components/CollectionsGrid/CollectionsGrid.esm.js.map +1 -0
- package/dist/components/CollectionsGrid/CollectionsGridContent.esm.js +67 -0
- package/dist/components/CollectionsGrid/CollectionsGridContent.esm.js.map +1 -0
- package/dist/components/CollectionsGrid/CollectionsGridItem.esm.js +48 -0
- package/dist/components/CollectionsGrid/CollectionsGridItem.esm.js.map +1 -0
- package/dist/components/CommentSection/CommentList.esm.js +47 -0
- package/dist/components/CommentSection/CommentList.esm.js.map +1 -0
- package/dist/components/CommentSection/CommentSection.esm.js +126 -0
- package/dist/components/CommentSection/CommentSection.esm.js.map +1 -0
- package/dist/components/DeleteModal/DeleteModal.esm.js +88 -0
- package/dist/components/DeleteModal/DeleteModal.esm.js.map +1 -0
- package/dist/components/EntitiesGrid/EntitiesGrid.esm.js +45 -0
- package/dist/components/EntitiesGrid/EntitiesGrid.esm.js.map +1 -0
- package/dist/components/EntitiesGrid/EntitiesGridItem.esm.js +61 -0
- package/dist/components/EntitiesGrid/EntitiesGridItem.esm.js.map +1 -0
- package/dist/components/FilterPanel/DateRangeFilter.esm.js +110 -0
- package/dist/components/FilterPanel/DateRangeFilter.esm.js.map +1 -0
- package/dist/components/FilterPanel/FilterPanel.esm.js +238 -0
- package/dist/components/FilterPanel/FilterPanel.esm.js.map +1 -0
- package/dist/components/FollowedLists/FollowedEntitiesList.esm.js +43 -0
- package/dist/components/FollowedLists/FollowedEntitiesList.esm.js.map +1 -0
- package/dist/components/FollowedLists/FollowedTagsList.esm.js +43 -0
- package/dist/components/FollowedLists/FollowedTagsList.esm.js.map +1 -0
- package/dist/components/HomePageCards/ImpactCard.esm.js +22 -0
- package/dist/components/HomePageCards/ImpactCard.esm.js.map +1 -0
- package/dist/components/HomePageCards/PostsCard.esm.js +42 -0
- package/dist/components/HomePageCards/PostsCard.esm.js.map +1 -0
- package/dist/components/Links/Links.esm.js +33 -0
- package/dist/components/Links/Links.esm.js.map +1 -0
- package/dist/components/MarkdownEditor/MarkdownEditor.esm.js +63 -0
- package/dist/components/MarkdownEditor/MarkdownEditor.esm.js.map +1 -0
- package/dist/components/MarkdownRenderer/MarkdownRenderer.esm.js +97 -0
- package/dist/components/MarkdownRenderer/MarkdownRenderer.esm.js.map +1 -0
- package/dist/components/PostAnonymouslyCheckbox/PostAnonymouslyCheckbox.esm.js +34 -0
- package/dist/components/PostAnonymouslyCheckbox/PostAnonymouslyCheckbox.esm.js.map +1 -0
- package/dist/components/PostForm/EntitiesInput.esm.js +100 -0
- package/dist/components/PostForm/EntitiesInput.esm.js.map +1 -0
- package/dist/components/PostForm/PostForm.esm.js +283 -0
- package/dist/components/PostForm/PostForm.esm.js.map +1 -0
- package/dist/components/PostForm/TagInput.esm.js +81 -0
- package/dist/components/PostForm/TagInput.esm.js.map +1 -0
- package/dist/components/PostHighlightList/PostHighlightList.esm.js +72 -0
- package/dist/components/PostHighlightList/PostHighlightList.esm.js.map +1 -0
- package/dist/components/PostsContainer/NoPostsCard.esm.js +50 -0
- package/dist/components/PostsContainer/NoPostsCard.esm.js.map +1 -0
- package/dist/components/PostsContainer/PostList.esm.js +113 -0
- package/dist/components/PostsContainer/PostList.esm.js.map +1 -0
- package/dist/components/PostsContainer/PostListItem.esm.js +138 -0
- package/dist/components/PostsContainer/PostListItem.esm.js.map +1 -0
- package/dist/components/PostsContainer/PostsContainer.esm.js +152 -0
- package/dist/components/PostsContainer/PostsContainer.esm.js.map +1 -0
- package/dist/components/PostsGrid/PostsGrid.esm.js +146 -0
- package/dist/components/PostsGrid/PostsGrid.esm.js.map +1 -0
- package/dist/components/PostsGrid/PostsGridContent.esm.js +90 -0
- package/dist/components/PostsGrid/PostsGridContent.esm.js.map +1 -0
- package/dist/components/PostsGrid/PostsGridItem.esm.js +57 -0
- package/dist/components/PostsGrid/PostsGridItem.esm.js.map +1 -0
- package/dist/components/QuestionCard/QuestionCard.esm.js +107 -0
- package/dist/components/QuestionCard/QuestionCard.esm.js.map +1 -0
- package/dist/components/QuestionsTable/QuestionTableRow.esm.js +21 -0
- package/dist/components/QuestionsTable/QuestionTableRow.esm.js.map +1 -0
- package/dist/components/QuestionsTable/QuestionsTable.esm.js +131 -0
- package/dist/components/QuestionsTable/QuestionsTable.esm.js.map +1 -0
- package/dist/components/RelativeTimeWithTooltip/RelativeTimeWithTooltip.esm.js +22 -0
- package/dist/components/RelativeTimeWithTooltip/RelativeTimeWithTooltip.esm.js.map +1 -0
- package/dist/components/StatsChart/StatsChart.esm.js +245 -0
- package/dist/components/StatsChart/StatsChart.esm.js.map +1 -0
- package/dist/components/SummaryStatsGrid/SummaryStatsGrid.esm.js +53 -0
- package/dist/components/SummaryStatsGrid/SummaryStatsGrid.esm.js.map +1 -0
- package/dist/components/TagsAndEntities/EntityChip.esm.js +80 -0
- package/dist/components/TagsAndEntities/EntityChip.esm.js.map +1 -0
- package/dist/components/TagsAndEntities/TagChip.esm.js +78 -0
- package/dist/components/TagsAndEntities/TagChip.esm.js.map +1 -0
- package/dist/components/TagsAndEntities/TagsAndEntities.esm.js +32 -0
- package/dist/components/TagsAndEntities/TagsAndEntities.esm.js.map +1 -0
- package/dist/components/TagsGrid/EditTagModal.esm.js +73 -0
- package/dist/components/TagsGrid/EditTagModal.esm.js.map +1 -0
- package/dist/components/TagsGrid/TagGridItem.esm.js +56 -0
- package/dist/components/TagsGrid/TagGridItem.esm.js.map +1 -0
- package/dist/components/TagsGrid/TagsGrid.esm.js +45 -0
- package/dist/components/TagsGrid/TagsGrid.esm.js.map +1 -0
- package/dist/components/TopRankingUsersCard/TopRankingUsersCard.esm.js +161 -0
- package/dist/components/TopRankingUsersCard/TopRankingUsersCard.esm.js.map +1 -0
- package/dist/components/TopRankingUsersCard/TrophyIcon.esm.js +19 -0
- package/dist/components/TopRankingUsersCard/TrophyIcon.esm.js.map +1 -0
- package/dist/components/TopRankingUsersCard/styles.esm.js +23 -0
- package/dist/components/TopRankingUsersCard/styles.esm.js.map +1 -0
- package/dist/components/UsersGrid/UsersGrid.esm.js +43 -0
- package/dist/components/UsersGrid/UsersGrid.esm.js.map +1 -0
- package/dist/components/UsersGrid/UsersGridItem.esm.js +66 -0
- package/dist/components/UsersGrid/UsersGridItem.esm.js.map +1 -0
- package/dist/index.d.ts +568 -1
- package/dist/index.esm.js +45 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/routes.esm.js +56 -1
- package/dist/routes.esm.js.map +1 -1
- package/dist/translation.esm.js +470 -0
- package/dist/translation.esm.js.map +1 -0
- package/dist/utils/hooks.esm.js +734 -0
- package/dist/utils/hooks.esm.js.map +1 -0
- package/dist/utils/utils.esm.js +93 -0
- package/dist/utils/utils.esm.js.map +1 -0
- package/package.json +32 -5
|
@@ -0,0 +1,152 @@
|
|
|
1
|
+
import { usePaginatedPosts, useTranslation } from '../../utils/hooks.esm.js';
|
|
2
|
+
import { Box, Typography, Grid, TextField, Button, Collapse } from '@material-ui/core';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { FilterPanel } from '../FilterPanel/FilterPanel.esm.js';
|
|
5
|
+
import { PostList } from './PostList.esm.js';
|
|
6
|
+
import FilterList from '@material-ui/icons/FilterList';
|
|
7
|
+
import { AskQuestionButton } from '../Buttons/AskQuestionButton.esm.js';
|
|
8
|
+
import { EntityRefLink } from '@backstage/plugin-catalog-react';
|
|
9
|
+
import { TagFollowButton } from '../Buttons/TagFollowButton.esm.js';
|
|
10
|
+
import { EntityFollowButton } from '../Buttons/EntityFollowButton.esm.js';
|
|
11
|
+
import '@backstage/core-components';
|
|
12
|
+
import '@backstage/core-plugin-api';
|
|
13
|
+
import '@backstage/catalog-model';
|
|
14
|
+
import 'react-router-dom';
|
|
15
|
+
import '../../routes.esm.js';
|
|
16
|
+
import '@material-ui/icons/ChevronLeft';
|
|
17
|
+
import { WriteArticleButton } from '../Buttons/WriteArticleButton.esm.js';
|
|
18
|
+
import '@material-ui/icons/PlaylistAdd';
|
|
19
|
+
import '@backstage/plugin-permission-react';
|
|
20
|
+
import '@drodil/backstage-plugin-qeta-common';
|
|
21
|
+
import '@material-ui/icons/AddCircle';
|
|
22
|
+
import '@material-ui/icons/RemoveCircle';
|
|
23
|
+
import '../../api.esm.js';
|
|
24
|
+
import { capitalize } from 'lodash';
|
|
25
|
+
|
|
26
|
+
const PostsContainer = (props) => {
|
|
27
|
+
const {
|
|
28
|
+
type,
|
|
29
|
+
tags,
|
|
30
|
+
author,
|
|
31
|
+
entity,
|
|
32
|
+
showFilters,
|
|
33
|
+
showTitle,
|
|
34
|
+
title,
|
|
35
|
+
favorite,
|
|
36
|
+
showAskButton,
|
|
37
|
+
showWriteButton,
|
|
38
|
+
showNoQuestionsBtn
|
|
39
|
+
} = props;
|
|
40
|
+
const {
|
|
41
|
+
onSearchQueryChange,
|
|
42
|
+
filters,
|
|
43
|
+
response,
|
|
44
|
+
loading,
|
|
45
|
+
error,
|
|
46
|
+
setShowFilterPanel,
|
|
47
|
+
showFilterPanel,
|
|
48
|
+
onFilterChange,
|
|
49
|
+
onPageChange,
|
|
50
|
+
onPageSizeChange,
|
|
51
|
+
page,
|
|
52
|
+
postsPerPage,
|
|
53
|
+
pageCount
|
|
54
|
+
} = usePaginatedPosts(props);
|
|
55
|
+
const { t } = useTranslation();
|
|
56
|
+
const itemType = capitalize(t(`common.${type ?? "post"}`, {}));
|
|
57
|
+
let shownTitle = title;
|
|
58
|
+
let link = void 0;
|
|
59
|
+
let btn = void 0;
|
|
60
|
+
if (author) {
|
|
61
|
+
shownTitle = t(`postsContainer.title.by`, { itemType });
|
|
62
|
+
link = /* @__PURE__ */ React.createElement(EntityRefLink, { entityRef: author, hideIcon: true, defaultKind: "user" });
|
|
63
|
+
} else if (entity) {
|
|
64
|
+
shownTitle = t(`postsContainer.title.about`, { itemType });
|
|
65
|
+
link = /* @__PURE__ */ React.createElement(EntityRefLink, { entityRef: entity });
|
|
66
|
+
btn = /* @__PURE__ */ React.createElement(EntityFollowButton, { entityRef: entity });
|
|
67
|
+
} else if (tags) {
|
|
68
|
+
shownTitle = `#${tags.join(", #")}`;
|
|
69
|
+
if (tags.length === 1) {
|
|
70
|
+
btn = /* @__PURE__ */ React.createElement(TagFollowButton, { tag: tags[0] });
|
|
71
|
+
}
|
|
72
|
+
} else if (favorite) {
|
|
73
|
+
shownTitle = t("postsContainer.title.favorite", {
|
|
74
|
+
itemType: itemType.toLowerCase()
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
return /* @__PURE__ */ React.createElement(Box, { className: "qetaPostsContainer" }, showTitle && /* @__PURE__ */ React.createElement(
|
|
78
|
+
Typography,
|
|
79
|
+
{
|
|
80
|
+
variant: "h5",
|
|
81
|
+
className: "qetaPostsContainerTitle",
|
|
82
|
+
style: { marginBottom: "1.5rem" }
|
|
83
|
+
},
|
|
84
|
+
shownTitle,
|
|
85
|
+
" ",
|
|
86
|
+
link,
|
|
87
|
+
" ",
|
|
88
|
+
btn
|
|
89
|
+
), /* @__PURE__ */ React.createElement(Grid, { container: true, justifyContent: "space-between" }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, md: 4 }, /* @__PURE__ */ React.createElement(
|
|
90
|
+
TextField,
|
|
91
|
+
{
|
|
92
|
+
id: "search-bar",
|
|
93
|
+
fullWidth: true,
|
|
94
|
+
onChange: onSearchQueryChange,
|
|
95
|
+
label: t("postsContainer.search.label", { itemType }),
|
|
96
|
+
className: "qetaPostsContainerSearchInput",
|
|
97
|
+
variant: "outlined",
|
|
98
|
+
placeholder: t("postsContainer.search.placeholder"),
|
|
99
|
+
size: "small",
|
|
100
|
+
style: { marginBottom: "5px" }
|
|
101
|
+
}
|
|
102
|
+
)), showAskButton && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
|
|
103
|
+
AskQuestionButton,
|
|
104
|
+
{
|
|
105
|
+
entity: entity ?? filters.entity,
|
|
106
|
+
entityPage: entity !== void 0,
|
|
107
|
+
tags
|
|
108
|
+
}
|
|
109
|
+
)), showWriteButton && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
|
|
110
|
+
WriteArticleButton,
|
|
111
|
+
{
|
|
112
|
+
entity: entity ?? filters.entity,
|
|
113
|
+
entityPage: entity !== void 0,
|
|
114
|
+
tags
|
|
115
|
+
}
|
|
116
|
+
))), /* @__PURE__ */ React.createElement(Grid, { container: true, justifyContent: "space-between" }, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Typography, { variant: "h6", className: "qetaPostsContainerQuestionCount" }, t("common.posts", { count: response?.total ?? 0, itemType }))), (showFilters ?? true) && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
|
|
117
|
+
Button,
|
|
118
|
+
{
|
|
119
|
+
onClick: () => setShowFilterPanel(!showFilterPanel),
|
|
120
|
+
className: "qetaPostsContainerFilterPanelBtn",
|
|
121
|
+
startIcon: /* @__PURE__ */ React.createElement(FilterList, null)
|
|
122
|
+
},
|
|
123
|
+
t("filterPanel.filterButton")
|
|
124
|
+
))), (showFilters ?? true) && /* @__PURE__ */ React.createElement(Collapse, { in: showFilterPanel }, /* @__PURE__ */ React.createElement(
|
|
125
|
+
FilterPanel,
|
|
126
|
+
{
|
|
127
|
+
onChange: onFilterChange,
|
|
128
|
+
filters,
|
|
129
|
+
type
|
|
130
|
+
}
|
|
131
|
+
)), /* @__PURE__ */ React.createElement(
|
|
132
|
+
PostList,
|
|
133
|
+
{
|
|
134
|
+
loading,
|
|
135
|
+
error,
|
|
136
|
+
response,
|
|
137
|
+
onPageChange,
|
|
138
|
+
onPageSizeChange,
|
|
139
|
+
entity,
|
|
140
|
+
page,
|
|
141
|
+
pageSize: postsPerPage,
|
|
142
|
+
pageCount,
|
|
143
|
+
showNoQuestionsBtn,
|
|
144
|
+
entityPage: entity !== void 0,
|
|
145
|
+
tags,
|
|
146
|
+
type
|
|
147
|
+
}
|
|
148
|
+
));
|
|
149
|
+
};
|
|
150
|
+
|
|
151
|
+
export { PostsContainer };
|
|
152
|
+
//# sourceMappingURL=PostsContainer.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PostsContainer.esm.js","sources":["../../../src/components/PostsContainer/PostsContainer.tsx"],"sourcesContent":["import {\n PaginatedPostsProps,\n usePaginatedPosts,\n useTranslation,\n} from '../../utils/hooks';\nimport {\n Box,\n Button,\n Collapse,\n Grid,\n TextField,\n Typography,\n} from '@material-ui/core';\nimport React from 'react';\nimport { FilterPanel } from '../FilterPanel/FilterPanel';\nimport { PostList } from './PostList';\nimport FilterList from '@material-ui/icons/FilterList';\nimport { AskQuestionButton } from '../Buttons/AskQuestionButton';\nimport { EntityRefLink } from '@backstage/plugin-catalog-react';\nimport { TagFollowButton } from '../Buttons/TagFollowButton';\nimport { EntityFollowButton } from '../Buttons/EntityFollowButton';\nimport { WriteArticleButton } from '../Buttons';\nimport { capitalize } from 'lodash';\n\nexport const PostsContainer = (props: PaginatedPostsProps) => {\n const {\n type,\n tags,\n author,\n entity,\n showFilters,\n showTitle,\n title,\n favorite,\n showAskButton,\n showWriteButton,\n showNoQuestionsBtn,\n } = props;\n const {\n onSearchQueryChange,\n filters,\n response,\n loading,\n error,\n setShowFilterPanel,\n showFilterPanel,\n onFilterChange,\n onPageChange,\n onPageSizeChange,\n page,\n postsPerPage,\n pageCount,\n } = usePaginatedPosts(props);\n const { t } = useTranslation();\n\n const itemType = capitalize(t(`common.${type ?? 'post'}`, {}));\n let shownTitle = title;\n let link = undefined;\n let btn = undefined;\n if (author) {\n shownTitle = t(`postsContainer.title.by`, { itemType });\n link = <EntityRefLink entityRef={author} hideIcon defaultKind=\"user\" />;\n } else if (entity) {\n shownTitle = t(`postsContainer.title.about`, { itemType });\n link = <EntityRefLink entityRef={entity} />;\n btn = <EntityFollowButton entityRef={entity} />;\n } else if (tags) {\n shownTitle = `#${tags.join(', #')}`;\n if (tags.length === 1) {\n btn = <TagFollowButton tag={tags[0]} />;\n }\n } else if (favorite) {\n shownTitle = t('postsContainer.title.favorite', {\n itemType: itemType.toLowerCase(),\n });\n }\n\n return (\n <Box className=\"qetaPostsContainer\">\n {showTitle && (\n <Typography\n variant=\"h5\"\n className=\"qetaPostsContainerTitle\"\n style={{ marginBottom: '1.5rem' }}\n >\n {shownTitle} {link} {btn}\n </Typography>\n )}\n <Grid container justifyContent=\"space-between\">\n <Grid item xs={12} md={4}>\n <TextField\n id=\"search-bar\"\n fullWidth\n onChange={onSearchQueryChange}\n label={t('postsContainer.search.label', { itemType })}\n className=\"qetaPostsContainerSearchInput\"\n variant=\"outlined\"\n placeholder={t('postsContainer.search.placeholder')}\n size=\"small\"\n style={{ marginBottom: '5px' }}\n />\n </Grid>\n {showAskButton && (\n <Grid item>\n <AskQuestionButton\n entity={entity ?? filters.entity}\n entityPage={entity !== undefined}\n tags={tags}\n />\n </Grid>\n )}\n {showWriteButton && (\n <Grid item>\n <WriteArticleButton\n entity={entity ?? filters.entity}\n entityPage={entity !== undefined}\n tags={tags}\n />\n </Grid>\n )}\n </Grid>\n <Grid container justifyContent=\"space-between\">\n <Grid item>\n <Typography variant=\"h6\" className=\"qetaPostsContainerQuestionCount\">\n {t('common.posts', { count: response?.total ?? 0, itemType })}\n </Typography>\n </Grid>\n {(showFilters ?? true) && (\n <Grid item>\n <Button\n onClick={() => setShowFilterPanel(!showFilterPanel)}\n className=\"qetaPostsContainerFilterPanelBtn\"\n startIcon={<FilterList />}\n >\n {t('filterPanel.filterButton')}\n </Button>\n </Grid>\n )}\n </Grid>\n {(showFilters ?? true) && (\n <Collapse in={showFilterPanel}>\n <FilterPanel\n onChange={onFilterChange}\n filters={filters}\n type={type}\n />\n </Collapse>\n )}\n <PostList\n loading={loading}\n error={error}\n response={response}\n onPageChange={onPageChange}\n onPageSizeChange={onPageSizeChange}\n entity={entity}\n page={page}\n pageSize={postsPerPage}\n pageCount={pageCount}\n showNoQuestionsBtn={showNoQuestionsBtn}\n entityPage={entity !== undefined}\n tags={tags}\n type={type}\n />\n </Box>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { useTranslation, usePaginatedPosts } from '../../utils/hooks.esm.js';
|
|
3
|
+
import { EntityRefLink } from '@backstage/plugin-catalog-react';
|
|
4
|
+
import { AskQuestionButton } from '../Buttons/AskQuestionButton.esm.js';
|
|
5
|
+
import '@backstage/core-components';
|
|
6
|
+
import '@backstage/core-plugin-api';
|
|
7
|
+
import '@backstage/catalog-model';
|
|
8
|
+
import 'react-router-dom';
|
|
9
|
+
import '../../routes.esm.js';
|
|
10
|
+
import '@material-ui/icons/ChevronLeft';
|
|
11
|
+
import { EntityFollowButton } from '../Buttons/EntityFollowButton.esm.js';
|
|
12
|
+
import { TagFollowButton } from '../Buttons/TagFollowButton.esm.js';
|
|
13
|
+
import { WriteArticleButton } from '../Buttons/WriteArticleButton.esm.js';
|
|
14
|
+
import '@material-ui/icons/PlaylistAdd';
|
|
15
|
+
import '@backstage/plugin-permission-react';
|
|
16
|
+
import '@drodil/backstage-plugin-qeta-common';
|
|
17
|
+
import { Box, Typography, Grid, TextField, Button, Collapse } from '@material-ui/core';
|
|
18
|
+
import '@material-ui/icons/AddCircle';
|
|
19
|
+
import '@material-ui/icons/RemoveCircle';
|
|
20
|
+
import '../../api.esm.js';
|
|
21
|
+
import FilterList from '@material-ui/icons/FilterList';
|
|
22
|
+
import { FilterPanel } from '../FilterPanel/FilterPanel.esm.js';
|
|
23
|
+
import { PostsGridContent } from './PostsGridContent.esm.js';
|
|
24
|
+
import { capitalize } from 'lodash';
|
|
25
|
+
|
|
26
|
+
const PostsGrid = (props) => {
|
|
27
|
+
const {
|
|
28
|
+
type,
|
|
29
|
+
tags,
|
|
30
|
+
author,
|
|
31
|
+
entity,
|
|
32
|
+
showFilters,
|
|
33
|
+
showTitle,
|
|
34
|
+
title,
|
|
35
|
+
favorite,
|
|
36
|
+
showAskButton,
|
|
37
|
+
showWriteButton,
|
|
38
|
+
showNoQuestionsBtn
|
|
39
|
+
} = props;
|
|
40
|
+
const { t } = useTranslation();
|
|
41
|
+
const {
|
|
42
|
+
onSearchQueryChange,
|
|
43
|
+
filters,
|
|
44
|
+
response,
|
|
45
|
+
loading,
|
|
46
|
+
error,
|
|
47
|
+
setShowFilterPanel,
|
|
48
|
+
showFilterPanel,
|
|
49
|
+
onFilterChange,
|
|
50
|
+
page,
|
|
51
|
+
pageCount,
|
|
52
|
+
onPageChange
|
|
53
|
+
} = usePaginatedPosts({ initialPageSize: 50, ...props });
|
|
54
|
+
const itemType = capitalize(t(`common.${type ?? "post"}`, {}));
|
|
55
|
+
let shownTitle = title;
|
|
56
|
+
let link = void 0;
|
|
57
|
+
let btn = void 0;
|
|
58
|
+
if (author) {
|
|
59
|
+
shownTitle = t(`postsContainer.title.by`, { itemType });
|
|
60
|
+
link = /* @__PURE__ */ React.createElement(EntityRefLink, { entityRef: author, hideIcon: true, defaultKind: "user" });
|
|
61
|
+
} else if (entity) {
|
|
62
|
+
shownTitle = t(`postsContainer.title.about`, { itemType });
|
|
63
|
+
link = /* @__PURE__ */ React.createElement(EntityRefLink, { entityRef: entity });
|
|
64
|
+
btn = /* @__PURE__ */ React.createElement(EntityFollowButton, { entityRef: entity });
|
|
65
|
+
} else if (tags) {
|
|
66
|
+
shownTitle = `#${tags.join(", #")}`;
|
|
67
|
+
if (tags.length === 1) {
|
|
68
|
+
btn = /* @__PURE__ */ React.createElement(TagFollowButton, { tag: tags[0] });
|
|
69
|
+
}
|
|
70
|
+
} else if (favorite) {
|
|
71
|
+
shownTitle = t("postsContainer.title.favorite", { itemType });
|
|
72
|
+
}
|
|
73
|
+
return /* @__PURE__ */ React.createElement(Box, { className: "qetaPostsGrid" }, showTitle && /* @__PURE__ */ React.createElement(
|
|
74
|
+
Typography,
|
|
75
|
+
{
|
|
76
|
+
variant: "h5",
|
|
77
|
+
className: "qetaPostsGridTitle",
|
|
78
|
+
style: { marginBottom: "1.5rem" }
|
|
79
|
+
},
|
|
80
|
+
shownTitle,
|
|
81
|
+
" ",
|
|
82
|
+
link,
|
|
83
|
+
" ",
|
|
84
|
+
btn
|
|
85
|
+
), /* @__PURE__ */ React.createElement(Grid, { container: true, justifyContent: "space-between" }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, md: 4 }, /* @__PURE__ */ React.createElement(
|
|
86
|
+
TextField,
|
|
87
|
+
{
|
|
88
|
+
id: "search-bar",
|
|
89
|
+
fullWidth: true,
|
|
90
|
+
onChange: onSearchQueryChange,
|
|
91
|
+
label: t("postsContainer.search.label", { itemType }),
|
|
92
|
+
className: "qetaPostsGridSearchInput",
|
|
93
|
+
variant: "outlined",
|
|
94
|
+
placeholder: t("postsContainer.search.placeholder"),
|
|
95
|
+
size: "small",
|
|
96
|
+
style: { marginBottom: "5px" }
|
|
97
|
+
}
|
|
98
|
+
)), showAskButton && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
|
|
99
|
+
AskQuestionButton,
|
|
100
|
+
{
|
|
101
|
+
entity: entity ?? filters.entity,
|
|
102
|
+
entityPage: entity !== void 0,
|
|
103
|
+
tags
|
|
104
|
+
}
|
|
105
|
+
)), showWriteButton && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
|
|
106
|
+
WriteArticleButton,
|
|
107
|
+
{
|
|
108
|
+
entity: entity ?? filters.entity,
|
|
109
|
+
entityPage: entity !== void 0,
|
|
110
|
+
tags
|
|
111
|
+
}
|
|
112
|
+
))), /* @__PURE__ */ React.createElement(Grid, { container: true, justifyContent: "space-between" }, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Typography, { variant: "h6", className: "qetaPostsContainerQuestionCount" }, t("common.posts", { count: response?.total ?? 0, itemType }))), (showFilters ?? true) && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
|
|
113
|
+
Button,
|
|
114
|
+
{
|
|
115
|
+
onClick: () => setShowFilterPanel(!showFilterPanel),
|
|
116
|
+
className: "qetaPostsContainerFilterPanelBtn",
|
|
117
|
+
startIcon: /* @__PURE__ */ React.createElement(FilterList, null)
|
|
118
|
+
},
|
|
119
|
+
t("filterPanel.filterButton")
|
|
120
|
+
))), (showFilters ?? true) && /* @__PURE__ */ React.createElement(Collapse, { in: showFilterPanel }, /* @__PURE__ */ React.createElement(
|
|
121
|
+
FilterPanel,
|
|
122
|
+
{
|
|
123
|
+
onChange: onFilterChange,
|
|
124
|
+
filters,
|
|
125
|
+
type
|
|
126
|
+
}
|
|
127
|
+
)), /* @__PURE__ */ React.createElement(
|
|
128
|
+
PostsGridContent,
|
|
129
|
+
{
|
|
130
|
+
loading,
|
|
131
|
+
error,
|
|
132
|
+
response,
|
|
133
|
+
entity,
|
|
134
|
+
showNoQuestionsBtn,
|
|
135
|
+
entityPage: entity !== void 0,
|
|
136
|
+
tags,
|
|
137
|
+
type,
|
|
138
|
+
page,
|
|
139
|
+
pageCount,
|
|
140
|
+
onPageChange
|
|
141
|
+
}
|
|
142
|
+
));
|
|
143
|
+
};
|
|
144
|
+
|
|
145
|
+
export { PostsGrid };
|
|
146
|
+
//# sourceMappingURL=PostsGrid.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PostsGrid.esm.js","sources":["../../../src/components/PostsGrid/PostsGrid.tsx"],"sourcesContent":["import React from 'react';\nimport { useTranslation } from '../../utils';\nimport { PaginatedPostsProps, usePaginatedPosts } from '../../utils/hooks';\nimport { EntityRefLink } from '@backstage/plugin-catalog-react';\nimport {\n AskQuestionButton,\n EntityFollowButton,\n TagFollowButton,\n WriteArticleButton,\n} from '../Buttons';\nimport {\n Box,\n Button,\n Collapse,\n Grid,\n TextField,\n Typography,\n} from '@material-ui/core';\nimport FilterList from '@material-ui/icons/FilterList';\nimport { FilterPanel } from '../FilterPanel/FilterPanel';\nimport { PostsGridContent } from './PostsGridContent';\nimport { capitalize } from 'lodash';\n\nexport const PostsGrid = (props: PaginatedPostsProps) => {\n const {\n type,\n tags,\n author,\n entity,\n showFilters,\n showTitle,\n title,\n favorite,\n showAskButton,\n showWriteButton,\n showNoQuestionsBtn,\n } = props;\n const { t } = useTranslation();\n const {\n onSearchQueryChange,\n filters,\n response,\n loading,\n error,\n setShowFilterPanel,\n showFilterPanel,\n onFilterChange,\n page,\n pageCount,\n onPageChange,\n } = usePaginatedPosts({ initialPageSize: 50, ...props });\n\n const itemType = capitalize(t(`common.${type ?? 'post'}`, {}));\n let shownTitle = title;\n let link = undefined;\n let btn = undefined;\n if (author) {\n shownTitle = t(`postsContainer.title.by`, { itemType });\n link = <EntityRefLink entityRef={author} hideIcon defaultKind=\"user\" />;\n } else if (entity) {\n shownTitle = t(`postsContainer.title.about`, { itemType });\n link = <EntityRefLink entityRef={entity} />;\n btn = <EntityFollowButton entityRef={entity} />;\n } else if (tags) {\n shownTitle = `#${tags.join(', #')}`;\n if (tags.length === 1) {\n btn = <TagFollowButton tag={tags[0]} />;\n }\n } else if (favorite) {\n shownTitle = t('postsContainer.title.favorite', { itemType });\n }\n\n return (\n <Box className=\"qetaPostsGrid\">\n {showTitle && (\n <Typography\n variant=\"h5\"\n className=\"qetaPostsGridTitle\"\n style={{ marginBottom: '1.5rem' }}\n >\n {shownTitle} {link} {btn}\n </Typography>\n )}\n <Grid container justifyContent=\"space-between\">\n <Grid item xs={12} md={4}>\n <TextField\n id=\"search-bar\"\n fullWidth\n onChange={onSearchQueryChange}\n label={t('postsContainer.search.label', { itemType })}\n className=\"qetaPostsGridSearchInput\"\n variant=\"outlined\"\n placeholder={t('postsContainer.search.placeholder')}\n size=\"small\"\n style={{ marginBottom: '5px' }}\n />\n </Grid>\n {showAskButton && (\n <Grid item>\n <AskQuestionButton\n entity={entity ?? filters.entity}\n entityPage={entity !== undefined}\n tags={tags}\n />\n </Grid>\n )}\n {showWriteButton && (\n <Grid item>\n <WriteArticleButton\n entity={entity ?? filters.entity}\n entityPage={entity !== undefined}\n tags={tags}\n />\n </Grid>\n )}\n </Grid>\n <Grid container justifyContent=\"space-between\">\n <Grid item>\n <Typography variant=\"h6\" className=\"qetaPostsContainerQuestionCount\">\n {t('common.posts', { count: response?.total ?? 0, itemType })}\n </Typography>\n </Grid>\n {(showFilters ?? true) && (\n <Grid item>\n <Button\n onClick={() => setShowFilterPanel(!showFilterPanel)}\n className=\"qetaPostsContainerFilterPanelBtn\"\n startIcon={<FilterList />}\n >\n {t('filterPanel.filterButton')}\n </Button>\n </Grid>\n )}\n </Grid>\n {(showFilters ?? true) && (\n <Collapse in={showFilterPanel}>\n <FilterPanel\n onChange={onFilterChange}\n filters={filters}\n type={type}\n />\n </Collapse>\n )}\n <PostsGridContent\n loading={loading}\n error={error}\n response={response}\n entity={entity}\n showNoQuestionsBtn={showNoQuestionsBtn}\n entityPage={entity !== undefined}\n tags={tags}\n type={type}\n page={page}\n pageCount={pageCount}\n onPageChange={onPageChange}\n />\n </Box>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
import React, { useState, useRef, useEffect } from 'react';
|
|
2
|
+
import { useTranslation } from '../../utils/hooks.esm.js';
|
|
3
|
+
import { Progress, WarningPanel } from '@backstage/core-components';
|
|
4
|
+
import { NoPostsCard } from '../PostsContainer/NoPostsCard.esm.js';
|
|
5
|
+
import { Box, Grid } from '@material-ui/core';
|
|
6
|
+
import { PostsGridItem } from './PostsGridItem.esm.js';
|
|
7
|
+
import { Pagination } from '@material-ui/lab';
|
|
8
|
+
|
|
9
|
+
const PostsGridContent = (props) => {
|
|
10
|
+
const {
|
|
11
|
+
loading,
|
|
12
|
+
error,
|
|
13
|
+
response,
|
|
14
|
+
entity,
|
|
15
|
+
showNoQuestionsBtn = true,
|
|
16
|
+
entityPage,
|
|
17
|
+
tags,
|
|
18
|
+
type,
|
|
19
|
+
onPageChange,
|
|
20
|
+
page,
|
|
21
|
+
pageCount
|
|
22
|
+
} = props;
|
|
23
|
+
const [initialLoad, setInitialLoad] = useState(true);
|
|
24
|
+
const { t } = useTranslation();
|
|
25
|
+
const gridRef = useRef(null);
|
|
26
|
+
useEffect(() => {
|
|
27
|
+
if (!initialLoad) {
|
|
28
|
+
setInitialLoad(false);
|
|
29
|
+
}
|
|
30
|
+
}, [initialLoad, loading]);
|
|
31
|
+
const handlePageChange = (_event, value) => {
|
|
32
|
+
if (gridRef.current) {
|
|
33
|
+
gridRef.current.scrollIntoView();
|
|
34
|
+
}
|
|
35
|
+
onPageChange(value);
|
|
36
|
+
};
|
|
37
|
+
if (loading && initialLoad) {
|
|
38
|
+
return /* @__PURE__ */ React.createElement(Progress, null);
|
|
39
|
+
}
|
|
40
|
+
const itemType = type ?? "post";
|
|
41
|
+
if (error || response === void 0) {
|
|
42
|
+
return /* @__PURE__ */ React.createElement(
|
|
43
|
+
WarningPanel,
|
|
44
|
+
{
|
|
45
|
+
severity: "error",
|
|
46
|
+
title: t("postsList.errorLoading", { itemType })
|
|
47
|
+
},
|
|
48
|
+
error?.message
|
|
49
|
+
);
|
|
50
|
+
}
|
|
51
|
+
if (initialLoad && (!response.posts || response.posts.length === 0)) {
|
|
52
|
+
return /* @__PURE__ */ React.createElement(
|
|
53
|
+
NoPostsCard,
|
|
54
|
+
{
|
|
55
|
+
showNoQuestionsBtn,
|
|
56
|
+
entity,
|
|
57
|
+
entityPage,
|
|
58
|
+
tags,
|
|
59
|
+
type
|
|
60
|
+
}
|
|
61
|
+
);
|
|
62
|
+
}
|
|
63
|
+
return /* @__PURE__ */ React.createElement("div", { ref: gridRef }, /* @__PURE__ */ React.createElement(Box, { sx: { mt: 2 }, className: "qetaPostsGrid" }, /* @__PURE__ */ React.createElement(
|
|
64
|
+
Grid,
|
|
65
|
+
{
|
|
66
|
+
container: true,
|
|
67
|
+
direction: "row",
|
|
68
|
+
alignItems: "stretch",
|
|
69
|
+
style: { marginTop: "1rem" }
|
|
70
|
+
},
|
|
71
|
+
response.posts.map((p) => {
|
|
72
|
+
return /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, xl: 6, key: p.id }, /* @__PURE__ */ React.createElement(PostsGridItem, { post: p, type, entity }));
|
|
73
|
+
})
|
|
74
|
+
), /* @__PURE__ */ React.createElement(Grid, { container: true, justifyContent: "center", style: { marginTop: "2rem" } }, /* @__PURE__ */ React.createElement(
|
|
75
|
+
Pagination,
|
|
76
|
+
{
|
|
77
|
+
page,
|
|
78
|
+
onChange: handlePageChange,
|
|
79
|
+
count: pageCount,
|
|
80
|
+
size: "large",
|
|
81
|
+
variant: "outlined",
|
|
82
|
+
className: "qetaPostListPagination",
|
|
83
|
+
showFirstButton: true,
|
|
84
|
+
showLastButton: true
|
|
85
|
+
}
|
|
86
|
+
))));
|
|
87
|
+
};
|
|
88
|
+
|
|
89
|
+
export { PostsGridContent };
|
|
90
|
+
//# sourceMappingURL=PostsGridContent.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PostsGridContent.esm.js","sources":["../../../src/components/PostsGrid/PostsGridContent.tsx"],"sourcesContent":["import { PostsResponse, PostType } from '@drodil/backstage-plugin-qeta-common';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useTranslation } from '../../utils';\nimport { Progress, WarningPanel } from '@backstage/core-components';\nimport { NoPostsCard } from '../PostsContainer/NoPostsCard';\nimport { Box, Grid } from '@material-ui/core';\nimport { PostsGridItem } from './PostsGridItem';\nimport { Pagination } from '@material-ui/lab';\n\nexport const PostsGridContent = (props: {\n loading: boolean;\n error: any;\n response?: PostsResponse;\n entity?: string;\n tags?: string[];\n showNoQuestionsBtn?: boolean;\n entityPage?: boolean;\n type?: PostType;\n onPageChange: (page: number) => void;\n page: number;\n pageCount: number;\n}) => {\n const {\n loading,\n error,\n response,\n entity,\n showNoQuestionsBtn = true,\n entityPage,\n tags,\n type,\n onPageChange,\n page,\n pageCount,\n } = props;\n const [initialLoad, setInitialLoad] = useState(true);\n const { t } = useTranslation();\n const gridRef = useRef<HTMLDivElement | null>(null);\n\n useEffect(() => {\n if (!initialLoad) {\n setInitialLoad(false);\n }\n }, [initialLoad, loading]);\n\n const handlePageChange = (\n _event: React.ChangeEvent<unknown>,\n value: number,\n ) => {\n if (gridRef.current) {\n gridRef.current.scrollIntoView();\n }\n onPageChange(value);\n };\n\n if (loading && initialLoad) {\n return <Progress />;\n }\n\n const itemType = (type ?? 'post') as any;\n\n if (error || response === undefined) {\n return (\n <WarningPanel\n severity=\"error\"\n title={t('postsList.errorLoading', { itemType })}\n >\n {error?.message}\n </WarningPanel>\n );\n }\n\n if (initialLoad && (!response.posts || response.posts.length === 0)) {\n return (\n <NoPostsCard\n showNoQuestionsBtn={showNoQuestionsBtn}\n entity={entity}\n entityPage={entityPage}\n tags={tags}\n type={type}\n />\n );\n }\n\n return (\n <div ref={gridRef}>\n <Box sx={{ mt: 2 }} className=\"qetaPostsGrid\">\n <Grid\n container\n direction=\"row\"\n alignItems=\"stretch\"\n style={{ marginTop: '1rem' }}\n >\n {response.posts.map(p => {\n return (\n <Grid item xs={12} xl={6} key={p.id}>\n <PostsGridItem post={p} type={type} entity={entity} />\n </Grid>\n );\n })}\n </Grid>\n <Grid container justifyContent=\"center\" style={{ marginTop: '2rem' }}>\n <Pagination\n page={page}\n onChange={handlePageChange}\n count={pageCount}\n size=\"large\"\n variant=\"outlined\"\n className=\"qetaPostListPagination\"\n showFirstButton\n showLastButton\n />\n </Grid>\n </Box>\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { truncate, removeMarkdownFormatting } from '@drodil/backstage-plugin-qeta-common';
|
|
2
|
+
import React, { useState, useEffect } from 'react';
|
|
3
|
+
import { useTranslation, useStyles, useEntityAuthor } from '../../utils/hooks.esm.js';
|
|
4
|
+
import { useSignal } from '@backstage/plugin-signals-react';
|
|
5
|
+
import { useRouteRef } from '@backstage/core-plugin-api';
|
|
6
|
+
import { questionRouteRef, articleRouteRef, userRouteRef } from '../../routes.esm.js';
|
|
7
|
+
import { Card, CardActionArea, CardMedia, CardContent, Typography, Box, Avatar } from '@material-ui/core';
|
|
8
|
+
import DOMPurify from 'dompurify';
|
|
9
|
+
import { useNavigate } from 'react-router-dom';
|
|
10
|
+
import { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities.esm.js';
|
|
11
|
+
import { Link } from '@backstage/core-components';
|
|
12
|
+
import { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip/RelativeTimeWithTooltip.esm.js';
|
|
13
|
+
|
|
14
|
+
const PostsGridItem = (props) => {
|
|
15
|
+
const { post, entity } = props;
|
|
16
|
+
const [views, setViews] = useState(post.views);
|
|
17
|
+
const { t } = useTranslation();
|
|
18
|
+
const { lastSignal } = useSignal(`qeta:post_${post.id}`);
|
|
19
|
+
useEffect(() => {
|
|
20
|
+
if (lastSignal?.type === "post_stats") {
|
|
21
|
+
setViews(lastSignal.views);
|
|
22
|
+
}
|
|
23
|
+
}, [lastSignal]);
|
|
24
|
+
const questionRoute = useRouteRef(questionRouteRef);
|
|
25
|
+
const articleRoute = useRouteRef(articleRouteRef);
|
|
26
|
+
const userRoute = useRouteRef(userRouteRef);
|
|
27
|
+
const styles = useStyles();
|
|
28
|
+
const { name, initials, user } = useEntityAuthor(post);
|
|
29
|
+
const navigate = useNavigate();
|
|
30
|
+
const route = post.type === "question" ? questionRoute : articleRoute;
|
|
31
|
+
const href = entity ? `${route({
|
|
32
|
+
id: post.id.toString(10)
|
|
33
|
+
})}?entity=${entity}` : route({ id: post.id.toString(10) });
|
|
34
|
+
return /* @__PURE__ */ React.createElement(Card, { style: { height: "100%" } }, /* @__PURE__ */ React.createElement(CardActionArea, { onClick: () => navigate(href) }, post.headerImage && /* @__PURE__ */ React.createElement(
|
|
35
|
+
CardMedia,
|
|
36
|
+
{
|
|
37
|
+
component: "img",
|
|
38
|
+
height: "140",
|
|
39
|
+
image: post.headerImage,
|
|
40
|
+
alt: post.title
|
|
41
|
+
}
|
|
42
|
+
), /* @__PURE__ */ React.createElement(CardContent, { style: { paddingBottom: "0.5rem" } }, /* @__PURE__ */ React.createElement(Typography, { gutterBottom: true, variant: "h6", component: "div" }, post.title), /* @__PURE__ */ React.createElement(Typography, { variant: "body2", color: "textSecondary", gutterBottom: true }, DOMPurify.sanitize(
|
|
43
|
+
truncate(removeMarkdownFormatting(post.content), 400)
|
|
44
|
+
)))), /* @__PURE__ */ React.createElement(CardContent, { style: { paddingTop: "0.5rem" } }, /* @__PURE__ */ React.createElement(TagsAndEntities, { entity: post }), /* @__PURE__ */ React.createElement(Box, { style: { paddingLeft: "0.2rem", paddingTop: "0.5rem" } }, /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, /* @__PURE__ */ React.createElement(
|
|
45
|
+
Avatar,
|
|
46
|
+
{
|
|
47
|
+
src: user?.spec?.profile?.picture,
|
|
48
|
+
className: styles.questionListItemAvatar,
|
|
49
|
+
alt: name,
|
|
50
|
+
variant: "rounded"
|
|
51
|
+
},
|
|
52
|
+
initials
|
|
53
|
+
), post.author === "anonymous" ? t("common.anonymousAuthor") : /* @__PURE__ */ React.createElement(Link, { to: `${userRoute()}/${post.author}` }, name), " ", /* @__PURE__ */ React.createElement(Link, { to: href, className: "qetaPostListItemQuestionBtn" }, /* @__PURE__ */ React.createElement(RelativeTimeWithTooltip, { value: post.created })), " \xB7 ", t("common.views", { count: views })))));
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
export { PostsGridItem };
|
|
57
|
+
//# sourceMappingURL=PostsGridItem.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PostsGridItem.esm.js","sources":["../../../src/components/PostsGrid/PostsGridItem.tsx"],"sourcesContent":["import {\n PostResponse,\n PostType,\n QetaSignal,\n removeMarkdownFormatting,\n truncate,\n} from '@drodil/backstage-plugin-qeta-common';\nimport React, { useEffect, useState } from 'react';\nimport { useStyles, useTranslation } from '../../utils';\nimport { useSignal } from '@backstage/plugin-signals-react';\nimport { useRouteRef } from '@backstage/core-plugin-api';\nimport { articleRouteRef, questionRouteRef, userRouteRef } from '../../routes';\nimport {\n Avatar,\n Box,\n Card,\n CardActionArea,\n CardContent,\n CardMedia,\n Typography,\n} from '@material-ui/core';\nimport { useEntityAuthor } from '../../utils/hooks';\nimport DOMPurify from 'dompurify';\nimport { useNavigate } from 'react-router-dom';\nimport { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities';\nimport { Link } from '@backstage/core-components';\nimport { RelativeTimeWithTooltip } from '../RelativeTimeWithTooltip';\n\nexport interface PostsGridItemProps {\n post: PostResponse;\n entity?: string;\n type?: PostType;\n}\n\nexport const PostsGridItem = (props: PostsGridItemProps) => {\n const { post, entity } = props;\n const [views, setViews] = useState(post.views);\n const { t } = useTranslation();\n\n const { lastSignal } = useSignal<QetaSignal>(`qeta:post_${post.id}`);\n\n useEffect(() => {\n if (lastSignal?.type === 'post_stats') {\n setViews(lastSignal.views);\n }\n }, [lastSignal]);\n\n const questionRoute = useRouteRef(questionRouteRef);\n const articleRoute = useRouteRef(articleRouteRef);\n const userRoute = useRouteRef(userRouteRef);\n const styles = useStyles();\n const { name, initials, user } = useEntityAuthor(post);\n const navigate = useNavigate();\n\n const route = post.type === 'question' ? questionRoute : articleRoute;\n const href = entity\n ? `${route({\n id: post.id.toString(10),\n })}?entity=${entity}`\n : route({ id: post.id.toString(10) });\n\n return (\n <Card style={{ height: '100%' }}>\n <CardActionArea onClick={() => navigate(href)}>\n {post.headerImage && (\n <CardMedia\n component=\"img\"\n height=\"140\"\n image={post.headerImage}\n alt={post.title}\n />\n )}\n <CardContent style={{ paddingBottom: '0.5rem' }}>\n <Typography gutterBottom variant=\"h6\" component=\"div\">\n {post.title}\n </Typography>\n <Typography variant=\"body2\" color=\"textSecondary\" gutterBottom>\n {DOMPurify.sanitize(\n truncate(removeMarkdownFormatting(post.content), 400),\n )}\n </Typography>\n </CardContent>\n </CardActionArea>\n <CardContent style={{ paddingTop: '0.5rem' }}>\n <TagsAndEntities entity={post} />\n <Box style={{ paddingLeft: '0.2rem', paddingTop: '0.5rem' }}>\n <Typography variant=\"caption\">\n <Avatar\n src={user?.spec?.profile?.picture}\n className={styles.questionListItemAvatar}\n alt={name}\n variant=\"rounded\"\n >\n {initials}\n </Avatar>\n {post.author === 'anonymous' ? (\n t('common.anonymousAuthor')\n ) : (\n <Link to={`${userRoute()}/${post.author}`}>{name}</Link>\n )}{' '}\n <Link to={href} className=\"qetaPostListItemQuestionBtn\">\n <RelativeTimeWithTooltip value={post.created} />\n </Link>\n {' · '}\n {t('common.views', { count: views })}\n </Typography>\n </Box>\n </CardContent>\n </Card>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
import { Card, CardContent, Grid, Typography, Box, Button } from '@material-ui/core';
|
|
2
|
+
import React, { useEffect } from 'react';
|
|
3
|
+
import { VoteButtons } from '../Buttons/VoteButtons.esm.js';
|
|
4
|
+
import { useStyles, useTranslation } from '../../utils/hooks.esm.js';
|
|
5
|
+
import { DeleteModal } from '../DeleteModal/DeleteModal.esm.js';
|
|
6
|
+
import DeleteIcon from '@material-ui/icons/Delete';
|
|
7
|
+
import EditIcon from '@material-ui/icons/Edit';
|
|
8
|
+
import { FavoriteButton } from '../Buttons/FavoriteButton.esm.js';
|
|
9
|
+
import { AuthorBox } from '../AuthorBox/AuthorBox.esm.js';
|
|
10
|
+
import { TagsAndEntities } from '../TagsAndEntities/TagsAndEntities.esm.js';
|
|
11
|
+
import { CommentSection } from '../CommentSection/CommentSection.esm.js';
|
|
12
|
+
import { useRouteRef } from '@backstage/core-plugin-api';
|
|
13
|
+
import { LinkButton } from '../Buttons/LinkButton.esm.js';
|
|
14
|
+
import { MarkdownRenderer } from '../MarkdownRenderer/MarkdownRenderer.esm.js';
|
|
15
|
+
import { editQuestionRouteRef } from '../../routes.esm.js';
|
|
16
|
+
|
|
17
|
+
const QuestionCard = (props) => {
|
|
18
|
+
const { question } = props;
|
|
19
|
+
const styles = useStyles();
|
|
20
|
+
const editQuestionRoute = useRouteRef(editQuestionRouteRef);
|
|
21
|
+
const [deleteModalOpen, setDeleteModalOpen] = React.useState(false);
|
|
22
|
+
const [questionEntity, setQuestionEntity] = React.useState(question);
|
|
23
|
+
const handleDeleteModalOpen = () => setDeleteModalOpen(true);
|
|
24
|
+
const handleDeleteModalClose = () => setDeleteModalOpen(false);
|
|
25
|
+
const { t } = useTranslation();
|
|
26
|
+
const onCommentAction = (q, _) => {
|
|
27
|
+
setQuestionEntity(q);
|
|
28
|
+
};
|
|
29
|
+
const highlightedAnswer = window.location.hash.slice(1) ?? void 0;
|
|
30
|
+
useEffect(() => {
|
|
31
|
+
if (highlightedAnswer) {
|
|
32
|
+
try {
|
|
33
|
+
const element = document.querySelector(`#${highlightedAnswer}`);
|
|
34
|
+
if (element) {
|
|
35
|
+
element.scrollIntoView();
|
|
36
|
+
}
|
|
37
|
+
} catch (e) {
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}, [highlightedAnswer]);
|
|
41
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
42
|
+
Card,
|
|
43
|
+
{
|
|
44
|
+
variant: "outlined",
|
|
45
|
+
className: `qetaQuestionCard ${styles.questionCard}`
|
|
46
|
+
},
|
|
47
|
+
/* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 0, justifyContent: "flex-start" }, /* @__PURE__ */ React.createElement(Grid, { container: true, item: true, xs: 1, justifyContent: "center" }, /* @__PURE__ */ React.createElement("div", { className: styles.questionCardVote }, /* @__PURE__ */ React.createElement(VoteButtons, { entity: questionEntity }), /* @__PURE__ */ React.createElement(FavoriteButton, { entity: questionEntity }), /* @__PURE__ */ React.createElement(LinkButton, { entity: questionEntity }))), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 11, className: styles.questionCardContent }, /* @__PURE__ */ React.createElement(Typography, { variant: "body1", gutterBottom: true }, /* @__PURE__ */ React.createElement(
|
|
48
|
+
MarkdownRenderer,
|
|
49
|
+
{
|
|
50
|
+
content: questionEntity.content,
|
|
51
|
+
className: styles.markdownContent
|
|
52
|
+
}
|
|
53
|
+
)), /* @__PURE__ */ React.createElement(
|
|
54
|
+
Grid,
|
|
55
|
+
{
|
|
56
|
+
container: true,
|
|
57
|
+
item: true,
|
|
58
|
+
spacing: 1,
|
|
59
|
+
justifyContent: "space-between",
|
|
60
|
+
alignItems: "flex-end",
|
|
61
|
+
className: styles.questionCardMetadata
|
|
62
|
+
},
|
|
63
|
+
/* @__PURE__ */ React.createElement(Grid, { item: true, xs: 9, style: { alignSelf: "flex-end" } }, /* @__PURE__ */ React.createElement(TagsAndEntities, { entity: questionEntity }), (question.canEdit || question.canDelete) && /* @__PURE__ */ React.createElement(Box, { className: styles.questionCardActions }, question.canDelete && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
64
|
+
Button,
|
|
65
|
+
{
|
|
66
|
+
variant: "outlined",
|
|
67
|
+
size: "small",
|
|
68
|
+
color: "secondary",
|
|
69
|
+
onClick: handleDeleteModalOpen,
|
|
70
|
+
className: `${styles.marginRight} qetaQuestionCardDeleteBtn`,
|
|
71
|
+
startIcon: /* @__PURE__ */ React.createElement(DeleteIcon, null)
|
|
72
|
+
},
|
|
73
|
+
t("deleteModal.deleteButton")
|
|
74
|
+
), /* @__PURE__ */ React.createElement(
|
|
75
|
+
DeleteModal,
|
|
76
|
+
{
|
|
77
|
+
open: deleteModalOpen,
|
|
78
|
+
onClose: handleDeleteModalClose,
|
|
79
|
+
entity: questionEntity
|
|
80
|
+
}
|
|
81
|
+
)), question.canEdit && /* @__PURE__ */ React.createElement(
|
|
82
|
+
Button,
|
|
83
|
+
{
|
|
84
|
+
variant: "outlined",
|
|
85
|
+
size: "small",
|
|
86
|
+
startIcon: /* @__PURE__ */ React.createElement(EditIcon, null),
|
|
87
|
+
href: editQuestionRoute({
|
|
88
|
+
id: question.id.toString(10)
|
|
89
|
+
}),
|
|
90
|
+
className: "qetaQuestionCardEditBtn"
|
|
91
|
+
},
|
|
92
|
+
t("questionPage.editButton")
|
|
93
|
+
))),
|
|
94
|
+
/* @__PURE__ */ React.createElement(Grid, { item: true, xs: 3, className: styles.noPadding }, /* @__PURE__ */ React.createElement(AuthorBox, { entity: questionEntity }))
|
|
95
|
+
))))
|
|
96
|
+
), /* @__PURE__ */ React.createElement(
|
|
97
|
+
CommentSection,
|
|
98
|
+
{
|
|
99
|
+
post: questionEntity,
|
|
100
|
+
onCommentDelete: onCommentAction,
|
|
101
|
+
onCommentPost: onCommentAction
|
|
102
|
+
}
|
|
103
|
+
));
|
|
104
|
+
};
|
|
105
|
+
|
|
106
|
+
export { QuestionCard };
|
|
107
|
+
//# sourceMappingURL=QuestionCard.esm.js.map
|