diff --git a/frontend/components/Layout/Layout.js b/frontend/components/Layout/Layout.js index af07a7e1..6185aeda 100644 --- a/frontend/components/Layout/Layout.js +++ b/frontend/components/Layout/Layout.js @@ -27,7 +27,6 @@ type Props = { children?: ?React.Element, actions?: ?React.Element, title?: ?React.Element, - loading?: boolean, user: UserStore, auth: AuthStore, ui: UiStore, @@ -73,7 +72,7 @@ type Props = { ]} /> - {this.props.loading && } + {this.props.ui.progressBarVisible && } {this.props.notifications} diff --git a/frontend/scenes/Document/Document.js b/frontend/scenes/Document/Document.js index 1cbdc9a5..8a700fb4 100644 --- a/frontend/scenes/Document/Document.js +++ b/frontend/scenes/Document/Document.js @@ -79,7 +79,9 @@ type Props = { const document = this.document; if (!document) return; + this.props.ui.enableProgressBar(); await document.save(); + this.props.ui.disableProgressBar(); this.props.ui.disableEditMode(); if (redirect) { @@ -88,11 +90,11 @@ type Props = { }; onImageUploadStart() { - // TODO: How to set loading bar on layout? + this.props.ui.enableProgressBar(); } onImageUploadStop() { - // TODO: How to set loading bar on layout? + this.props.ui.disableProgressBar(); } onChange = text => { diff --git a/frontend/stores/UiStore.js b/frontend/stores/UiStore.js index 48327a7b..fed5c13c 100644 --- a/frontend/stores/UiStore.js +++ b/frontend/stores/UiStore.js @@ -5,6 +5,7 @@ import Collection from 'models/Collection'; class UiStore { @observable activeDocument: ?Document; + @observable progressBarVisible: boolean = true; @observable editMode: boolean = false; /* Computed */ @@ -30,6 +31,14 @@ class UiStore { @action disableEditMode() { this.editMode = false; } + + @action enableProgressBar() { + this.progressBarVisible = true; + } + + @action disableProgressBar() { + this.progressBarVisible = false; + } } export default UiStore;