mirror of
https://github.com/scm-manager/scm-manager.git
synced 2026-01-16 20:42:14 +01:00
refactor
This commit is contained in:
@@ -92,7 +92,7 @@
|
||||
"remark-rehype": "^8.0.0",
|
||||
"tabbable": "^5.2.1",
|
||||
"unified": "^9.2.1",
|
||||
"mermaid": "^9.1.4"
|
||||
"mermaid": "^8.14.0"
|
||||
},
|
||||
"babel": {
|
||||
"presets": [
|
||||
|
||||
@@ -23,32 +23,40 @@
|
||||
*/
|
||||
|
||||
import { extensionPoints } from "@scm-manager/ui-extensions";
|
||||
import React, { FC, useEffect, useRef, useState } from "react";
|
||||
import React, { FC, useEffect, useMemo, useRef, useState } from "react";
|
||||
import mermaid from "mermaid";
|
||||
import ErrorNotification from "../ErrorNotification";
|
||||
import Loading from "../Loading";
|
||||
|
||||
const MermaidCodeRenderer: FC<extensionPoints.MarkdownCodeRenderer["props"]> = ({ value }) => {
|
||||
const [content, setContent] = useState<string>();
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
const [content, setContent] = useState<string>("Loading...");
|
||||
const [error, setError] = useState<Error>();
|
||||
const id = useRef(`MERMAID-${Date.now()}`);
|
||||
const dangerousHtmlObject = useMemo(() => ({ __html: content }), [content]);
|
||||
|
||||
useEffect(() => {
|
||||
try {
|
||||
mermaid.render("MERMAID", value, (svgCode, bindFunctions) => {
|
||||
setError(undefined);
|
||||
setContent("");
|
||||
mermaid.render(id.current, value, (svgCode) => {
|
||||
setContent(svgCode);
|
||||
if (ref.current) {
|
||||
bindFunctions(ref.current);
|
||||
}
|
||||
});
|
||||
} catch (e) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.error(e);
|
||||
// @ts-ignore mermaid error
|
||||
setContent(e.str);
|
||||
if (e instanceof Error) {
|
||||
setError(e);
|
||||
} else {
|
||||
// @ts-ignore Unknown mermaid error
|
||||
setError(new Error(e.str));
|
||||
}
|
||||
}
|
||||
}, [value]);
|
||||
|
||||
if (error) {
|
||||
return <ErrorNotification error={error} />;
|
||||
}
|
||||
|
||||
if (content) {
|
||||
return <div ref={ref} className="mermaid" dangerouslySetInnerHTML={{ __html: content }} />;
|
||||
return <figure className="mermaid" dangerouslySetInnerHTML={dangerousHtmlObject} />;
|
||||
}
|
||||
|
||||
return <Loading />;
|
||||
|
||||
38
yarn.lock
38
yarn.lock
@@ -1207,10 +1207,10 @@
|
||||
resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39"
|
||||
integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==
|
||||
|
||||
"@braintree/sanitize-url@^6.0.0":
|
||||
version "6.0.0"
|
||||
resolved "https://registry.yarnpkg.com/@braintree/sanitize-url/-/sanitize-url-6.0.0.tgz#fe364f025ba74f6de6c837a84ef44bdb1d61e68f"
|
||||
integrity sha512-mgmE7XBYY/21erpzhexk4Cj1cyTQ9LzvnTxtzM17BJ7ERMNE6W72mQRo0I1Ud8eFJ+RVVIcBNhLFZ3GX4XFz5w==
|
||||
"@braintree/sanitize-url@^3.1.0":
|
||||
version "3.1.0"
|
||||
resolved "https://registry.yarnpkg.com/@braintree/sanitize-url/-/sanitize-url-3.1.0.tgz#8ff71d51053cd5ee4981e5a501d80a536244f7fd"
|
||||
integrity sha512-GcIY79elgB+azP74j8vqkiXz8xLFfIzbQJdlwOPisgbKT00tviJQuEghOXSMVxJ00HoYJbGswr4kcllUc4xCcg==
|
||||
|
||||
"@chromaui/localtunnel@^2.0.3":
|
||||
version "2.0.4"
|
||||
@@ -8368,10 +8368,10 @@ domhandler@^5.0.1, domhandler@^5.0.2, domhandler@^5.0.3:
|
||||
dependencies:
|
||||
domelementtype "^2.3.0"
|
||||
|
||||
dompurify@2.3.10:
|
||||
version "2.3.10"
|
||||
resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-2.3.10.tgz#901f7390ffe16a91a5a556b94043314cd4850385"
|
||||
integrity sha512-o7Fg/AgC7p/XpKjf/+RC3Ok6k4St5F7Q6q6+Nnm3p2zGWioAY6dh0CbbuwOhH2UcSzKsdniE/YnE2/92JcsA+g==
|
||||
dompurify@2.3.5:
|
||||
version "2.3.5"
|
||||
resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-2.3.5.tgz#c83ed5a3ae5ce23e52efe654ea052ffb358dd7e3"
|
||||
integrity sha512-kD+f8qEaa42+mjdOpKeztu9Mfx5bv9gVLO6K9jRx4uGvh6Wv06Srn4jr1wPNY2OOUGGSKHNFN+A8MA3v0E0QAQ==
|
||||
|
||||
domutils@^2.5.2, domutils@^2.8.0:
|
||||
version "2.8.0"
|
||||
@@ -12818,10 +12818,10 @@ keygrip@~1.1.0:
|
||||
dependencies:
|
||||
tsscmp "1.0.6"
|
||||
|
||||
khroma@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/khroma/-/khroma-2.0.0.tgz#7577de98aed9f36c7a474c4d453d94c0d6c6588b"
|
||||
integrity sha512-2J8rDNlQWbtiNYThZRvmMv5yt44ZakX+Tz5ZIp/mN1pt4snn+m030Va5Z4v8xA0cQFDXBwO/8i42xL4QPsVk3g==
|
||||
khroma@^1.4.1:
|
||||
version "1.4.1"
|
||||
resolved "https://registry.yarnpkg.com/khroma/-/khroma-1.4.1.tgz#ad6a5b6a972befc5112ce5129887a1a83af2c003"
|
||||
integrity sha512-+GmxKvmiRuCcUYDgR7g5Ngo0JEDeOsGdNONdU2zsiBQaK4z19Y2NvXqfEDE0ZiIrg45GTZyAnPLVsLZZACYm3Q==
|
||||
|
||||
kind-of@^3.0.2, kind-of@^3.0.3, kind-of@^3.2.0:
|
||||
version "3.2.2"
|
||||
@@ -13745,18 +13745,18 @@ merge2@^1.2.3, merge2@^1.3.0, merge2@^1.4.1:
|
||||
resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
|
||||
integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==
|
||||
|
||||
mermaid@^9.1.4:
|
||||
version "9.1.4"
|
||||
resolved "https://registry.yarnpkg.com/mermaid/-/mermaid-9.1.4.tgz#05113b14dabe6b2ce5abd7452d10d4309cc0467f"
|
||||
integrity sha512-QgQTpIIzJfV/Ob7FZTDzxmWjFzCciij4C8RbbQbamsadf2gHrNrfqAoWLF6ALfQlW5ZqOefvlogDdWcFZRnifg==
|
||||
mermaid@^8.14.0:
|
||||
version "8.14.0"
|
||||
resolved "https://registry.yarnpkg.com/mermaid/-/mermaid-8.14.0.tgz#ef589b0537f56d6340069070edb51719a4faba00"
|
||||
integrity sha512-ITSHjwVaby1Li738sxhF48sLTxcNyUAoWfoqyztL1f7J6JOLpHOuQPNLBb6lxGPUA0u7xP9IRULgvod0dKu35A==
|
||||
dependencies:
|
||||
"@braintree/sanitize-url" "^6.0.0"
|
||||
"@braintree/sanitize-url" "^3.1.0"
|
||||
d3 "^7.0.0"
|
||||
dagre "^0.8.5"
|
||||
dagre-d3 "^0.6.4"
|
||||
dompurify "2.3.10"
|
||||
dompurify "2.3.5"
|
||||
graphlib "^2.1.8"
|
||||
khroma "^2.0.0"
|
||||
khroma "^1.4.1"
|
||||
moment-mini "^2.24.0"
|
||||
stylis "^4.0.10"
|
||||
|
||||
|
||||
Reference in New Issue
Block a user