@drodil/backstage-plugin-qeta-react 3.40.1 → 3.41.1
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/components/AnswerForm/AnswerForm.esm.js +56 -2
- package/dist/components/AnswerForm/AnswerForm.esm.js.map +1 -1
- package/dist/components/ExtensionContext/ExtensionContext.esm.js +23 -0
- package/dist/components/ExtensionContext/ExtensionContext.esm.js.map +1 -0
- package/dist/components/MarkdownRenderer/MarkdownRenderer.esm.js +5 -12
- package/dist/components/MarkdownRenderer/MarkdownRenderer.esm.js.map +1 -1
- package/dist/components/PostForm/EntitiesInput.esm.js +30 -14
- package/dist/components/PostForm/EntitiesInput.esm.js.map +1 -1
- package/dist/components/PostForm/PostForm.esm.js +63 -4
- package/dist/components/PostForm/PostForm.esm.js.map +1 -1
- package/dist/components/PostForm/TagInput.esm.js +2 -2
- package/dist/components/PostForm/TagInput.esm.js.map +1 -1
- package/dist/components/PostsContainer/PostsContainer.esm.js +2 -2
- package/dist/components/PostsContainer/PostsContainer.esm.js.map +1 -1
- package/dist/components/PostsTable/PostsTable.esm.js +4 -0
- package/dist/components/PostsTable/PostsTable.esm.js.map +1 -1
- package/dist/index.d.ts +15 -2
- package/dist/index.esm.js +1 -0
- package/dist/index.esm.js.map +1 -1
- package/dist/translation.esm.js +4 -0
- package/dist/translation.esm.js.map +1 -1
- package/package.json +2 -3
|
@@ -8,10 +8,17 @@ import { MarkdownEditor } from '../MarkdownEditor/MarkdownEditor.esm.js';
|
|
|
8
8
|
import { PostAnonymouslyCheckbox } from '../PostAnonymouslyCheckbox/PostAnonymouslyCheckbox.esm.js';
|
|
9
9
|
import { useConfirmNavigationIfEdited } from '../../utils/utils.esm.js';
|
|
10
10
|
import { qetaApiRef } from '../../api.esm.js';
|
|
11
|
-
import { useTheme, Typography, Button } from '@material-ui/core';
|
|
11
|
+
import { useTheme, Typography, Box, Button } from '@material-ui/core';
|
|
12
12
|
import { OptionalRequirePermission } from '../Utility/OptionalRequirePermission.esm.js';
|
|
13
13
|
import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
|
|
14
14
|
import { qetaTranslationRef } from '../../translation.esm.js';
|
|
15
|
+
import 'react-use';
|
|
16
|
+
import { stringifyEntityRef } from '@backstage/catalog-model';
|
|
17
|
+
import 'dataloader';
|
|
18
|
+
import { catalogApiRef } from '@backstage/plugin-catalog-react';
|
|
19
|
+
import { useIdentityApi } from '../../hooks/useIdentityApi.esm.js';
|
|
20
|
+
import { useIsModerator } from '../../hooks/useIsModerator.esm.js';
|
|
21
|
+
import { EntitiesInput } from '../PostForm/EntitiesInput.esm.js';
|
|
15
22
|
|
|
16
23
|
const getDefaultValues = (postId) => {
|
|
17
24
|
return { postId, answer: "", images: [] };
|
|
@@ -22,9 +29,15 @@ const AnswerForm = (props) => {
|
|
|
22
29
|
getDefaultValues(post.id)
|
|
23
30
|
);
|
|
24
31
|
const analytics = useAnalytics();
|
|
32
|
+
const isModerator = useIsModerator();
|
|
33
|
+
const { value: identity } = useIdentityApi(
|
|
34
|
+
(api) => api.getBackstageIdentity(),
|
|
35
|
+
[]
|
|
36
|
+
);
|
|
25
37
|
const theme = useTheme();
|
|
26
38
|
const [error, setError] = useState(false);
|
|
27
39
|
const [posting, setPosting] = useState(false);
|
|
40
|
+
const catalogApi = useApi(catalogApiRef);
|
|
28
41
|
const [images, setImages] = useState([]);
|
|
29
42
|
const [edited, setEdited] = useState(false);
|
|
30
43
|
const qetaApi = useApi(qetaApiRef);
|
|
@@ -46,6 +59,7 @@ const AnswerForm = (props) => {
|
|
|
46
59
|
qetaApi.updateAnswer(id, {
|
|
47
60
|
postId: post.id,
|
|
48
61
|
answer: data.answer,
|
|
62
|
+
author: data.author ? stringifyEntityRef(data.author) : void 0,
|
|
49
63
|
images
|
|
50
64
|
}).then((a) => {
|
|
51
65
|
if (!a || !("id" in a)) {
|
|
@@ -81,12 +95,30 @@ const AnswerForm = (props) => {
|
|
|
81
95
|
if ("content" in a) {
|
|
82
96
|
setValues({ postId: post.id, answer: a.content, images: a.images });
|
|
83
97
|
setImages(a.images);
|
|
98
|
+
catalogApi.getEntityByRef(a.author).then((data) => {
|
|
99
|
+
if (data) {
|
|
100
|
+
setValues((v) => {
|
|
101
|
+
return { ...v, author: data };
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
});
|
|
84
105
|
} else {
|
|
85
106
|
setError(true);
|
|
86
107
|
}
|
|
87
108
|
});
|
|
88
109
|
}
|
|
89
|
-
}, [id, post, qetaApi]);
|
|
110
|
+
}, [catalogApi, id, post, qetaApi]);
|
|
111
|
+
useEffect(() => {
|
|
112
|
+
if (!id && identity?.userEntityRef) {
|
|
113
|
+
catalogApi.getEntityByRef(identity.userEntityRef).then((data) => {
|
|
114
|
+
if (data) {
|
|
115
|
+
setValues((v) => {
|
|
116
|
+
return { ...v, author: data };
|
|
117
|
+
});
|
|
118
|
+
}
|
|
119
|
+
});
|
|
120
|
+
}
|
|
121
|
+
}, [catalogApi, id, identity]);
|
|
90
122
|
useEffect(() => {
|
|
91
123
|
reset(values);
|
|
92
124
|
}, [values, reset]);
|
|
@@ -135,6 +167,28 @@ const AnswerForm = (props) => {
|
|
|
135
167
|
name: "answer"
|
|
136
168
|
}
|
|
137
169
|
),
|
|
170
|
+
isModerator && id && /* @__PURE__ */ jsx(Box, { mt: 1, mb: 1, children: /* @__PURE__ */ jsx(
|
|
171
|
+
Controller,
|
|
172
|
+
{
|
|
173
|
+
control,
|
|
174
|
+
render: ({ field, fieldState: { error: authorError } }) => {
|
|
175
|
+
return /* @__PURE__ */ jsx(
|
|
176
|
+
EntitiesInput,
|
|
177
|
+
{
|
|
178
|
+
label: t("postForm.authorInput.label"),
|
|
179
|
+
placeholder: t("postForm.authorInput.placeholder"),
|
|
180
|
+
hideHelpText: true,
|
|
181
|
+
multiple: false,
|
|
182
|
+
kind: ["User"],
|
|
183
|
+
required: true,
|
|
184
|
+
...field,
|
|
185
|
+
error: authorError
|
|
186
|
+
}
|
|
187
|
+
);
|
|
188
|
+
},
|
|
189
|
+
name: "author"
|
|
190
|
+
}
|
|
191
|
+
) }),
|
|
138
192
|
allowAnonymouns && !id && /* @__PURE__ */ jsx(
|
|
139
193
|
PostAnonymouslyCheckbox,
|
|
140
194
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnswerForm.esm.js","sources":["../../../src/components/AnswerForm/AnswerForm.tsx"],"sourcesContent":["import { WarningPanel } from '@backstage/core-components';\nimport { useCallback, useEffect, useState } from 'react';\nimport { configApiRef, useAnalytics, useApi } from '@backstage/core-plugin-api';\nimport {\n AnswerRequest,\n AnswerResponse,\n PostResponse,\n qetaCreateAnswerPermission,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { Controller, useForm } from 'react-hook-form';\nimport { MarkdownEditor } from '../MarkdownEditor/MarkdownEditor';\nimport { PostAnonymouslyCheckbox } from '../PostAnonymouslyCheckbox/PostAnonymouslyCheckbox';\nimport { useConfirmNavigationIfEdited } from '../../utils/utils';\nimport { qetaApiRef } from '../../api';\nimport { Button, Typography, useTheme } from '@material-ui/core';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\n\ntype AnswerFormData = {\n postId: number;\n answer: string;\n images: number[];\n};\n\nconst getDefaultValues = (postId: number): AnswerFormData => {\n return { postId, answer: '', images: [] };\n};\n\nexport const AnswerForm = (props: {\n post: PostResponse;\n onPost: (answer: AnswerResponse) => void;\n id?: number;\n}) => {\n const { post, onPost, id } = props;\n const [values, setValues] = useState<AnswerFormData>(\n getDefaultValues(post.id),\n );\n const analytics = useAnalytics();\n const theme = useTheme();\n const [error, setError] = useState(false);\n const [posting, setPosting] = useState(false);\n const [images, setImages] = useState<number[]>([]);\n const [edited, setEdited] = useState(false);\n const qetaApi = useApi(qetaApiRef);\n const configApi = useApi(configApiRef);\n const allowAnonymouns = configApi.getOptionalBoolean('qeta.allowAnonymous');\n const { t } = useTranslationRef(qetaTranslationRef);\n\n const {\n handleSubmit,\n control,\n formState: { errors, isSubmitting },\n reset,\n } = useForm<AnswerRequest>({\n values,\n defaultValues: getDefaultValues(post.id),\n });\n\n const postAnswer = (data: AnswerRequest) => {\n setPosting(true);\n\n if (id) {\n qetaApi\n .updateAnswer(id, {\n postId: post.id,\n answer: data.answer,\n images,\n })\n .then(a => {\n if (!a || !('id' in a)) {\n setError(true);\n return;\n }\n setEdited(false);\n analytics.captureEvent('edit', 'answer');\n reset();\n onPost(a);\n })\n .catch(_e => setError(true))\n .finally(() => setPosting(false));\n return;\n }\n // http://localhost:7007/api/qeta/attachments/36e551b1-3be7-479a-8942-b7018434e710\n qetaApi\n .postAnswer({\n postId: post.id,\n answer: data.answer,\n images,\n anonymous: data.anonymous,\n })\n .then(a => {\n if (!a || !('id' in a)) {\n setError(true);\n return;\n }\n setEdited(false);\n analytics.captureEvent('post', 'answer');\n reset();\n onPost(a);\n })\n .catch(_e => setError(true))\n .finally(() => setPosting(false));\n };\n\n useEffect(() => {\n if (id) {\n qetaApi.getAnswer(post.id, id).then(a => {\n if ('content' in a) {\n setValues({ postId: post.id, answer: a.content, images: a.images });\n setImages(a.images);\n } else {\n setError(true);\n }\n });\n }\n }, [id, post, qetaApi]);\n\n useEffect(() => {\n reset(values);\n }, [values, reset]);\n\n useConfirmNavigationIfEdited(edited);\n\n const onImageUpload = useCallback(\n (imageId: number) => {\n setImages(prevImages => [...prevImages, imageId]);\n },\n [setImages],\n );\n\n return (\n <OptionalRequirePermission\n permission={qetaCreateAnswerPermission}\n errorPage={<></>}\n >\n <form\n onSubmit={handleSubmit(postAnswer)}\n onChange={() => {\n setEdited(true);\n }}\n >\n <Typography variant=\"h6\">Your answer</Typography>\n {error && (\n <WarningPanel severity=\"error\" title={t('answerForm.errorPosting')} />\n )}\n <Controller\n control={control}\n defaultValue=\"\"\n rules={{\n required: true,\n }}\n render={({ field: { onChange, value } }) => (\n <MarkdownEditor\n value={value}\n onChange={onChange}\n height={200}\n error={'answer' in errors}\n placeholder={t('answerForm.contentInput.placeholder')}\n onImageUpload={onImageUpload}\n answerId={id ? Number(id) : undefined}\n />\n )}\n name=\"answer\"\n />\n {allowAnonymouns && !id && (\n <PostAnonymouslyCheckbox\n control={control}\n label={t('anonymousCheckbox.answerAnonymously')}\n />\n )}\n <Button\n variant=\"outlined\"\n type=\"submit\"\n color=\"primary\"\n disabled={posting || isSubmitting}\n style={{ marginTop: id ? theme.spacing(1) : '0' }}\n >\n {posting || isSubmitting ? (\n <span>\n {t('answerForm.submitting')}{' '}\n <span className=\"spinner-border spinner-border-sm\" />\n </span>\n ) : (\n t(\n id\n ? 'answerForm.submit.existingAnswer'\n : 'answerForm.submit.newAnswer',\n )\n )}\n </Button>\n </form>\n </OptionalRequirePermission>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AnswerForm.esm.js","sources":["../../../src/components/AnswerForm/AnswerForm.tsx"],"sourcesContent":["import { WarningPanel } from '@backstage/core-components';\nimport { useCallback, useEffect, useState } from 'react';\nimport { configApiRef, useAnalytics, useApi } from '@backstage/core-plugin-api';\nimport {\n AnswerResponse,\n PostResponse,\n qetaCreateAnswerPermission,\n} from '@drodil/backstage-plugin-qeta-common';\nimport { Controller, useForm } from 'react-hook-form';\nimport { MarkdownEditor } from '../MarkdownEditor/MarkdownEditor';\nimport { PostAnonymouslyCheckbox } from '../PostAnonymouslyCheckbox/PostAnonymouslyCheckbox';\nimport { useConfirmNavigationIfEdited } from '../../utils/utils';\nimport { qetaApiRef } from '../../api';\nimport { Box, Button, Typography, useTheme } from '@material-ui/core';\nimport { OptionalRequirePermission } from '../Utility/OptionalRequirePermission';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { useIdentityApi, useIsModerator } from '../../hooks';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport { EntitiesInput } from '../PostForm/EntitiesInput';\nimport { Entity, stringifyEntityRef } from '@backstage/catalog-model';\n\ntype AnswerFormData = {\n postId: number;\n answer: string;\n images: number[];\n author?: Entity;\n anonymous?: boolean;\n};\n\nconst getDefaultValues = (postId: number): AnswerFormData => {\n return { postId, answer: '', images: [] };\n};\n\nexport const AnswerForm = (props: {\n post: PostResponse;\n onPost: (answer: AnswerResponse) => void;\n id?: number;\n}) => {\n const { post, onPost, id } = props;\n const [values, setValues] = useState<AnswerFormData>(\n getDefaultValues(post.id),\n );\n const analytics = useAnalytics();\n const isModerator = useIsModerator();\n const { value: identity } = useIdentityApi(\n api => api.getBackstageIdentity(),\n [],\n );\n const theme = useTheme();\n const [error, setError] = useState(false);\n const [posting, setPosting] = useState(false);\n const catalogApi = useApi(catalogApiRef);\n const [images, setImages] = useState<number[]>([]);\n const [edited, setEdited] = useState(false);\n const qetaApi = useApi(qetaApiRef);\n const configApi = useApi(configApiRef);\n const allowAnonymouns = configApi.getOptionalBoolean('qeta.allowAnonymous');\n const { t } = useTranslationRef(qetaTranslationRef);\n\n const {\n handleSubmit,\n control,\n formState: { errors, isSubmitting },\n reset,\n } = useForm<AnswerFormData>({\n values,\n defaultValues: getDefaultValues(post.id),\n });\n\n const postAnswer = (data: AnswerFormData) => {\n setPosting(true);\n\n if (id) {\n qetaApi\n .updateAnswer(id, {\n postId: post.id,\n answer: data.answer,\n author: data.author ? stringifyEntityRef(data.author) : undefined,\n images,\n })\n .then(a => {\n if (!a || !('id' in a)) {\n setError(true);\n return;\n }\n setEdited(false);\n analytics.captureEvent('edit', 'answer');\n reset();\n onPost(a);\n })\n .catch(_e => setError(true))\n .finally(() => setPosting(false));\n return;\n }\n // http://localhost:7007/api/qeta/attachments/36e551b1-3be7-479a-8942-b7018434e710\n qetaApi\n .postAnswer({\n postId: post.id,\n answer: data.answer,\n images,\n anonymous: data.anonymous,\n })\n .then(a => {\n if (!a || !('id' in a)) {\n setError(true);\n return;\n }\n setEdited(false);\n analytics.captureEvent('post', 'answer');\n reset();\n onPost(a);\n })\n .catch(_e => setError(true))\n .finally(() => setPosting(false));\n };\n\n useEffect(() => {\n if (id) {\n qetaApi.getAnswer(post.id, id).then(a => {\n if ('content' in a) {\n setValues({ postId: post.id, answer: a.content, images: a.images });\n setImages(a.images);\n catalogApi.getEntityByRef(a.author).then(data => {\n if (data) {\n setValues(v => {\n return { ...v, author: data };\n });\n }\n });\n } else {\n setError(true);\n }\n });\n }\n }, [catalogApi, id, post, qetaApi]);\n\n useEffect(() => {\n if (!id && identity?.userEntityRef) {\n catalogApi.getEntityByRef(identity.userEntityRef).then(data => {\n if (data) {\n setValues(v => {\n return { ...v, author: data };\n });\n }\n });\n }\n }, [catalogApi, id, identity]);\n\n useEffect(() => {\n reset(values);\n }, [values, reset]);\n\n useConfirmNavigationIfEdited(edited);\n\n const onImageUpload = useCallback(\n (imageId: number) => {\n setImages(prevImages => [...prevImages, imageId]);\n },\n [setImages],\n );\n\n return (\n <OptionalRequirePermission\n permission={qetaCreateAnswerPermission}\n errorPage={<></>}\n >\n <form\n onSubmit={handleSubmit(postAnswer)}\n onChange={() => {\n setEdited(true);\n }}\n >\n <Typography variant=\"h6\">Your answer</Typography>\n {error && (\n <WarningPanel severity=\"error\" title={t('answerForm.errorPosting')} />\n )}\n <Controller\n control={control}\n defaultValue=\"\"\n rules={{\n required: true,\n }}\n render={({ field: { onChange, value } }) => (\n <MarkdownEditor\n value={value}\n onChange={onChange}\n height={200}\n error={'answer' in errors}\n placeholder={t('answerForm.contentInput.placeholder')}\n onImageUpload={onImageUpload}\n answerId={id ? Number(id) : undefined}\n />\n )}\n name=\"answer\"\n />\n {isModerator && id && (\n <Box mt={1} mb={1}>\n <Controller\n control={control}\n render={({ field, fieldState: { error: authorError } }) => {\n return (\n <EntitiesInput\n label={t('postForm.authorInput.label')}\n placeholder={t('postForm.authorInput.placeholder')}\n hideHelpText\n multiple={false}\n kind={['User']}\n required\n {...field}\n error={authorError}\n />\n );\n }}\n name=\"author\"\n />\n </Box>\n )}\n {allowAnonymouns && !id && (\n <PostAnonymouslyCheckbox\n control={control}\n label={t('anonymousCheckbox.answerAnonymously')}\n />\n )}\n <Button\n variant=\"outlined\"\n type=\"submit\"\n color=\"primary\"\n disabled={posting || isSubmitting}\n style={{ marginTop: id ? theme.spacing(1) : '0' }}\n >\n {posting || isSubmitting ? (\n <span>\n {t('answerForm.submitting')}{' '}\n <span className=\"spinner-border spinner-border-sm\" />\n </span>\n ) : (\n t(\n id\n ? 'answerForm.submit.existingAnswer'\n : 'answerForm.submit.newAnswer',\n )\n )}\n </Button>\n </form>\n </OptionalRequirePermission>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { createContext, useContext } from 'react';
|
|
3
|
+
|
|
4
|
+
const QetaExtensionContext = createContext({
|
|
5
|
+
remarkPlugins: [],
|
|
6
|
+
rehypePlugins: []
|
|
7
|
+
});
|
|
8
|
+
const QetaExtensionProvider = (props) => {
|
|
9
|
+
return /* @__PURE__ */ jsx(QetaExtensionContext.Provider, { value: props, children: props.children });
|
|
10
|
+
};
|
|
11
|
+
function useQetaExtensions() {
|
|
12
|
+
const context = useContext(QetaExtensionContext);
|
|
13
|
+
if (!context) {
|
|
14
|
+
return {
|
|
15
|
+
remarkPlugins: [],
|
|
16
|
+
rehypePlugins: []
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
return context;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export { QetaExtensionContext, QetaExtensionProvider, useQetaExtensions };
|
|
23
|
+
//# sourceMappingURL=ExtensionContext.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ExtensionContext.esm.js","sources":["../../../src/components/ExtensionContext/ExtensionContext.tsx"],"sourcesContent":["import { createContext, PropsWithChildren, useContext } from 'react';\nimport type { PluggableList } from 'unified';\n\nexport type QetaExtensionContextProps = {\n remarkPlugins?: PluggableList;\n rehypePlugins?: PluggableList;\n};\n\nexport const QetaExtensionContext = createContext<QetaExtensionContextProps>({\n remarkPlugins: [],\n rehypePlugins: [],\n});\n\nexport const QetaExtensionProvider = (\n props: PropsWithChildren<QetaExtensionContextProps>,\n) => {\n return (\n <QetaExtensionContext.Provider value={props}>\n {props.children}\n </QetaExtensionContext.Provider>\n );\n};\n\nexport function useQetaExtensions(): QetaExtensionContextProps {\n const context = useContext(QetaExtensionContext);\n\n if (!context) {\n return {\n remarkPlugins: [],\n rehypePlugins: [],\n };\n }\n\n return context;\n}\n"],"names":[],"mappings":";;;AAQO,MAAM,uBAAuB,aAAyC,CAAA;AAAA,EAC3E,eAAe,EAAC;AAAA,EAChB,eAAe;AACjB,CAAC;AAEY,MAAA,qBAAA,GAAwB,CACnC,KACG,KAAA;AACH,EAAA,2BACG,oBAAqB,CAAA,QAAA,EAArB,EAA8B,KAAO,EAAA,KAAA,EACnC,gBAAM,QACT,EAAA,CAAA;AAEJ;AAEO,SAAS,iBAA+C,GAAA;AAC7D,EAAM,MAAA,OAAA,GAAU,WAAW,oBAAoB,CAAA;AAE/C,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAO,OAAA;AAAA,MACL,eAAe,EAAC;AAAA,MAChB,eAAe;AAAC,KAClB;AAAA;AAGF,EAAO,OAAA,OAAA;AACT;;;;"}
|
|
@@ -18,7 +18,7 @@ import { qetaTranslationRef } from '../../translation.esm.js';
|
|
|
18
18
|
import GithubSlugger from 'github-slugger';
|
|
19
19
|
import { find } from 'unist-util-find';
|
|
20
20
|
import { TagChip } from '../TagsAndEntities/TagChip.esm.js';
|
|
21
|
-
import
|
|
21
|
+
import { useQetaExtensions } from '../ExtensionContext/ExtensionContext.esm.js';
|
|
22
22
|
|
|
23
23
|
const slugger = new GithubSlugger();
|
|
24
24
|
const useStyles = makeStyles(
|
|
@@ -255,15 +255,8 @@ const MarkdownRenderer = (props) => {
|
|
|
255
255
|
element.scrollIntoView({ behavior: "auto", block: "start" });
|
|
256
256
|
}
|
|
257
257
|
}, []);
|
|
258
|
-
const
|
|
259
|
-
|
|
260
|
-
[
|
|
261
|
-
rehypeMermaid,
|
|
262
|
-
{
|
|
263
|
-
colorScheme: darkTheme ? "dark" : "light"
|
|
264
|
-
}
|
|
265
|
-
]
|
|
266
|
-
];
|
|
258
|
+
const extensions = useQetaExtensions();
|
|
259
|
+
const rehypePlugins = [[rehypeSlug]];
|
|
267
260
|
if (showToc) {
|
|
268
261
|
rehypePlugins.push([
|
|
269
262
|
rehypeToc,
|
|
@@ -298,8 +291,8 @@ const MarkdownRenderer = (props) => {
|
|
|
298
291
|
return /* @__PURE__ */ jsx("div", { className: `${classes.markdown} ${mainClassName ?? ""}`.trim(), children: /* @__PURE__ */ jsx(
|
|
299
292
|
MarkdownHooks,
|
|
300
293
|
{
|
|
301
|
-
remarkPlugins: [gfm],
|
|
302
|
-
rehypePlugins,
|
|
294
|
+
remarkPlugins: [gfm, ...extensions.remarkPlugins ?? []],
|
|
295
|
+
rehypePlugins: [...rehypePlugins, ...extensions.rehypePlugins ?? []],
|
|
303
296
|
components: {
|
|
304
297
|
h1: (p) => headingRenderer(p),
|
|
305
298
|
h2: (p) => headingRenderer(p),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarkdownRenderer.esm.js","sources":["../../../src/components/MarkdownRenderer/MarkdownRenderer.tsx"],"sourcesContent":["import { Children, createElement, PropsWithChildren, useEffect } from 'react';\nimport SyntaxHighlighter from 'react-syntax-highlighter';\nimport { MarkdownHooks } from 'react-markdown';\nimport {\n a11yDark,\n a11yLight,\n} from 'react-syntax-highlighter/dist/esm/styles/hljs';\nimport { IconButton, makeStyles, Tooltip, Typography } from '@material-ui/core';\nimport {\n findEntityMentions,\n findTagMentions,\n} from '@drodil/backstage-plugin-qeta-common';\nimport gfm from 'remark-gfm';\nimport rehypeSlug from 'rehype-slug';\nimport rehypeToc, { HeadingNode, TextNode } from '@jsdevtools/rehype-toc';\nimport { EntityRefLink } from '@backstage/plugin-catalog-react';\nimport { useIsDarkTheme } from '../../hooks/useIsDarkTheme';\nimport { BackstageOverrides } from '@backstage/core-components';\nimport LinkIcon from '@material-ui/icons/Link';\nimport FileCopyIcon from '@material-ui/icons/FileCopy';\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { Variant } from '@material-ui/core/styles/createTypography';\nimport GithubSlugger from 'github-slugger';\nimport { HtmlElementNode } from '@jsdevtools/rehype-toc/lib/types';\nimport { find } from 'unist-util-find';\nimport { TagChip } from '../TagsAndEntities/TagChip';\nimport rehypeMermaid from 'rehype-mermaid';\n\nconst slugger = new GithubSlugger();\n\nexport type QetaMarkdownContentClassKey =\n | 'markdown'\n | 'header'\n | 'tocHeader'\n | 'toc'\n | 'tocList'\n | 'tocListItem'\n | 'tocLink';\n\nconst useStyles = makeStyles(\n theme => {\n const overrides = theme.overrides as BackstageOverrides;\n return {\n markdown: {\n lineHeight: 1.75,\n '& p': {\n ...theme.typography?.body1,\n margin: '0 0 1em 0',\n wordBreak: 'break-word',\n },\n '& h1': {\n ...theme.typography?.h1,\n marginBottom: 2,\n marginTop: '1.5em',\n },\n '& h2': {\n ...theme.typography?.h2,\n marginBottom: 2,\n marginTop: '1.2em',\n },\n '& h3': {\n ...theme.typography?.h3,\n marginBottom: 2,\n marginTop: '1em',\n },\n '& h4': {\n ...theme.typography?.h4,\n marginBottom: 2,\n marginTop: '0.8em',\n },\n '& h5': {\n ...theme.typography?.h5,\n marginBottom: 2,\n marginTop: '0.7em',\n },\n '& h6': {\n ...theme.typography?.h6,\n marginBottom: 2,\n marginTop: '0.6em',\n },\n '& table': {\n borderCollapse: 'collapse',\n border: `1px solid ${theme.palette.border}`,\n },\n '& th, & td': {\n border: `1px solid ${theme.palette.border}`,\n padding: theme.spacing(1),\n },\n '& td': {\n wordBreak: 'break-word',\n overflow: 'hidden',\n verticalAlign: 'middle',\n lineHeight: '1',\n margin: 0,\n padding: theme.spacing(3, 2, 3, 2.5),\n borderBottom: 0,\n },\n '& th': {\n backgroundColor: theme.palette.background.paper,\n },\n '& tr': {\n backgroundColor: theme.palette.background.paper,\n },\n '& tr:nth-child(odd)': {\n backgroundColor: theme.palette.background.default,\n },\n '& a': {\n color: theme.palette.link,\n },\n '& img': {\n maxWidth: '100%',\n },\n '& code': {\n fontFamily: 'Courier New,Courier,monospace',\n fontStyle: 'normal',\n display: 'block',\n width: '100%',\n overflowX: 'auto',\n borderRadius: 4,\n padding: '0.2em 0.4em',\n },\n '& em': {\n fontStyle: 'italic !important',\n },\n '& ol': {\n listStyle: 'decimal',\n marginLeft: '2em',\n marginBottom: '1em',\n marginTop: '1em',\n },\n '& ul': {\n listStyle: 'disc',\n marginLeft: '2em',\n marginBottom: '1em',\n marginTop: '1em',\n },\n '& blockquote': {\n backgroundColor: theme.palette.background.paper,\n border: `1px solid ${theme.palette.divider}`,\n padding: '1em 1.5em',\n margin: '1.5em 0',\n color: theme.palette.text.secondary,\n borderLeft: `4px solid ${theme.palette.divider}`,\n },\n '& li': {\n marginTop: '0.5em',\n },\n '& *:first-child': {\n marginTop: 0,\n },\n '& *:last-child': {\n marginBottom: 0,\n },\n '& path': {\n stroke: `${theme.palette.text.primary} !important`,\n },\n ...(overrides?.BackstageMarkdownContent ?? {}),\n },\n codeBlockContainer: {\n position: 'relative',\n '& .copyCodeButton': {\n opacity: 0,\n pointerEvents: 'none',\n transition: 'opacity 0.2s',\n },\n '&:hover .copyCodeButton': {\n opacity: 1,\n pointerEvents: 'auto',\n },\n },\n header: {\n '& .anchor-link': {\n display: 'none',\n marginLeft: '0.5em',\n },\n '&:hover .anchor-link': {\n display: 'inline-block',\n },\n },\n tocHeader: {\n marginTop: '0.5em',\n marginBottom: 0,\n },\n toc: {\n marginTop: '0.5em',\n marginLeft: '0.2em',\n paddingBottom: '1em',\n borderBottom: `1px solid ${theme.palette.divider}`,\n },\n tocList: {\n marginLeft: '0 !important',\n marginTop: '0.5em !important',\n paddingInlineStart: '1em',\n counterReset: 'item',\n },\n tocListItem: {\n display: 'block',\n '&:before': {\n content: 'counters(item, \".\") \" \"',\n counterIncrement: 'item',\n },\n },\n tocLink: {\n color: theme.palette.link,\n },\n };\n },\n { name: 'QetaMarkdownContent' },\n);\n\nconst flatten = (text: string, child: any): string => {\n if (!child) return text;\n\n return typeof child === 'string'\n ? text + child\n : Children.toArray(child.props.children).reduce(flatten, text);\n};\n\nexport const MarkdownRenderer = (props: {\n content: string;\n className?: string;\n showToc?: boolean;\n useBlankLinks?: boolean;\n}) => {\n const { content, className: mainClassName, showToc, useBlankLinks } = props;\n const darkTheme = useIsDarkTheme();\n const { t } = useTranslationRef(qetaTranslationRef);\n const classes = useStyles();\n const alertApi = useApi(alertApiRef);\n slugger.reset();\n\n const copyToClipboard = (slug: string) => {\n const url = new URL(window.location.href);\n url.hash = `#${slug}`;\n window.navigator.clipboard.writeText(url.toString());\n alertApi.post({\n message: t('link.copied'),\n severity: 'info',\n display: 'transient',\n });\n };\n\n const copyCodeToClipboard = (code: string) => {\n window.navigator.clipboard.writeText(code);\n alertApi.post({\n message: t('code.copied'),\n severity: 'info',\n display: 'transient',\n });\n };\n\n const headingRenderer = (\n hProps: PropsWithChildren<{ node: { tagName: string } }>,\n ) => {\n const { node, children } = hProps;\n const childrenArray = Children.toArray(children);\n const text = childrenArray.reduce(flatten, '');\n const slug = slugger.slug(text);\n const link = (\n <Tooltip title={t('link.aria')}>\n <IconButton\n aria-label={t('link.aria')}\n onClick={() => copyToClipboard(slug)}\n size=\"small\"\n className=\"anchor-link\"\n >\n <LinkIcon />\n </IconButton>\n </Tooltip>\n );\n return (\n <>\n {createElement(\n Typography,\n {\n variant: node.tagName as Variant,\n id: slug,\n className: classes.header,\n },\n [children, link],\n )}\n </>\n );\n };\n\n useEffect(() => {\n if (!window.location.hash) {\n return;\n }\n\n const id = window.location.hash.slice(1);\n const element = document.getElementById(id);\n if (element) {\n element.scrollIntoView({ behavior: 'auto', block: 'start' });\n }\n }, []);\n\n const rehypePlugins: import('unified').PluggableList = [\n [rehypeSlug],\n [\n rehypeMermaid,\n {\n colorScheme: darkTheme ? 'dark' : 'light',\n },\n ],\n ];\n if (showToc) {\n rehypePlugins.push([\n rehypeToc,\n {\n cssClasses: {\n toc: classes.toc,\n list: classes.tocList,\n listItem: classes.tocListItem,\n link: classes.tocLink,\n },\n customizeTOC: (toc: HtmlElementNode) => {\n const listItems = find(toc, { tagName: 'li' });\n if (!toc.children || !listItems) {\n return false;\n }\n const tocHeader: TextNode = {\n type: 'text',\n value: t('markdown.toc'),\n };\n const heading: HeadingNode = {\n type: 'element',\n tagName: 'h3',\n properties: {},\n children: [tocHeader],\n };\n\n toc.children.unshift(heading);\n return toc;\n },\n },\n ]);\n }\n\n return (\n <div className={`${classes.markdown} ${mainClassName ?? ''}`.trim()}>\n <MarkdownHooks\n remarkPlugins={[gfm]}\n rehypePlugins={rehypePlugins}\n components={{\n h1: (p: any) => headingRenderer(p),\n h2: (p: any) => headingRenderer(p),\n h3: (p: any) => headingRenderer(p),\n h4: (p: any) => headingRenderer(p),\n h5: (p: any) => headingRenderer(p),\n h6: (p: any) => headingRenderer(p),\n p: (p: any) => {\n const { children } = p;\n const arr = Children.toArray(children);\n const formatted = arr.map((child: any) => {\n if (typeof child !== 'string') {\n return child;\n }\n const userMentions = findEntityMentions(child);\n const tagMentions = findTagMentions(child);\n if (userMentions.length === 0 && tagMentions.length === 0) {\n return child;\n }\n\n return child.split(' ').map((word: string) => {\n const userMention = userMentions.find(m => word === m);\n if (userMention) {\n return (\n <>\n <EntityRefLink\n entityRef={userMention.slice(1)}\n hideIcon\n target={useBlankLinks ? '_blank' : undefined}\n />{' '}\n </>\n );\n }\n\n const tagMention = tagMentions.find(m => word === m);\n if (tagMention) {\n return (\n <TagChip\n tag={tagMention.slice(1)}\n style={{ marginBottom: 0 }}\n useHref={useBlankLinks}\n key={tagMention}\n />\n );\n }\n\n return <>{word} </>;\n });\n });\n\n return <p>{formatted}</p>;\n },\n code(p: any) {\n const { children, className, node, ...rest } = p;\n const match = /language-(\\w+)/.exec(className || '');\n const codeString = String(children).replace(/\\n$/, '');\n return match ? (\n <div className={classes.codeBlockContainer}>\n <SyntaxHighlighter\n {...rest}\n PreTag=\"div\"\n language={match[1]}\n style={darkTheme ? a11yDark : a11yLight}\n showLineNumbers\n >\n {codeString}\n </SyntaxHighlighter>\n <Tooltip title={t('code.aria')}>\n <IconButton\n aria-label={t('code.aria')}\n size=\"small\"\n className=\"copyCodeButton\"\n style={{\n position: 'absolute',\n top: 8,\n right: 8,\n zIndex: 2,\n }}\n onClick={() => copyCodeToClipboard(codeString)}\n >\n <FileCopyIcon fontSize=\"small\" />\n </IconButton>\n </Tooltip>\n </div>\n ) : (\n <code {...rest} className={className}>\n {children}\n </code>\n );\n },\n }}\n >\n {content}\n </MarkdownHooks>\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAM,OAAA,GAAU,IAAI,aAAc,EAAA;AAWlC,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB,CAAS,KAAA,KAAA;AACP,IAAA,MAAM,YAAY,KAAM,CAAA,SAAA;AACxB,IAAO,OAAA;AAAA,MACL,QAAU,EAAA;AAAA,QACR,UAAY,EAAA,IAAA;AAAA,QACZ,KAAO,EAAA;AAAA,UACL,GAAG,MAAM,UAAY,EAAA,KAAA;AAAA,UACrB,MAAQ,EAAA,WAAA;AAAA,UACR,SAAW,EAAA;AAAA,SACb;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,GAAG,MAAM,UAAY,EAAA,EAAA;AAAA,UACrB,YAAc,EAAA,CAAA;AAAA,UACd,SAAW,EAAA;AAAA,SACb;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,GAAG,MAAM,UAAY,EAAA,EAAA;AAAA,UACrB,YAAc,EAAA,CAAA;AAAA,UACd,SAAW,EAAA;AAAA,SACb;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,GAAG,MAAM,UAAY,EAAA,EAAA;AAAA,UACrB,YAAc,EAAA,CAAA;AAAA,UACd,SAAW,EAAA;AAAA,SACb;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,GAAG,MAAM,UAAY,EAAA,EAAA;AAAA,UACrB,YAAc,EAAA,CAAA;AAAA,UACd,SAAW,EAAA;AAAA,SACb;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,GAAG,MAAM,UAAY,EAAA,EAAA;AAAA,UACrB,YAAc,EAAA,CAAA;AAAA,UACd,SAAW,EAAA;AAAA,SACb;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,GAAG,MAAM,UAAY,EAAA,EAAA;AAAA,UACrB,YAAc,EAAA,CAAA;AAAA,UACd,SAAW,EAAA;AAAA,SACb;AAAA,QACA,SAAW,EAAA;AAAA,UACT,cAAgB,EAAA,UAAA;AAAA,UAChB,MAAQ,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,MAAM,CAAA;AAAA,SAC3C;AAAA,QACA,YAAc,EAAA;AAAA,UACZ,MAAQ,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,MAAM,CAAA,CAAA;AAAA,UACzC,OAAA,EAAS,KAAM,CAAA,OAAA,CAAQ,CAAC;AAAA,SAC1B;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,SAAW,EAAA,YAAA;AAAA,UACX,QAAU,EAAA,QAAA;AAAA,UACV,aAAe,EAAA,QAAA;AAAA,UACf,UAAY,EAAA,GAAA;AAAA,UACZ,MAAQ,EAAA,CAAA;AAAA,UACR,SAAS,KAAM,CAAA,OAAA,CAAQ,CAAG,EAAA,CAAA,EAAG,GAAG,GAAG,CAAA;AAAA,UACnC,YAAc,EAAA;AAAA,SAChB;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA;AAAA,SAC5C;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA;AAAA,SAC5C;AAAA,QACA,qBAAuB,EAAA;AAAA,UACrB,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA;AAAA,SAC5C;AAAA,QACA,KAAO,EAAA;AAAA,UACL,KAAA,EAAO,MAAM,OAAQ,CAAA;AAAA,SACvB;AAAA,QACA,OAAS,EAAA;AAAA,UACP,QAAU,EAAA;AAAA,SACZ;AAAA,QACA,QAAU,EAAA;AAAA,UACR,UAAY,EAAA,+BAAA;AAAA,UACZ,SAAW,EAAA,QAAA;AAAA,UACX,OAAS,EAAA,OAAA;AAAA,UACT,KAAO,EAAA,MAAA;AAAA,UACP,SAAW,EAAA,MAAA;AAAA,UACX,YAAc,EAAA,CAAA;AAAA,UACd,OAAS,EAAA;AAAA,SACX;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,SAAW,EAAA;AAAA,SACb;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,SAAW,EAAA,SAAA;AAAA,UACX,UAAY,EAAA,KAAA;AAAA,UACZ,YAAc,EAAA,KAAA;AAAA,UACd,SAAW,EAAA;AAAA,SACb;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,SAAW,EAAA,MAAA;AAAA,UACX,UAAY,EAAA,KAAA;AAAA,UACZ,YAAc,EAAA,KAAA;AAAA,UACd,SAAW,EAAA;AAAA,SACb;AAAA,QACA,cAAgB,EAAA;AAAA,UACd,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA,KAAA;AAAA,UAC1C,MAAQ,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,OAAO,CAAA,CAAA;AAAA,UAC1C,OAAS,EAAA,WAAA;AAAA,UACT,MAAQ,EAAA,SAAA;AAAA,UACR,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,SAAA;AAAA,UAC1B,UAAY,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,OAAO,CAAA;AAAA,SAChD;AAAA,QACA,MAAQ,EAAA;AAAA,UACN,SAAW,EAAA;AAAA,SACb;AAAA,QACA,iBAAmB,EAAA;AAAA,UACjB,SAAW,EAAA;AAAA,SACb;AAAA,QACA,gBAAkB,EAAA;AAAA,UAChB,YAAc,EAAA;AAAA,SAChB;AAAA,QACA,QAAU,EAAA;AAAA,UACR,MAAQ,EAAA,CAAA,EAAG,KAAM,CAAA,OAAA,CAAQ,KAAK,OAAO,CAAA,WAAA;AAAA,SACvC;AAAA,QACA,GAAI,SAAW,EAAA,wBAAA,IAA4B;AAAC,OAC9C;AAAA,MACA,kBAAoB,EAAA;AAAA,QAClB,QAAU,EAAA,UAAA;AAAA,QACV,mBAAqB,EAAA;AAAA,UACnB,OAAS,EAAA,CAAA;AAAA,UACT,aAAe,EAAA,MAAA;AAAA,UACf,UAAY,EAAA;AAAA,SACd;AAAA,QACA,yBAA2B,EAAA;AAAA,UACzB,OAAS,EAAA,CAAA;AAAA,UACT,aAAe,EAAA;AAAA;AACjB,OACF;AAAA,MACA,MAAQ,EAAA;AAAA,QACN,gBAAkB,EAAA;AAAA,UAChB,OAAS,EAAA,MAAA;AAAA,UACT,UAAY,EAAA;AAAA,SACd;AAAA,QACA,sBAAwB,EAAA;AAAA,UACtB,OAAS,EAAA;AAAA;AACX,OACF;AAAA,MACA,SAAW,EAAA;AAAA,QACT,SAAW,EAAA,OAAA;AAAA,QACX,YAAc,EAAA;AAAA,OAChB;AAAA,MACA,GAAK,EAAA;AAAA,QACH,SAAW,EAAA,OAAA;AAAA,QACX,UAAY,EAAA,OAAA;AAAA,QACZ,aAAe,EAAA,KAAA;AAAA,QACf,YAAc,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,OAAO,CAAA;AAAA,OAClD;AAAA,MACA,OAAS,EAAA;AAAA,QACP,UAAY,EAAA,cAAA;AAAA,QACZ,SAAW,EAAA,kBAAA;AAAA,QACX,kBAAoB,EAAA,KAAA;AAAA,QACpB,YAAc,EAAA;AAAA,OAChB;AAAA,MACA,WAAa,EAAA;AAAA,QACX,OAAS,EAAA,OAAA;AAAA,QACT,UAAY,EAAA;AAAA,UACV,OAAS,EAAA,yBAAA;AAAA,UACT,gBAAkB,EAAA;AAAA;AACpB,OACF;AAAA,MACA,OAAS,EAAA;AAAA,QACP,KAAA,EAAO,MAAM,OAAQ,CAAA;AAAA;AACvB,KACF;AAAA,GACF;AAAA,EACA,EAAE,MAAM,qBAAsB;AAChC,CAAA;AAEA,MAAM,OAAA,GAAU,CAAC,IAAA,EAAc,KAAuB,KAAA;AACpD,EAAI,IAAA,CAAC,OAAc,OAAA,IAAA;AAEnB,EAAA,OAAO,OAAO,KAAA,KAAU,QACpB,GAAA,IAAA,GAAO,KACP,GAAA,QAAA,CAAS,OAAQ,CAAA,KAAA,CAAM,KAAM,CAAA,QAAQ,CAAE,CAAA,MAAA,CAAO,SAAS,IAAI,CAAA;AACjE,CAAA;AAEa,MAAA,gBAAA,GAAmB,CAAC,KAK3B,KAAA;AACJ,EAAA,MAAM,EAAE,OAAS,EAAA,SAAA,EAAW,aAAe,EAAA,OAAA,EAAS,eAAkB,GAAA,KAAA;AACtE,EAAA,MAAM,YAAY,cAAe,EAAA;AACjC,EAAA,MAAM,EAAE,CAAA,EAAM,GAAA,iBAAA,CAAkB,kBAAkB,CAAA;AAClD,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAM,MAAA,QAAA,GAAW,OAAO,WAAW,CAAA;AACnC,EAAA,OAAA,CAAQ,KAAM,EAAA;AAEd,EAAM,MAAA,eAAA,GAAkB,CAAC,IAAiB,KAAA;AACxC,IAAA,MAAM,GAAM,GAAA,IAAI,GAAI,CAAA,MAAA,CAAO,SAAS,IAAI,CAAA;AACxC,IAAI,GAAA,CAAA,IAAA,GAAO,IAAI,IAAI,CAAA,CAAA;AACnB,IAAA,MAAA,CAAO,SAAU,CAAA,SAAA,CAAU,SAAU,CAAA,GAAA,CAAI,UAAU,CAAA;AACnD,IAAA,QAAA,CAAS,IAAK,CAAA;AAAA,MACZ,OAAA,EAAS,EAAE,aAAa,CAAA;AAAA,MACxB,QAAU,EAAA,MAAA;AAAA,MACV,OAAS,EAAA;AAAA,KACV,CAAA;AAAA,GACH;AAEA,EAAM,MAAA,mBAAA,GAAsB,CAAC,IAAiB,KAAA;AAC5C,IAAO,MAAA,CAAA,SAAA,CAAU,SAAU,CAAA,SAAA,CAAU,IAAI,CAAA;AACzC,IAAA,QAAA,CAAS,IAAK,CAAA;AAAA,MACZ,OAAA,EAAS,EAAE,aAAa,CAAA;AAAA,MACxB,QAAU,EAAA,MAAA;AAAA,MACV,OAAS,EAAA;AAAA,KACV,CAAA;AAAA,GACH;AAEA,EAAM,MAAA,eAAA,GAAkB,CACtB,MACG,KAAA;AACH,IAAM,MAAA,EAAE,IAAM,EAAA,QAAA,EAAa,GAAA,MAAA;AAC3B,IAAM,MAAA,aAAA,GAAgB,QAAS,CAAA,OAAA,CAAQ,QAAQ,CAAA;AAC/C,IAAA,MAAM,IAAO,GAAA,aAAA,CAAc,MAAO,CAAA,OAAA,EAAS,EAAE,CAAA;AAC7C,IAAM,MAAA,IAAA,GAAO,OAAQ,CAAA,IAAA,CAAK,IAAI,CAAA;AAC9B,IAAA,MAAM,uBACH,GAAA,CAAA,OAAA,EAAA,EAAQ,KAAO,EAAA,CAAA,CAAE,WAAW,CAC3B,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,EAAE,WAAW,CAAA;AAAA,QACzB,OAAA,EAAS,MAAM,eAAA,CAAgB,IAAI,CAAA;AAAA,QACnC,IAAK,EAAA,OAAA;AAAA,QACL,SAAU,EAAA,aAAA;AAAA,QAEV,8BAAC,QAAS,EAAA,EAAA;AAAA;AAAA,KAEd,EAAA,CAAA;AAEF,IAAA,uBAEK,GAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA,aAAA;AAAA,MACC,UAAA;AAAA,MACA;AAAA,QACE,SAAS,IAAK,CAAA,OAAA;AAAA,QACd,EAAI,EAAA,IAAA;AAAA,QACJ,WAAW,OAAQ,CAAA;AAAA,OACrB;AAAA,MACA,CAAC,UAAU,IAAI;AAAA,KAEnB,EAAA,CAAA;AAAA,GAEJ;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,CAAC,MAAO,CAAA,QAAA,CAAS,IAAM,EAAA;AACzB,MAAA;AAAA;AAGF,IAAA,MAAM,EAAK,GAAA,MAAA,CAAO,QAAS,CAAA,IAAA,CAAK,MAAM,CAAC,CAAA;AACvC,IAAM,MAAA,OAAA,GAAU,QAAS,CAAA,cAAA,CAAe,EAAE,CAAA;AAC1C,IAAA,IAAI,OAAS,EAAA;AACX,MAAA,OAAA,CAAQ,eAAe,EAAE,QAAA,EAAU,MAAQ,EAAA,KAAA,EAAO,SAAS,CAAA;AAAA;AAC7D,GACF,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,aAAiD,GAAA;AAAA,IACrD,CAAC,UAAU,CAAA;AAAA,IACX;AAAA,MACE,aAAA;AAAA,MACA;AAAA,QACE,WAAA,EAAa,YAAY,MAAS,GAAA;AAAA;AACpC;AACF,GACF;AACA,EAAA,IAAI,OAAS,EAAA;AACX,IAAA,aAAA,CAAc,IAAK,CAAA;AAAA,MACjB,SAAA;AAAA,MACA;AAAA,QACE,UAAY,EAAA;AAAA,UACV,KAAK,OAAQ,CAAA,GAAA;AAAA,UACb,MAAM,OAAQ,CAAA,OAAA;AAAA,UACd,UAAU,OAAQ,CAAA,WAAA;AAAA,UAClB,MAAM,OAAQ,CAAA;AAAA,SAChB;AAAA,QACA,YAAA,EAAc,CAAC,GAAyB,KAAA;AACtC,UAAA,MAAM,YAAY,IAAK,CAAA,GAAA,EAAK,EAAE,OAAA,EAAS,MAAM,CAAA;AAC7C,UAAA,IAAI,CAAC,GAAA,CAAI,QAAY,IAAA,CAAC,SAAW,EAAA;AAC/B,YAAO,OAAA,KAAA;AAAA;AAET,UAAA,MAAM,SAAsB,GAAA;AAAA,YAC1B,IAAM,EAAA,MAAA;AAAA,YACN,KAAA,EAAO,EAAE,cAAc;AAAA,WACzB;AACA,UAAA,MAAM,OAAuB,GAAA;AAAA,YAC3B,IAAM,EAAA,SAAA;AAAA,YACN,OAAS,EAAA,IAAA;AAAA,YACT,YAAY,EAAC;AAAA,YACb,QAAA,EAAU,CAAC,SAAS;AAAA,WACtB;AAEA,UAAI,GAAA,CAAA,QAAA,CAAS,QAAQ,OAAO,CAAA;AAC5B,UAAO,OAAA,GAAA;AAAA;AACT;AACF,KACD,CAAA;AAAA;AAGH,EACE,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,OAAA,CAAQ,QAAQ,CAAA,CAAA,EAAI,aAAiB,IAAA,EAAE,CAAG,CAAA,CAAA,IAAA,EAC3D,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAe,CAAC,GAAG,CAAA;AAAA,MACnB,aAAA;AAAA,MACA,UAAY,EAAA;AAAA,QACV,EAAI,EAAA,CAAC,CAAW,KAAA,eAAA,CAAgB,CAAC,CAAA;AAAA,QACjC,EAAI,EAAA,CAAC,CAAW,KAAA,eAAA,CAAgB,CAAC,CAAA;AAAA,QACjC,EAAI,EAAA,CAAC,CAAW,KAAA,eAAA,CAAgB,CAAC,CAAA;AAAA,QACjC,EAAI,EAAA,CAAC,CAAW,KAAA,eAAA,CAAgB,CAAC,CAAA;AAAA,QACjC,EAAI,EAAA,CAAC,CAAW,KAAA,eAAA,CAAgB,CAAC,CAAA;AAAA,QACjC,EAAI,EAAA,CAAC,CAAW,KAAA,eAAA,CAAgB,CAAC,CAAA;AAAA,QACjC,CAAA,EAAG,CAAC,CAAW,KAAA;AACb,UAAM,MAAA,EAAE,UAAa,GAAA,CAAA;AACrB,UAAM,MAAA,GAAA,GAAM,QAAS,CAAA,OAAA,CAAQ,QAAQ,CAAA;AACrC,UAAA,MAAM,SAAY,GAAA,GAAA,CAAI,GAAI,CAAA,CAAC,KAAe,KAAA;AACxC,YAAI,IAAA,OAAO,UAAU,QAAU,EAAA;AAC7B,cAAO,OAAA,KAAA;AAAA;AAET,YAAM,MAAA,YAAA,GAAe,mBAAmB,KAAK,CAAA;AAC7C,YAAM,MAAA,WAAA,GAAc,gBAAgB,KAAK,CAAA;AACzC,YAAA,IAAI,YAAa,CAAA,MAAA,KAAW,CAAK,IAAA,WAAA,CAAY,WAAW,CAAG,EAAA;AACzD,cAAO,OAAA,KAAA;AAAA;AAGT,YAAA,OAAO,MAAM,KAAM,CAAA,GAAG,CAAE,CAAA,GAAA,CAAI,CAAC,IAAiB,KAAA;AAC5C,cAAA,MAAM,WAAc,GAAA,YAAA,CAAa,IAAK,CAAA,CAAA,CAAA,KAAK,SAAS,CAAC,CAAA;AACrD,cAAA,IAAI,WAAa,EAAA;AACf,gBAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,kCAAA,GAAA;AAAA,oBAAC,aAAA;AAAA,oBAAA;AAAA,sBACC,SAAA,EAAW,WAAY,CAAA,KAAA,CAAM,CAAC,CAAA;AAAA,sBAC9B,QAAQ,EAAA,IAAA;AAAA,sBACR,MAAA,EAAQ,gBAAgB,QAAW,GAAA,KAAA;AAAA;AAAA,mBACrC;AAAA,kBAAG;AAAA,iBACL,EAAA,CAAA;AAAA;AAIJ,cAAA,MAAM,UAAa,GAAA,WAAA,CAAY,IAAK,CAAA,CAAA,CAAA,KAAK,SAAS,CAAC,CAAA;AACnD,cAAA,IAAI,UAAY,EAAA;AACd,gBACE,uBAAA,GAAA;AAAA,kBAAC,OAAA;AAAA,kBAAA;AAAA,oBACC,GAAA,EAAK,UAAW,CAAA,KAAA,CAAM,CAAC,CAAA;AAAA,oBACvB,KAAA,EAAO,EAAE,YAAA,EAAc,CAAE,EAAA;AAAA,oBACzB,OAAS,EAAA;AAAA,mBAAA;AAAA,kBACJ;AAAA,iBACP;AAAA;AAIJ,cAAA,uBAAU,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,gBAAA,IAAA;AAAA,gBAAK;AAAA,eAAC,EAAA,CAAA;AAAA,aACjB,CAAA;AAAA,WACF,CAAA;AAED,UAAO,uBAAA,GAAA,CAAC,OAAG,QAAU,EAAA,SAAA,EAAA,CAAA;AAAA,SACvB;AAAA,QACA,KAAK,CAAQ,EAAA;AACX,UAAA,MAAM,EAAE,QAAU,EAAA,SAAA,EAAW,IAAM,EAAA,GAAG,MAAS,GAAA,CAAA;AAC/C,UAAA,MAAM,KAAQ,GAAA,gBAAA,CAAiB,IAAK,CAAA,SAAA,IAAa,EAAE,CAAA;AACnD,UAAA,MAAM,aAAa,MAAO,CAAA,QAAQ,CAAE,CAAA,OAAA,CAAQ,OAAO,EAAE,CAAA;AACrD,UAAA,OAAO,KACL,mBAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,QAAQ,kBACtB,EAAA,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,iBAAA;AAAA,cAAA;AAAA,gBACE,GAAG,IAAA;AAAA,gBACJ,MAAO,EAAA,KAAA;AAAA,gBACP,QAAA,EAAU,MAAM,CAAC,CAAA;AAAA,gBACjB,KAAA,EAAO,YAAY,QAAW,GAAA,SAAA;AAAA,gBAC9B,eAAe,EAAA,IAAA;AAAA,gBAEd,QAAA,EAAA;AAAA;AAAA,aACH;AAAA,4BACC,GAAA,CAAA,OAAA,EAAA,EAAQ,KAAO,EAAA,CAAA,CAAE,WAAW,CAC3B,EAAA,QAAA,kBAAA,GAAA;AAAA,cAAC,UAAA;AAAA,cAAA;AAAA,gBACC,YAAA,EAAY,EAAE,WAAW,CAAA;AAAA,gBACzB,IAAK,EAAA,OAAA;AAAA,gBACL,SAAU,EAAA,gBAAA;AAAA,gBACV,KAAO,EAAA;AAAA,kBACL,QAAU,EAAA,UAAA;AAAA,kBACV,GAAK,EAAA,CAAA;AAAA,kBACL,KAAO,EAAA,CAAA;AAAA,kBACP,MAAQ,EAAA;AAAA,iBACV;AAAA,gBACA,OAAA,EAAS,MAAM,mBAAA,CAAoB,UAAU,CAAA;AAAA,gBAE7C,QAAA,kBAAA,GAAA,CAAC,YAAa,EAAA,EAAA,QAAA,EAAS,OAAQ,EAAA;AAAA;AAAA,aAEnC,EAAA;AAAA,WAAA,EACF,oBAEC,GAAA,CAAA,MAAA,EAAA,EAAM,GAAG,IAAA,EAAM,WACb,QACH,EAAA,CAAA;AAAA;AAEJ,OACF;AAAA,MAEC,QAAA,EAAA;AAAA;AAAA,GAEL,EAAA,CAAA;AAEJ;;;;"}
|
|
1
|
+
{"version":3,"file":"MarkdownRenderer.esm.js","sources":["../../../src/components/MarkdownRenderer/MarkdownRenderer.tsx"],"sourcesContent":["import { Children, createElement, PropsWithChildren, useEffect } from 'react';\nimport SyntaxHighlighter from 'react-syntax-highlighter';\nimport { MarkdownHooks } from 'react-markdown';\nimport {\n a11yDark,\n a11yLight,\n} from 'react-syntax-highlighter/dist/esm/styles/hljs';\nimport { IconButton, makeStyles, Tooltip, Typography } from '@material-ui/core';\nimport {\n findEntityMentions,\n findTagMentions,\n} from '@drodil/backstage-plugin-qeta-common';\nimport gfm from 'remark-gfm';\nimport rehypeSlug from 'rehype-slug';\nimport rehypeToc, { HeadingNode, TextNode } from '@jsdevtools/rehype-toc';\nimport { EntityRefLink } from '@backstage/plugin-catalog-react';\nimport { useIsDarkTheme } from '../../hooks/useIsDarkTheme';\nimport { BackstageOverrides } from '@backstage/core-components';\nimport LinkIcon from '@material-ui/icons/Link';\nimport FileCopyIcon from '@material-ui/icons/FileCopy';\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { Variant } from '@material-ui/core/styles/createTypography';\nimport GithubSlugger from 'github-slugger';\nimport { HtmlElementNode } from '@jsdevtools/rehype-toc/lib/types';\nimport { find } from 'unist-util-find';\nimport { TagChip } from '../TagsAndEntities/TagChip';\nimport { useQetaExtensions } from '../ExtensionContext/ExtensionContext';\n\nconst slugger = new GithubSlugger();\n\nexport type QetaMarkdownContentClassKey =\n | 'markdown'\n | 'header'\n | 'tocHeader'\n | 'toc'\n | 'tocList'\n | 'tocListItem'\n | 'tocLink';\n\nconst useStyles = makeStyles(\n theme => {\n const overrides = theme.overrides as BackstageOverrides;\n return {\n markdown: {\n lineHeight: 1.75,\n '& p': {\n ...theme.typography?.body1,\n margin: '0 0 1em 0',\n wordBreak: 'break-word',\n },\n '& h1': {\n ...theme.typography?.h1,\n marginBottom: 2,\n marginTop: '1.5em',\n },\n '& h2': {\n ...theme.typography?.h2,\n marginBottom: 2,\n marginTop: '1.2em',\n },\n '& h3': {\n ...theme.typography?.h3,\n marginBottom: 2,\n marginTop: '1em',\n },\n '& h4': {\n ...theme.typography?.h4,\n marginBottom: 2,\n marginTop: '0.8em',\n },\n '& h5': {\n ...theme.typography?.h5,\n marginBottom: 2,\n marginTop: '0.7em',\n },\n '& h6': {\n ...theme.typography?.h6,\n marginBottom: 2,\n marginTop: '0.6em',\n },\n '& table': {\n borderCollapse: 'collapse',\n border: `1px solid ${theme.palette.border}`,\n },\n '& th, & td': {\n border: `1px solid ${theme.palette.border}`,\n padding: theme.spacing(1),\n },\n '& td': {\n wordBreak: 'break-word',\n overflow: 'hidden',\n verticalAlign: 'middle',\n lineHeight: '1',\n margin: 0,\n padding: theme.spacing(3, 2, 3, 2.5),\n borderBottom: 0,\n },\n '& th': {\n backgroundColor: theme.palette.background.paper,\n },\n '& tr': {\n backgroundColor: theme.palette.background.paper,\n },\n '& tr:nth-child(odd)': {\n backgroundColor: theme.palette.background.default,\n },\n '& a': {\n color: theme.palette.link,\n },\n '& img': {\n maxWidth: '100%',\n },\n '& code': {\n fontFamily: 'Courier New,Courier,monospace',\n fontStyle: 'normal',\n display: 'block',\n width: '100%',\n overflowX: 'auto',\n borderRadius: 4,\n padding: '0.2em 0.4em',\n },\n '& em': {\n fontStyle: 'italic !important',\n },\n '& ol': {\n listStyle: 'decimal',\n marginLeft: '2em',\n marginBottom: '1em',\n marginTop: '1em',\n },\n '& ul': {\n listStyle: 'disc',\n marginLeft: '2em',\n marginBottom: '1em',\n marginTop: '1em',\n },\n '& blockquote': {\n backgroundColor: theme.palette.background.paper,\n border: `1px solid ${theme.palette.divider}`,\n padding: '1em 1.5em',\n margin: '1.5em 0',\n color: theme.palette.text.secondary,\n borderLeft: `4px solid ${theme.palette.divider}`,\n },\n '& li': {\n marginTop: '0.5em',\n },\n '& *:first-child': {\n marginTop: 0,\n },\n '& *:last-child': {\n marginBottom: 0,\n },\n '& path': {\n stroke: `${theme.palette.text.primary} !important`,\n },\n ...(overrides?.BackstageMarkdownContent ?? {}),\n },\n codeBlockContainer: {\n position: 'relative',\n '& .copyCodeButton': {\n opacity: 0,\n pointerEvents: 'none',\n transition: 'opacity 0.2s',\n },\n '&:hover .copyCodeButton': {\n opacity: 1,\n pointerEvents: 'auto',\n },\n },\n header: {\n '& .anchor-link': {\n display: 'none',\n marginLeft: '0.5em',\n },\n '&:hover .anchor-link': {\n display: 'inline-block',\n },\n },\n tocHeader: {\n marginTop: '0.5em',\n marginBottom: 0,\n },\n toc: {\n marginTop: '0.5em',\n marginLeft: '0.2em',\n paddingBottom: '1em',\n borderBottom: `1px solid ${theme.palette.divider}`,\n },\n tocList: {\n marginLeft: '0 !important',\n marginTop: '0.5em !important',\n paddingInlineStart: '1em',\n counterReset: 'item',\n },\n tocListItem: {\n display: 'block',\n '&:before': {\n content: 'counters(item, \".\") \" \"',\n counterIncrement: 'item',\n },\n },\n tocLink: {\n color: theme.palette.link,\n },\n };\n },\n { name: 'QetaMarkdownContent' },\n);\n\nconst flatten = (text: string, child: any): string => {\n if (!child) return text;\n\n return typeof child === 'string'\n ? text + child\n : Children.toArray(child.props.children).reduce(flatten, text);\n};\n\nexport const MarkdownRenderer = (props: {\n content: string;\n className?: string;\n showToc?: boolean;\n useBlankLinks?: boolean;\n}) => {\n const { content, className: mainClassName, showToc, useBlankLinks } = props;\n const darkTheme = useIsDarkTheme();\n const { t } = useTranslationRef(qetaTranslationRef);\n const classes = useStyles();\n const alertApi = useApi(alertApiRef);\n slugger.reset();\n\n const copyToClipboard = (slug: string) => {\n const url = new URL(window.location.href);\n url.hash = `#${slug}`;\n window.navigator.clipboard.writeText(url.toString());\n alertApi.post({\n message: t('link.copied'),\n severity: 'info',\n display: 'transient',\n });\n };\n\n const copyCodeToClipboard = (code: string) => {\n window.navigator.clipboard.writeText(code);\n alertApi.post({\n message: t('code.copied'),\n severity: 'info',\n display: 'transient',\n });\n };\n\n const headingRenderer = (\n hProps: PropsWithChildren<{ node: { tagName: string } }>,\n ) => {\n const { node, children } = hProps;\n const childrenArray = Children.toArray(children);\n const text = childrenArray.reduce(flatten, '');\n const slug = slugger.slug(text);\n const link = (\n <Tooltip title={t('link.aria')}>\n <IconButton\n aria-label={t('link.aria')}\n onClick={() => copyToClipboard(slug)}\n size=\"small\"\n className=\"anchor-link\"\n >\n <LinkIcon />\n </IconButton>\n </Tooltip>\n );\n return (\n <>\n {createElement(\n Typography,\n {\n variant: node.tagName as Variant,\n id: slug,\n className: classes.header,\n },\n [children, link],\n )}\n </>\n );\n };\n\n useEffect(() => {\n if (!window.location.hash) {\n return;\n }\n\n const id = window.location.hash.slice(1);\n const element = document.getElementById(id);\n if (element) {\n element.scrollIntoView({ behavior: 'auto', block: 'start' });\n }\n }, []);\n\n const extensions = useQetaExtensions();\n\n const rehypePlugins: import('unified').PluggableList = [[rehypeSlug]];\n if (showToc) {\n rehypePlugins.push([\n rehypeToc,\n {\n cssClasses: {\n toc: classes.toc,\n list: classes.tocList,\n listItem: classes.tocListItem,\n link: classes.tocLink,\n },\n customizeTOC: (toc: HtmlElementNode) => {\n const listItems = find(toc, { tagName: 'li' });\n if (!toc.children || !listItems) {\n return false;\n }\n const tocHeader: TextNode = {\n type: 'text',\n value: t('markdown.toc'),\n };\n const heading: HeadingNode = {\n type: 'element',\n tagName: 'h3',\n properties: {},\n children: [tocHeader],\n };\n\n toc.children.unshift(heading);\n return toc;\n },\n },\n ]);\n }\n\n return (\n <div className={`${classes.markdown} ${mainClassName ?? ''}`.trim()}>\n <MarkdownHooks\n remarkPlugins={[gfm, ...(extensions.remarkPlugins ?? [])]}\n rehypePlugins={[...rehypePlugins, ...(extensions.rehypePlugins ?? [])]}\n components={{\n h1: (p: any) => headingRenderer(p),\n h2: (p: any) => headingRenderer(p),\n h3: (p: any) => headingRenderer(p),\n h4: (p: any) => headingRenderer(p),\n h5: (p: any) => headingRenderer(p),\n h6: (p: any) => headingRenderer(p),\n p: (p: any) => {\n const { children } = p;\n const arr = Children.toArray(children);\n const formatted = arr.map((child: any) => {\n if (typeof child !== 'string') {\n return child;\n }\n const userMentions = findEntityMentions(child);\n const tagMentions = findTagMentions(child);\n if (userMentions.length === 0 && tagMentions.length === 0) {\n return child;\n }\n\n return child.split(' ').map((word: string) => {\n const userMention = userMentions.find(m => word === m);\n if (userMention) {\n return (\n <>\n <EntityRefLink\n entityRef={userMention.slice(1)}\n hideIcon\n target={useBlankLinks ? '_blank' : undefined}\n />{' '}\n </>\n );\n }\n\n const tagMention = tagMentions.find(m => word === m);\n if (tagMention) {\n return (\n <TagChip\n tag={tagMention.slice(1)}\n style={{ marginBottom: 0 }}\n useHref={useBlankLinks}\n key={tagMention}\n />\n );\n }\n\n return <>{word} </>;\n });\n });\n\n return <p>{formatted}</p>;\n },\n code(p: any) {\n const { children, className, node, ...rest } = p;\n const match = /language-(\\w+)/.exec(className || '');\n const codeString = String(children).replace(/\\n$/, '');\n return match ? (\n <div className={classes.codeBlockContainer}>\n <SyntaxHighlighter\n {...rest}\n PreTag=\"div\"\n language={match[1]}\n style={darkTheme ? a11yDark : a11yLight}\n showLineNumbers\n >\n {codeString}\n </SyntaxHighlighter>\n <Tooltip title={t('code.aria')}>\n <IconButton\n aria-label={t('code.aria')}\n size=\"small\"\n className=\"copyCodeButton\"\n style={{\n position: 'absolute',\n top: 8,\n right: 8,\n zIndex: 2,\n }}\n onClick={() => copyCodeToClipboard(codeString)}\n >\n <FileCopyIcon fontSize=\"small\" />\n </IconButton>\n </Tooltip>\n </div>\n ) : (\n <code {...rest} className={className}>\n {children}\n </code>\n );\n },\n }}\n >\n {content}\n </MarkdownHooks>\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx,
|
|
1
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { Autocomplete } from '@material-ui/lab';
|
|
3
3
|
import { getEntityTitle } from '../../utils/utils.esm.js';
|
|
4
4
|
import { stringifyEntityRef } from '@backstage/catalog-model';
|
|
@@ -18,6 +18,8 @@ const EntitiesInput = (props) => {
|
|
|
18
18
|
value,
|
|
19
19
|
singleValue,
|
|
20
20
|
onChange,
|
|
21
|
+
multiple = true,
|
|
22
|
+
required = false,
|
|
21
23
|
useOnlyUsedEntities = false,
|
|
22
24
|
hideHelpText = false,
|
|
23
25
|
style,
|
|
@@ -102,23 +104,28 @@ const EntitiesInput = (props) => {
|
|
|
102
104
|
useOnlyUsedEntities,
|
|
103
105
|
qetaApi
|
|
104
106
|
]);
|
|
107
|
+
const usedValue = useMemo(() => {
|
|
108
|
+
if (!value) {
|
|
109
|
+
return multiple ? [] : null;
|
|
110
|
+
}
|
|
111
|
+
return value;
|
|
112
|
+
}, [value, multiple]);
|
|
105
113
|
if (!availableEntities) {
|
|
106
114
|
return null;
|
|
107
115
|
}
|
|
108
116
|
return /* @__PURE__ */ jsx(
|
|
109
117
|
Autocomplete,
|
|
110
118
|
{
|
|
111
|
-
multiple
|
|
119
|
+
multiple,
|
|
112
120
|
autoHighlight: true,
|
|
113
121
|
autoComplete: true,
|
|
114
122
|
className: "qetaEntitiesInput",
|
|
115
|
-
value,
|
|
123
|
+
value: usedValue,
|
|
116
124
|
disabled,
|
|
117
125
|
loading,
|
|
118
126
|
loadingText: t("common.loading"),
|
|
119
127
|
groupBy: entityKinds.length > 1 ? (option) => option.kind : void 0,
|
|
120
128
|
renderGroup,
|
|
121
|
-
id: "entities-select",
|
|
122
129
|
handleHomeEndKeys: true,
|
|
123
130
|
options: availableEntities,
|
|
124
131
|
getOptionLabel: getEntityTitle,
|
|
@@ -127,29 +134,37 @@ const EntitiesInput = (props) => {
|
|
|
127
134
|
style,
|
|
128
135
|
getOptionSelected: (o, v) => stringifyEntityRef(o) === stringifyEntityRef(v),
|
|
129
136
|
onChange: (_e, newValue) => {
|
|
130
|
-
if (
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
+
if (multiple) {
|
|
138
|
+
if (!newValue) {
|
|
139
|
+
onChange([]);
|
|
140
|
+
return;
|
|
141
|
+
}
|
|
142
|
+
const val = Array.isArray(newValue) ? newValue : [newValue];
|
|
143
|
+
if (max === null || val.length <= max) {
|
|
144
|
+
onChange(val.filter((v) => typeof v !== "string"));
|
|
145
|
+
}
|
|
146
|
+
} else {
|
|
147
|
+
if (!newValue) {
|
|
148
|
+
return;
|
|
149
|
+
}
|
|
150
|
+
onChange(newValue);
|
|
137
151
|
}
|
|
138
152
|
},
|
|
139
153
|
renderOption: (option) => {
|
|
140
|
-
|
|
154
|
+
const stringified = stringifyEntityRef(option);
|
|
155
|
+
return /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(
|
|
141
156
|
Tooltip,
|
|
142
157
|
{
|
|
143
158
|
arrow: true,
|
|
144
159
|
placement: "right",
|
|
145
160
|
title: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
146
161
|
/* @__PURE__ */ jsx(Typography, { children: getEntityTitle(option) }),
|
|
147
|
-
/* @__PURE__ */ jsx(Typography, { variant: "caption", children:
|
|
162
|
+
/* @__PURE__ */ jsx(Typography, { variant: "caption", children: stringified }),
|
|
148
163
|
/* @__PURE__ */ jsx(Typography, { variant: "caption", children: option.metadata.description })
|
|
149
164
|
] }),
|
|
150
165
|
children: /* @__PURE__ */ jsx("span", { children: getEntityTitle(option, { withType: false }) })
|
|
151
166
|
}
|
|
152
|
-
) });
|
|
167
|
+
) }, stringified);
|
|
153
168
|
},
|
|
154
169
|
renderInput: (params) => {
|
|
155
170
|
let helperText = "";
|
|
@@ -166,6 +181,7 @@ const EntitiesInput = (props) => {
|
|
|
166
181
|
...params,
|
|
167
182
|
variant: "outlined",
|
|
168
183
|
margin: "normal",
|
|
184
|
+
required,
|
|
169
185
|
label: label || t("entitiesInput.label"),
|
|
170
186
|
placeholder: placeholder || t("entitiesInput.placeholder"),
|
|
171
187
|
helperText,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EntitiesInput.esm.js","sources":["../../../src/components/PostForm/EntitiesInput.tsx"],"sourcesContent":["import { Autocomplete } from '@material-ui/lab';\nimport { getEntityTitle } from '../../utils/utils';\nimport { Entity, stringifyEntityRef } from '@backstage/catalog-model';\nimport {\n CircularProgress,\n TextField,\n Tooltip,\n Typography,\n} from '@material-ui/core';\nimport {\n ComponentType,\n CSSProperties,\n HTMLAttributes,\n useEffect,\n useMemo,\n useState,\n} from 'react';\nimport { configApiRef, useApi } from '@backstage/core-plugin-api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { qetaApiRef } from '../../api';\nimport { compact } from 'lodash';\nimport {\n AutocompleteListboxComponent,\n renderGroup,\n} from './AutocompleteListComponent';\nimport { AutocompleteProps } from '@material-ui/lab/Autocomplete/Autocomplete';\nimport { FieldError } from 'react-hook-form';\nimport { getSupportedEntityKinds } from '@drodil/backstage-plugin-qeta-common';\n\nexport const EntitiesInput = (props: {\n value?: Entity[];\n singleValue?: string;\n onChange: (value: Entity[]) => void;\n useOnlyUsedEntities?: boolean;\n hideHelpText?: boolean;\n style?: CSSProperties;\n disabled?: boolean;\n kind?: string[];\n maximum?: number | null;\n error?: FieldError;\n label?: string;\n name?: string;\n placeholder?: string;\n autocompleteProps?: AutocompleteProps<any, any, any, any>;\n}) => {\n const {\n value,\n singleValue,\n onChange,\n useOnlyUsedEntities = false,\n hideHelpText = false,\n style,\n disabled,\n kind,\n error,\n maximum,\n label,\n name = 'entities',\n placeholder,\n autocompleteProps,\n } = props;\n\n const configApi = useApi(configApiRef);\n const catalogApi = useApi(catalogApiRef);\n const qetaApi = useApi(qetaApiRef);\n const [availableEntities, setAvailableEntities] = useState<Entity[] | null>(\n [],\n );\n const [loading, setLoading] = useState(true);\n const { t } = useTranslationRef(qetaTranslationRef);\n\n const entityKinds: string[] = useMemo(() => {\n if (kind) {\n return kind;\n }\n return getSupportedEntityKinds(configApi);\n }, [configApi, kind]);\n const max = useMemo(() => {\n if (maximum) {\n return maximum;\n }\n return configApi.getOptionalNumber('qeta.entities.max') ?? 3;\n }, [configApi, maximum]);\n\n useEffect(() => {\n if (singleValue) {\n catalogApi.getEntityByRef(singleValue).then(data => {\n setLoading(false);\n if (data) {\n setAvailableEntities([data]);\n }\n });\n }\n }, [catalogApi, singleValue]);\n\n useEffect(() => {\n if (singleValue) {\n return;\n }\n\n if (useOnlyUsedEntities) {\n qetaApi.getEntities().then(data => {\n const refs = data.entities.map(r => r.entityRef);\n catalogApi\n .getEntitiesByRefs({ entityRefs: refs })\n .catch(_ => setAvailableEntities(null))\n .then(catalogData => {\n setLoading(false);\n setAvailableEntities(\n catalogData ? compact(catalogData.items) : null,\n );\n });\n });\n return;\n }\n\n if (entityKinds && entityKinds.length > 0) {\n catalogApi\n .getEntities({\n order: { field: 'kind', order: 'asc' },\n filter: { kind: entityKinds },\n fields: [\n 'kind',\n 'metadata.name',\n 'metadata.namespace',\n 'metadata.title',\n 'metadata.description',\n 'spec.type',\n 'spec.profile.displayName',\n ],\n })\n .catch(_ => setAvailableEntities(null))\n .then(data => {\n setLoading(false);\n setAvailableEntities(data ? data.items : null);\n });\n }\n }, [\n catalogApi,\n singleValue,\n configApi,\n entityKinds,\n useOnlyUsedEntities,\n qetaApi,\n ]);\n\n if (!availableEntities) {\n return null;\n }\n\n return (\n <Autocomplete\n multiple\n autoHighlight\n autoComplete\n className=\"qetaEntitiesInput\"\n value={value}\n disabled={disabled}\n loading={loading}\n loadingText={t('common.loading')}\n groupBy={entityKinds.length > 1 ? option => option.kind : undefined}\n renderGroup={renderGroup}\n id=\"entities-select\"\n handleHomeEndKeys\n options={availableEntities}\n getOptionLabel={getEntityTitle}\n ListboxComponent={\n AutocompleteListboxComponent as ComponentType<\n HTMLAttributes<HTMLElement>\n >\n }\n disableListWrap\n style={style}\n getOptionSelected={(o, v) =>\n stringifyEntityRef(o) === stringifyEntityRef(v)\n }\n onChange={(_e, newValue) => {\n if (!newValue) {\n onChange([]);\n return;\n }\n const val = Array.isArray(newValue) ? newValue : [newValue];\n if (max === null || val.length <= max) {\n onChange(val as Entity[]);\n }\n }}\n renderOption={option => {\n return (\n <>\n <Tooltip\n arrow\n placement=\"right\"\n title={\n <>\n <Typography>{getEntityTitle(option)}</Typography>\n <Typography variant=\"caption\">\n {stringifyEntityRef(option)}\n </Typography>\n <Typography variant=\"caption\">\n {option.metadata.description}\n </Typography>\n </>\n }\n >\n <span>{getEntityTitle(option, { withType: false })}</span>\n </Tooltip>\n </>\n );\n }}\n renderInput={params => {\n let helperText = '';\n if (!hideHelpText) {\n if (error && error.message) {\n helperText = error.message;\n } else {\n helperText = t('entitiesInput.helperText', { max: max.toString() });\n }\n }\n\n return (\n <TextField\n {...params}\n variant=\"outlined\"\n margin=\"normal\"\n label={label || t('entitiesInput.label')}\n placeholder={placeholder || t('entitiesInput.placeholder')}\n helperText={helperText}\n name={name}\n FormHelperTextProps={{\n style: { marginLeft: '0.2em' },\n }}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <>\n {loading ? (\n <CircularProgress color=\"inherit\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </>\n ),\n }}\n error={error !== undefined}\n />\n );\n }}\n {...autocompleteProps}\n />\n );\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"EntitiesInput.esm.js","sources":["../../../src/components/PostForm/EntitiesInput.tsx"],"sourcesContent":["import { Autocomplete } from '@material-ui/lab';\nimport { getEntityTitle } from '../../utils/utils';\nimport { Entity, stringifyEntityRef } from '@backstage/catalog-model';\nimport {\n CircularProgress,\n TextField,\n Tooltip,\n Typography,\n} from '@material-ui/core';\nimport {\n ComponentType,\n CSSProperties,\n HTMLAttributes,\n useEffect,\n useMemo,\n useState,\n} from 'react';\nimport { configApiRef, useApi } from '@backstage/core-plugin-api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { qetaTranslationRef } from '../../translation.ts';\nimport { qetaApiRef } from '../../api';\nimport { compact } from 'lodash';\nimport {\n AutocompleteListboxComponent,\n renderGroup,\n} from './AutocompleteListComponent';\nimport { AutocompleteProps } from '@material-ui/lab/Autocomplete/Autocomplete';\nimport { FieldError } from 'react-hook-form';\nimport { getSupportedEntityKinds } from '@drodil/backstage-plugin-qeta-common';\n\ntype CommonEntitiesInputProps = {\n singleValue?: string;\n required?: boolean;\n useOnlyUsedEntities?: boolean;\n hideHelpText?: boolean;\n style?: CSSProperties;\n disabled?: boolean;\n kind?: string[];\n maximum?: number | null;\n error?: FieldError;\n label?: string;\n name?: string;\n placeholder?: string;\n autocompleteProps?: AutocompleteProps<any, any, any, any>;\n onChange: (value: any) => void;\n};\ntype SingleEntitiesInputValue = CommonEntitiesInputProps & {\n multiple: false;\n value?: Entity | null;\n onChange: (value: Entity) => void;\n};\n\ntype MultipleEntitiesInputValue = CommonEntitiesInputProps & {\n multiple?: true;\n value?: Entity[];\n onChange: (value: Entity[]) => void;\n};\n\nexport type EntitiesInputProps =\n | SingleEntitiesInputValue\n | MultipleEntitiesInputValue;\n\nexport const EntitiesInput = (props: EntitiesInputProps) => {\n const {\n value,\n singleValue,\n onChange,\n multiple = true,\n required = false,\n useOnlyUsedEntities = false,\n hideHelpText = false,\n style,\n disabled,\n kind,\n error,\n maximum,\n label,\n name = 'entities',\n placeholder,\n autocompleteProps,\n } = props;\n\n const configApi = useApi(configApiRef);\n const catalogApi = useApi(catalogApiRef);\n const qetaApi = useApi(qetaApiRef);\n const [availableEntities, setAvailableEntities] = useState<Entity[] | null>(\n [],\n );\n const [loading, setLoading] = useState(true);\n const { t } = useTranslationRef(qetaTranslationRef);\n\n const entityKinds: string[] = useMemo(() => {\n if (kind) {\n return kind;\n }\n return getSupportedEntityKinds(configApi);\n }, [configApi, kind]);\n const max = useMemo(() => {\n if (maximum) {\n return maximum;\n }\n return configApi.getOptionalNumber('qeta.entities.max') ?? 3;\n }, [configApi, maximum]);\n\n useEffect(() => {\n if (singleValue) {\n catalogApi.getEntityByRef(singleValue).then(data => {\n setLoading(false);\n if (data) {\n setAvailableEntities([data]);\n }\n });\n }\n }, [catalogApi, singleValue]);\n\n useEffect(() => {\n if (singleValue) {\n return;\n }\n\n if (useOnlyUsedEntities) {\n qetaApi.getEntities().then(data => {\n const refs = data.entities.map(r => r.entityRef);\n catalogApi\n .getEntitiesByRefs({ entityRefs: refs })\n .catch(_ => setAvailableEntities(null))\n .then(catalogData => {\n setLoading(false);\n setAvailableEntities(\n catalogData ? compact(catalogData.items) : null,\n );\n });\n });\n return;\n }\n\n if (entityKinds && entityKinds.length > 0) {\n catalogApi\n .getEntities({\n order: { field: 'kind', order: 'asc' },\n filter: { kind: entityKinds },\n fields: [\n 'kind',\n 'metadata.name',\n 'metadata.namespace',\n 'metadata.title',\n 'metadata.description',\n 'spec.type',\n 'spec.profile.displayName',\n ],\n })\n .catch(_ => setAvailableEntities(null))\n .then(data => {\n setLoading(false);\n setAvailableEntities(data ? data.items : null);\n });\n }\n }, [\n catalogApi,\n singleValue,\n configApi,\n entityKinds,\n useOnlyUsedEntities,\n qetaApi,\n ]);\n\n const usedValue = useMemo(() => {\n if (!value) {\n return multiple ? [] : null;\n }\n return value;\n }, [value, multiple]);\n\n if (!availableEntities) {\n return null;\n }\n\n return (\n <Autocomplete\n multiple={multiple}\n autoHighlight\n autoComplete\n className=\"qetaEntitiesInput\"\n value={usedValue}\n disabled={disabled}\n loading={loading}\n loadingText={t('common.loading')}\n groupBy={entityKinds.length > 1 ? option => option.kind : undefined}\n renderGroup={renderGroup}\n handleHomeEndKeys\n options={availableEntities}\n getOptionLabel={getEntityTitle}\n ListboxComponent={\n AutocompleteListboxComponent as ComponentType<\n HTMLAttributes<HTMLElement>\n >\n }\n disableListWrap\n style={style}\n getOptionSelected={(o, v) =>\n stringifyEntityRef(o) === stringifyEntityRef(v)\n }\n onChange={(_e, newValue) => {\n if (multiple) {\n if (!newValue) {\n onChange([]);\n return;\n }\n const val = Array.isArray(newValue) ? newValue : [newValue];\n if (max === null || val.length <= max) {\n onChange(val.filter(v => typeof v !== 'string'));\n }\n } else {\n if (!newValue) {\n return;\n }\n onChange(newValue as Entity);\n }\n }}\n renderOption={(option: Entity) => {\n const stringified = stringifyEntityRef(option);\n return (\n <span key={stringified}>\n <Tooltip\n arrow\n placement=\"right\"\n title={\n <>\n <Typography>{getEntityTitle(option)}</Typography>\n <Typography variant=\"caption\">{stringified}</Typography>\n <Typography variant=\"caption\">\n {option.metadata.description}\n </Typography>\n </>\n }\n >\n <span>{getEntityTitle(option, { withType: false })}</span>\n </Tooltip>\n </span>\n );\n }}\n renderInput={params => {\n let helperText = '';\n if (!hideHelpText) {\n if (error && error.message) {\n helperText = error.message;\n } else {\n helperText = t('entitiesInput.helperText', { max: max.toString() });\n }\n }\n\n return (\n <TextField\n {...params}\n variant=\"outlined\"\n margin=\"normal\"\n required={required}\n label={label || t('entitiesInput.label')}\n placeholder={placeholder || t('entitiesInput.placeholder')}\n helperText={helperText}\n name={name}\n FormHelperTextProps={{\n style: { marginLeft: '0.2em' },\n }}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <>\n {loading ? (\n <CircularProgress color=\"inherit\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </>\n ),\n }}\n error={error !== undefined}\n />\n );\n }}\n {...autocompleteProps}\n />\n );\n};\n"],"names":[],"mappings":"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"}
|