From 4727e0d88a0a9de44177008e257bf1101494a734 Mon Sep 17 00:00:00 2001 From: ErickSkrauch Date: Thu, 24 Jan 2019 02:34:02 +0300 Subject: [PATCH] #407: Refresh applications list on account switch --- src/components/dev/apps/ApplicationsIndex.js | 4 +- src/pages/dev/ApplicationsListPage.js | 69 ++++++++++++-------- 2 files changed, 43 insertions(+), 30 deletions(-) diff --git a/src/components/dev/apps/ApplicationsIndex.js b/src/components/dev/apps/ApplicationsIndex.js index 9616fae..d36811b 100644 --- a/src/components/dev/apps/ApplicationsIndex.js +++ b/src/components/dev/apps/ApplicationsIndex.js @@ -96,7 +96,9 @@ export default class ApplicationsIndex extends Component { resetClientId={resetClientId} /> ); - } else if (displayForGuest) { + } + + if (displayForGuest) { return ; } diff --git a/src/pages/dev/ApplicationsListPage.js b/src/pages/dev/ApplicationsListPage.js index d447da2..9c00f4f 100644 --- a/src/pages/dev/ApplicationsListPage.js +++ b/src/pages/dev/ApplicationsListPage.js @@ -11,37 +11,48 @@ import { } from 'components/dev/apps/actions'; import ApplicationsIndex from 'components/dev/apps/ApplicationsIndex'; -class ApplicationsListPage extends Component< - { - location: Location, - history: RouterHistory, - user: User, - apps: Array, - fetchAvailableApps: () => Promise, - deleteApp: string => Promise, - resetApp: (string, bool) => Promise - }, - { - isLoading: bool - } -> { +interface Props { + location: Location; + history: RouterHistory; + user: User; + apps: Array; + fetchAvailableApps: () => Promise; + deleteApp: string => Promise; + resetApp: (string, bool) => Promise; +} + +interface State { + isLoading: bool; + forceUpdate: bool; +} + +class ApplicationsListPage extends Component { state = { - isLoading: false + isLoading: false, + forceUpdate: false, }; componentDidMount() { !this.props.user.isGuest && this.loadApplicationsList(); } + componentDidUpdate({ user }) { + if (this.props.user !== user) { + // eslint-disable-next-line react/no-did-update-set-state + this.setState({ forceUpdate: true }); + this.loadApplicationsList(); + } + } + render() { const { user, apps, resetApp, deleteApp, location } = this.props; - const { isLoading } = this.state; + const { isLoading, forceUpdate } = this.state; const clientId = location.hash.substr(1) || null; return ( { this.setState({ isLoading: true }); await this.props.fetchAvailableApps(); - this.setState({ isLoading: false }); + this.setState({ + isLoading: false, + forceUpdate: false, + }); }; resetClientId = () => { @@ -66,14 +80,11 @@ class ApplicationsListPage extends Component< }; } -export default connect( - (state) => ({ - user: state.user, - apps: state.apps.available - }), - { - fetchAvailableApps, - resetApp, - deleteApp - } -)(ApplicationsListPage); +export default connect((state) => ({ + user: state.user, + apps: state.apps.available, +}), { + fetchAvailableApps, + resetApp, + deleteApp, +})(ApplicationsListPage);