mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-13 14:44:43 -04:00
Add note loading boundary (#2040)
* Remove redundant equal value Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de> * Add NoteLoadingBoundary to fetch note from API before rendering Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de> * Improve debug message for setHandler Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de> * Add test for boundary Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de> * Use common error page for note loading errors Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de> * Fix tests Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de> * Format code Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de> * Add missing snapshot Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de> * Reformat code Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
parent
0419113d36
commit
880e542351
19 changed files with 282 additions and 166 deletions
|
@ -4,6 +4,7 @@
|
|||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
import type { ReactElement } from 'react'
|
||||
import React from 'react'
|
||||
import { Alert } from 'react-bootstrap'
|
||||
import { LoadingAnimation } from './loading-animation'
|
||||
|
@ -11,7 +12,7 @@ import { ShowIf } from '../../common/show-if/show-if'
|
|||
import styles from '../application-loader.module.scss'
|
||||
|
||||
export interface LoadingScreenProps {
|
||||
failedTaskName?: string
|
||||
errorMessage?: string | ReactElement
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -19,20 +20,16 @@ export interface LoadingScreenProps {
|
|||
*
|
||||
* @param failedTaskName Should be set if a task failed to load. The name will be shown on screen.
|
||||
*/
|
||||
export const LoadingScreen: React.FC<LoadingScreenProps> = ({ failedTaskName }) => {
|
||||
export const LoadingScreen: React.FC<LoadingScreenProps> = ({ errorMessage }) => {
|
||||
return (
|
||||
<div className={`${styles.loader} ${styles.middle} text-light overflow-hidden`}>
|
||||
<div className='mb-3 text-light'>
|
||||
<span className={`d-block`}>
|
||||
<LoadingAnimation error={!!failedTaskName} />
|
||||
<LoadingAnimation error={!!errorMessage} />
|
||||
</span>
|
||||
</div>
|
||||
<ShowIf condition={!!failedTaskName}>
|
||||
<Alert variant={'danger'}>
|
||||
The task {failedTaskName} failed.
|
||||
<br />
|
||||
For further information look into the browser console.
|
||||
</Alert>
|
||||
<ShowIf condition={!!errorMessage}>
|
||||
<Alert variant={'danger'}>{errorMessage}</Alert>
|
||||
</ShowIf>
|
||||
</div>
|
||||
)
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue