diff options
Diffstat (limited to 'src/client/views/nodes/LoadingBox.tsx')
-rw-r--r-- | src/client/views/nodes/LoadingBox.tsx | 24 |
1 files changed, 20 insertions, 4 deletions
diff --git a/src/client/views/nodes/LoadingBox.tsx b/src/client/views/nodes/LoadingBox.tsx index 96620aff9..249461b67 100644 --- a/src/client/views/nodes/LoadingBox.tsx +++ b/src/client/views/nodes/LoadingBox.tsx @@ -5,6 +5,8 @@ import * as React from 'react'; import './LoadingBox.scss'; import ReactLoading from 'react-loading'; import { StrCast } from '../../../fields/Types'; +import { computed, observable } from 'mobx'; +import { Docs } from '../../documents/Documents'; @observer export class LoadingBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { @@ -12,6 +14,12 @@ export class LoadingBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { return FieldView.LayoutString(LoadingBox, fieldKey); } + @computed + private get isLoading() { + const file = Docs.Create.filesToDocs.get(this.rootDoc); + return file ? true : false; + } + componentDidMount() { console.log(this.rootDoc); // const file = Docs.Create.filesToDocs.get(this.rootDoc); @@ -44,10 +52,18 @@ export class LoadingBox extends ViewBoxAnnotatableComponent<FieldViewProps>() { render() { return ( <div className="loadingBoxContainer"> - <p className="text">Loading:</p> - <br></br> - <p className="text">{StrCast(this.rootDoc.title)}</p> - <ReactLoading type={'spinningBubbles'} color={'blue'} height={100} width={100} /> + {this.isLoading ? ( + <div> + <p className="text">Loading:</p> + <br></br> + <span className="text">{StrCast(this.rootDoc.title)}</span> + <ReactLoading type={'spinningBubbles'} color={'blue'} height={100} width={100} /> + </div> + ) : ( + <div> + <span>Error Loading File: {StrCast(this.rootDoc.title)}</span> + </div> + )} </div> ); } |