mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-18 17:25:16 -04:00
fix(async-loading): show async loaded components only if value is present
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
parent
26c1f1bcaa
commit
caf212045a
11 changed files with 13 additions and 16 deletions
|
@ -49,7 +49,7 @@ export const AbcFrame: React.FC<CodeProps> = ({ code }) => {
|
|||
}, [code, abcLib])
|
||||
|
||||
return (
|
||||
<AsyncLoadingBoundary loading={loading} error={!!loadingError} componentName={'abc.js'}>
|
||||
<AsyncLoadingBoundary loading={loading || !abcLib} error={!!loadingError} componentName={'abc.js'}>
|
||||
<ShowIf condition={!!renderError}>
|
||||
<Alert variant={'danger'}>
|
||||
<Trans i18nKey={'editor.embeddings.abcJs.errorWhileRendering'} />
|
||||
|
|
|
@ -70,7 +70,7 @@ export const FlowChart: React.FC<CodeProps> = ({ code }) => {
|
|||
}, [code, darkModeActivated, flowchartLib])
|
||||
|
||||
return (
|
||||
<AsyncLoadingBoundary loading={loading} componentName={'flowchart.js'} error={!!libLoadingError}>
|
||||
<AsyncLoadingBoundary loading={loading || !flowchartLib} componentName={'flowchart.js'} error={!!libLoadingError}>
|
||||
<ShowIf condition={syntaxError}>
|
||||
<Alert variant={'danger'}>
|
||||
<Trans i18nKey={'renderer.flowchart.invalidSyntax'} />
|
||||
|
|
|
@ -61,7 +61,7 @@ export const GraphvizFrame: React.FC<CodeProps> = ({ code }) => {
|
|||
}, [code, basePath, showError, graphvizImport])
|
||||
|
||||
return (
|
||||
<AsyncLoadingBoundary loading={isLibLoading} componentName={'graphviz'} error={libLoadingError}>
|
||||
<AsyncLoadingBoundary loading={isLibLoading || !graphvizImport} componentName={'graphviz'} error={libLoadingError}>
|
||||
<ShowIf condition={!!error}>
|
||||
<Alert variant={'warning'}>{error}</Alert>
|
||||
</ShowIf>
|
||||
|
|
|
@ -36,7 +36,7 @@ export const HighlightedCode: React.FC<HighlightedCodeProps> = ({ code, language
|
|||
const wrappedDomLines = useAttachLineNumbers(codeDom, startLineNumber)
|
||||
|
||||
return (
|
||||
<AsyncLoadingBoundary loading={loading} error={!!error} componentName={'highlight.js'}>
|
||||
<AsyncLoadingBoundary loading={loading || !hljsApi} error={!!error} componentName={'highlight.js'}>
|
||||
<div className={styles['code-highlighter']} {...cypressId('highlighted-code-block')}>
|
||||
<code
|
||||
{...testId('code-highlighter')}
|
||||
|
|
|
@ -58,7 +58,7 @@ export const VegaLiteChart: React.FC<CodeProps> = ({ code }) => {
|
|||
}, [renderingError])
|
||||
|
||||
return (
|
||||
<AsyncLoadingBoundary loading={libLoading} error={libLoadingError} componentName={'Vega Lite'}>
|
||||
<AsyncLoadingBoundary loading={libLoading || !vegaEmbed} error={libLoadingError} componentName={'Vega Lite'}>
|
||||
<ShowIf condition={!!renderingError}>
|
||||
<Alert variant={'danger'}>
|
||||
<Trans i18nKey={'renderer.vega-lite.errorJson'} />
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue