mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-15 07:34:42 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

refactor: remove show-if in favour of conditionals

Browse source 
This prevents a problem where show-if can trigger an error if a value is checked to exist with it.

Signed-off-by: Philip Molares <philip.molares@udo.edu>
This commit is contained in:
Philip Molares 2023-10-30 12:23:24 +01:00
parent 8884bbb428
commit f701f8d05f
52 changed files with 239 additions and 352 deletions
Download patch file Download diff file Expand all files Collapse all files

7
frontend/src/extensions/external-lib-app-extensions/abcjs/abc-frame.tsx
View file

@ -1,10 +1,9 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { AsyncLoadingBoundary } from '../../../components/common/async-loading-boundary/async-loading-boundary'
import { ShowIf } from '../../../components/common/show-if/show-if'
import { WaitSpinner } from '../../../components/common/wait-spinner/wait-spinner'
import type { CodeProps } from '../../../components/markdown-renderer/replace-components/code-block-component-replacer'
import { useEffectWithCatch } from '../../../hooks/common/use-effect-with-catch'
@ -49,9 +48,9 @@ export const AbcFrame: React.FC<CodeProps> = ({ code }) => {
return (
<AsyncLoadingBoundary loading={loading || !abcLib} error={!!loadingError} componentName={'abc.js'}>
<ShowIf condition={!!renderError}>
{renderError !== undefined && (
<TranslatedApplicationErrorAlert errorI18nKey={'editor.embeddings.abcJs.errorWhileRendering'} />
</ShowIf>
)}
<div
ref={container}
className={`${styles['abcjs-score']} bg-white text-black svg-container`}

7
frontend/src/extensions/external-lib-app-extensions/flowchart/flowchart.tsx
View file

@ -1,11 +1,10 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import fontStyles from '../../../../global-styles/variables.module.scss'
import { AsyncLoadingBoundary } from '../../../components/common/async-loading-boundary/async-loading-boundary'
import { ShowIf } from '../../../components/common/show-if/show-if'
import type { CodeProps } from '../../../components/markdown-renderer/replace-components/code-block-component-replacer'
import { useDarkModeState } from '../../../hooks/dark-mode/use-dark-mode-state'
import { Logger } from '../../../utils/logger'
@ -71,9 +70,7 @@ export const FlowChart: React.FC<CodeProps> = ({ code }) => {
return (
<AsyncLoadingBoundary loading={loading || !flowchartLib} componentName={'flowchart.js'} error={!!libLoadingError}>
<ShowIf condition={syntaxError}>
<TranslatedApplicationErrorAlert errorI18nKey={'renderer.flowchart.invalidSyntax'} />
</ShowIf>
{syntaxError && <TranslatedApplicationErrorAlert errorI18nKey={'renderer.flowchart.invalidSyntax'} />}
<div ref={diagramRef} {...testId('flowchart')} className={'text-center'} />
</AsyncLoadingBoundary>
)

7
frontend/src/extensions/external-lib-app-extensions/graphviz/graphviz-frame.tsx
View file

@ -1,10 +1,9 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { AsyncLoadingBoundary } from '../../../components/common/async-loading-boundary/async-loading-boundary'
import { ShowIf } from '../../../components/common/show-if/show-if'
import type { CodeProps } from '../../../components/markdown-renderer/replace-components/code-block-component-replacer'
import { cypressId } from '../../../utils/cypress-attribute'
import { Logger } from '../../../utils/logger'
@ -59,9 +58,7 @@ export const GraphvizFrame: React.FC<CodeProps> = ({ code }) => {
return (
<AsyncLoadingBoundary loading={isLibLoading || !graphvizImport} componentName={'graphviz'} error={libLoadingError}>
<ShowIf condition={!!error}>
<ApplicationErrorAlert className={'text-wrap'}>{error}</ApplicationErrorAlert>
</ShowIf>
{error !== undefined && <ApplicationErrorAlert className={'text-wrap'}>{error}</ApplicationErrorAlert>}
<div className={'svg-container'} {...cypressId('graphviz')} ref={container} />
</AsyncLoadingBoundary>
)

7
frontend/src/extensions/external-lib-app-extensions/mermaid/mermaid-chart.tsx
View file

@ -1,9 +1,8 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { ShowIf } from '../../../components/common/show-if/show-if'
import type { CodeProps } from '../../../components/markdown-renderer/replace-components/code-block-component-replacer'
import { cypressId } from '../../../utils/cypress-attribute'
import { Logger } from '../../../utils/logger'
@ -65,9 +64,7 @@ export const MermaidChart: React.FC<CodeProps> = ({ code }) => {
return (
<Fragment>
<ShowIf condition={!!error}>
<ApplicationErrorAlert className={'text-wrap'}>{error?.message}</ApplicationErrorAlert>
</ShowIf>
{error !== undefined && <ApplicationErrorAlert className={'text-wrap'}>{error?.message}</ApplicationErrorAlert>}
<div
{...cypressId('mermaid-frame')}
className={`text-center ${styles['mermaid']} bg-dark text-black`}

7
frontend/src/extensions/external-lib-app-extensions/vega-lite/vega-lite-chart.tsx
View file

@ -1,10 +1,9 @@
/*
* SPDX-FileCopyrightText: 2022 The HedgeDoc developers (see AUTHORS file)
* SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { AsyncLoadingBoundary } from '../../../components/common/async-loading-boundary/async-loading-boundary'
import { ShowIf } from '../../../components/common/show-if/show-if'
import type { CodeProps } from '../../../components/markdown-renderer/replace-components/code-block-component-replacer'
import { Logger } from '../../../utils/logger'
import React, { useEffect, useRef } from 'react'
@ -59,9 +58,9 @@ export const VegaLiteChart: React.FC<CodeProps> = ({ code }) => {
return (
<AsyncLoadingBoundary loading={libLoading || !vegaEmbed} error={libLoadingError} componentName={'Vega Lite'}>
<ShowIf condition={!!renderingError}>
{renderingError !== undefined && (
<TranslatedApplicationErrorAlert errorI18nKey={'renderer.vega-lite.errorJson'} />
</ShowIf>
)}
<div className={'text-center'}>
<div ref={diagramContainer} />
</div>