From 5dd84f9ca68b55e892d0f13f37b284457990a4de Mon Sep 17 00:00:00 2001 From: Sampath Kumar Krishnan Date: Sun, 12 Apr 2020 15:32:17 +0000 Subject: Make update banner dismissable (#564) - Remove the sticky option passed to InfoBar in AppUpdateInfoBar - Use component state to manage visibility of AppUpdateInfoBar in AuthLayout and AppLayout. - InfoBar will be dismissed only for the current session Co-Authored-By: Mahadevan Sreenivasan Co-authored-by: Mahadevan Sreenivasan --- src/components/AppUpdateInfoBar.js | 4 +++- src/components/auth/AuthLayout.js | 9 ++++++++- src/components/layout/AppLayout.js | 9 ++++++++- 3 files changed, 19 insertions(+), 3 deletions(-) (limited to 'src/components') diff --git a/src/components/AppUpdateInfoBar.js b/src/components/AppUpdateInfoBar.js index 4108fdf12..f51fe029b 100644 --- a/src/components/AppUpdateInfoBar.js +++ b/src/components/AppUpdateInfoBar.js @@ -24,6 +24,7 @@ class AppUpdateInfoBar extends Component { static propTypes = { onInstallUpdate: PropTypes.func.isRequired, nextAppReleaseVersion: PropTypes.string, + onHide: PropTypes.func.isRequired, }; static defaultProps = { @@ -39,6 +40,7 @@ class AppUpdateInfoBar extends Component { const { onInstallUpdate, nextAppReleaseVersion, + onHide, } = this.props; return ( @@ -46,7 +48,7 @@ class AppUpdateInfoBar extends Component { type="primary" ctaLabel={intl.formatMessage(messages.buttonInstallUpdate)} onClick={onInstallUpdate} - sticky + onHide={onHide} > {intl.formatMessage(messages.updateAvailable)} diff --git a/src/components/auth/AuthLayout.js b/src/components/auth/AuthLayout.js index 0c5198583..4783fc6a0 100644 --- a/src/components/auth/AuthLayout.js +++ b/src/components/auth/AuthLayout.js @@ -27,6 +27,10 @@ export default @observer class AuthLayout extends Component { appUpdateIsDownloaded: PropTypes.bool.isRequired, }; + state = { + shouldShowAppUpdateInfoBar: true, + } + static defaultProps = { nextAppReleaseVersion: null, }; @@ -62,10 +66,13 @@ export default @observer class AuthLayout extends Component { {intl.formatMessage(globalMessages.notConnectedToTheInternet)} )} - {appUpdateIsDownloaded && ( + {appUpdateIsDownloaded && this.state.shouldShowAppUpdateInfoBar && ( { + this.setState({ shouldShowAppUpdateInfoBar: false }); + }} /> )} {isOnline && !isAPIHealthy && ( diff --git a/src/components/layout/AppLayout.js b/src/components/layout/AppLayout.js index fe43c42d2..3b732e602 100644 --- a/src/components/layout/AppLayout.js +++ b/src/components/layout/AppLayout.js @@ -81,6 +81,10 @@ class AppLayout extends Component { hasActivatedTrial: PropTypes.bool.isRequired, }; + state = { + shouldShowAppUpdateInfoBar: true, + } + static defaultProps = { children: [], nextAppReleaseVersion: null, @@ -181,10 +185,13 @@ class AppLayout extends Component { {intl.formatMessage(messages.servicesUpdated)} )} - {appUpdateIsDownloaded && ( + { appUpdateIsDownloaded && this.state.shouldShowAppUpdateInfoBar && ( { + this.setState({ shouldShowAppUpdateInfoBar: false }); + }} /> )} -- cgit v1.2.3-70-g09d2