Merge remote-tracking branch 'upstream/master'

3 files changed, 89 insertions, 35 deletions

diff --git a/src/components/AppUpdateInfoBar.js b/src/components/AppUpdateInfoBar.js
new file mode 100644
index 000000000..4fb3a8b71
--- /dev/null
+++ b/src/components/AppUpdateInfoBar.js
@@ -0,0 +1,66 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { defineMessages, intlShape } from 'react-intl';
+
+import { announcementActions } from '../features/announcements/actions';
+import InfoBar from './ui/InfoBar';
+
+const messages = defineMessages({
+  updateAvailable: {
+    id: 'infobar.updateAvailable',
+    defaultMessage: '!!!A new update for Franz is available.',
+  },
+  changelog: {
+    id: 'infobar.buttonChangelog',
+    defaultMessage: '!!!Changelog',
+  },
+  buttonInstallUpdate: {
+    id: 'infobar.buttonInstallUpdate',
+    defaultMessage: '!!!Restart & install update',
+  },
+});
+
+class AppUpdateInfoBar extends Component {
+  static propTypes = {
+    onInstallUpdate: PropTypes.func.isRequired,
+    nextAppReleaseVersion: PropTypes.string,
+  };
+
+  static defaultProps = {
+    nextAppReleaseVersion: null,
+  };
+
+  static contextTypes = {
+    intl: intlShape,
+  };
+
+  render() {
+    const { intl } = this.context;
+    const {
+      onInstallUpdate,
+      nextAppReleaseVersion,
+    } = this.props;
+
+    return (
+      <InfoBar
+        type="primary"
+        ctaLabel={intl.formatMessage(messages.buttonInstallUpdate)}
+        onClick={onInstallUpdate}
+        sticky
+      >
+        <span className="mdi mdi-information" />
+        {intl.formatMessage(messages.updateAvailable)}
+        {' '}
+        <button
+          className="info-bar__inline-button"
+          type="button"
+          onClick={() => announcementActions.show({ targetVersion: nextAppReleaseVersion })}
+        >
+          <u>{intl.formatMessage(messages.changelog)}</u>
+        </button>
+      </InfoBar>
+    );
+  }
+}
+
+export default AppUpdateInfoBar;
diff --git a/src/components/auth/AuthLayout.js b/src/components/auth/AuthLayout.js
index ac8fdbe5b..3d43d4e5c 100644
--- a/src/components/auth/AuthLayout.js
+++ b/src/components/auth/AuthLayout.js
@@ -11,6 +11,7 @@ import { oneOrManyChildElements, globalError as globalErrorPropType } from '../.
 import globalMessages from '../../i18n/globalMessages';
 
 import { isWindows } from '../../environment';
