From d6b495d5296827e8b57abe3e2fa1b43cbfcc9dee Mon Sep 17 00:00:00 2001 From: Viktor Yakubiv Date: Tue, 31 Mar 2020 12:22:45 +0300 Subject: [PATCH] Remove 'observer' from the global App component (#221) Fixes the bug with infinite redirect loop in 'back' button press. Inside the Application component creates LoadingBar component connected to the store. --- components/application/index.jsx | 5 ++--- components/application/loading-bar.jsx | 9 +++++++++ pages/_app/index.jsx | 3 --- 3 files changed, 11 insertions(+), 6 deletions(-) create mode 100644 components/application/loading-bar.jsx diff --git a/components/application/index.jsx b/components/application/index.jsx index 9691f7644..002a3908b 100644 --- a/components/application/index.jsx +++ b/components/application/index.jsx @@ -1,7 +1,7 @@ import React from 'react' import { Container, AppBar, SideBar, Main } from '../layout' -import LoadingBar from '../loading-bar' +import LoadingBar from './loading-bar' import RepositorySelect from './repository-select' import ActivitySelect from './activity-select' import Head from './head' @@ -15,13 +15,12 @@ const Application = ({ dataProvider, activity, isAuthenticated = false, - isLoading = false, ...restProps }) => ( <> - {isLoading && } + {isAuthenticated ? ( <> diff --git a/components/application/loading-bar.jsx b/components/application/loading-bar.jsx new file mode 100644 index 000000000..093ee5d22 --- /dev/null +++ b/components/application/loading-bar.jsx @@ -0,0 +1,9 @@ +import React from 'react' + +import { withGlobalStore } from 'store' +import LoadingBar from 'components/loading-bar' + +const LoadingBarController = ({ store, ...passProps }) => + store.isLoading ? : null + +export default withGlobalStore(LoadingBarController) diff --git a/pages/_app/index.jsx b/pages/_app/index.jsx index bd02f9d4c..48e2e7482 100644 --- a/pages/_app/index.jsx +++ b/pages/_app/index.jsx @@ -2,7 +2,6 @@ import React from 'react' import NextApp from 'next/app' import { withRouter } from 'next/router' import { autorun } from 'mobx' -import { observer } from 'mobx-react' import '@oacore/design/lib/index.css' @@ -26,7 +25,6 @@ process.on('uncaughtException', err => { Sentry.captureException(err) }) -@observer class App extends NextApp { state = { isAuthorized: false, @@ -265,7 +263,6 @@ class App extends NextApp { dataProvider={store.dataProvider} activity={store.activity.id} onClick={this.handleNavigation} - isLoading={store.isLoading} isAuthenticated >