+import AppUpdateInfoBar from '../AppUpdateInfoBar';
 
 export default @observer class AuthLayout extends Component {
   static propTypes = {
@@ -22,6 +23,13 @@ export default @observer class AuthLayout extends Component {
     isHealthCheckLoading: PropTypes.bool.isRequired,
     isFullScreen: PropTypes.bool.isRequired,
     darkMode: PropTypes.bool.isRequired,
+    nextAppReleaseVersion: PropTypes.string,
+    installAppUpdate: PropTypes.func.isRequired,
+    appUpdateIsDownloaded: PropTypes.bool.isRequired,
+  };
+
+  static defaultProps = {
+    nextAppReleaseVersion: null,
   };
 
   static contextTypes = {
@@ -38,6 +46,9 @@ export default @observer class AuthLayout extends Component {
       isHealthCheckLoading,
       isFullScreen,
       darkMode,
+      nextAppReleaseVersion,
+      installAppUpdate,
+      appUpdateIsDownloaded,
     } = this.props;
     const { intl } = this.context;
 
@@ -53,6 +64,12 @@ export default @observer class AuthLayout extends Component {
               {intl.formatMessage(globalMessages.notConnectedToTheInternet)}
             </InfoBar>
           )}
+          {appUpdateIsDownloaded && (
+            <AppUpdateInfoBar
+              nextAppReleaseVersion={nextAppReleaseVersion}
+              onInstallUpdate={installAppUpdate}
+            />
+          )}
           {isOnline && !isAPIHealthy && (
             <InfoBar
               type="danger"
diff --git a/src/components/layout/AppLayout.js b/src/components/layout/AppLayout.js
index d0476ef04..c66004183 100644
--- a/src/components/layout/AppLayout.js
+++ b/src/components/layout/AppLayout.js
@@ -13,10 +13,9 @@ import ErrorBoundary from '../util/ErrorBoundary';
 // import globalMessages from '../../i18n/globalMessages';
 
 import { isWindows } from '../../environment';
-import AnnouncementScreen from '../../features/announcements/components/AnnouncementScreen';
 import WorkspaceSwitchingIndicator from '../../features/workspaces/components/WorkspaceSwitchingIndicator';
 import { workspaceStore } from '../../features/workspaces';
-import { announcementActions } from '../../features/announcements/actions';
+import AppUpdateInfoBar from '../AppUpdateInfoBar';
 
 function createMarkup(HTMLString) {
   return { __html: HTMLString };
@@ -27,22 +26,10 @@ const messages = defineMessages({
     id: 'infobar.servicesUpdated',
     defaultMessage: '!!!Your services have been updated.',
   },
-  updateAvailable: {
-    id: 'infobar.updateAvailable',
-    defaultMessage: '!!!A new update for Franz is available.',
-  },
   buttonReloadServices: {
     id: 'infobar.buttonReloadServices',
     defaultMessage: '!!!Reload services',
   },
-  changelog: {
-    id: 'infobar.buttonChangelog',
-    defaultMessage: '!!!Changelog',
-  },
-  buttonInstallUpdate: {
-    id: 'infobar.buttonInstallUpdate',
-    defaultMessage: '!!!Restart & install update',
-  },
   requiredRequestsFailed: {
     id: 'infobar.requiredRequestsFailed',
     defaultMessage: '!!!Could not load services and user information',
@@ -82,7 +69,6 @@ class AppLayout extends Component {
     areRequiredRequestsLoading: PropTypes.bool.isRequired,
     darkMode: PropTypes.bool.isRequired,
     isDelayAppScreenVisible: PropTypes.bool.isRequired,
-    isAnnouncementVisible: PropTypes.bool.isRequired,
   };
 
   static defaultProps = {
@@ -116,7 +102,6 @@ class AppLayout extends Component {
       areRequiredRequestsLoading,
       darkMode,
       isDelayAppScreenVisible,
-      isAnnouncementVisible,
     } = this.props;
 
     const { intl } = this.context;
@@ -175,32 +160,18 @@ class AppLayout extends Component {
                   </InfoBar>
                 )}
                 {appUpdateIsDownloaded && (
-                  <InfoBar
-                    type="primary"
-                    ctaLabel={intl.formatMessage(messages.buttonInstallUpdate)}
-                    onClick={installAppUpdate}
-                    sticky
-                  >
-                    <span className="mdi mdi-information" />
-                    {intl.formatMessage(messages.updateAvailable)}
-                    {' '}
-                    <button
-                      className="info-bar__inline-button"
-                      type="button"
-                      onClick={() => announcementActions.show({ targetVersion: nextAppReleaseVersion })}
-                    >
-                      <u>{intl.formatMessage(messages.changelog)}</u>
-                    </button>
-                  </InfoBar>
+                  <AppUpdateInfoBar
+                    nextAppReleaseVersion={nextAppReleaseVersion}
+                    onInstallUpdate={installAppUpdate}
+                  />
                 )}
                 <BasicAuth />
                 <ShareFranz />
-                {isAnnouncementVisible && (<AnnouncementScreen />)}
                 {services}
+                {children}
               </div>
             </div>
           </div>
-          {children}
         </div>
       </ErrorBoundary>
     );