feat(App): Add link to changelog in app update notification

4 files changed, 17 insertions, 3 deletions

diff --git a/src/components/layout/AppLayout.js b/src/components/layout/AppLayout.js
index f60c170a8..20dc2f764 100644
--- a/src/components/layout/AppLayout.js
+++ b/src/components/layout/AppLayout.js
@@ -23,6 +23,10 @@ const messages = defineMessages({
     id: 'infobar.buttonReloadServices',
     defaultMessage: '!!!Reload services',
   },
+  changelog: {
+    id: 'infobar.buttonChangelog',
+    defaultMessage: '!!!Changelog',
+  },
   buttonInstallUpdate: {
     id: 'infobar.buttonInstallUpdate',
     defaultMessage: '!!!Restart & install update',
@@ -135,7 +139,9 @@ export default class AppLayout extends Component {
                 sticky
               >
                 <span className="mdi mdi-information" />
-                {intl.formatMessage(messages.updateAvailable)}
+                {intl.formatMessage(messages.updateAvailable)} <a href="https://meetfranz.com/changelog" target="_blank">
+                  <u>{intl.formatMessage(messages.changelog)}</u>
+                </a>
               </InfoBar>
             )}
             {services}
diff --git a/src/components/ui/InfoBar.js b/src/components/ui/InfoBar.js
index aea2bd888..84a5f1446 100644
--- a/src/components/ui/InfoBar.js
+++ b/src/components/ui/InfoBar.js
@@ -61,10 +61,13 @@ export default class InfoBar extends Component {
           [`${className}`]: true,
         })}
       >
-        <div onClick={onClick} className="info-bar__content">
+        <div className="info-bar__content">
           {children}
           {ctaLabel && (
-            <button className="info-bar__cta">
+            <button
+              className="info-bar__cta"
+              onClick={onClick}
+            >
               <Loader
                 loaded={!ctaLoading}
                 lines={10}
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json
index c2ff295b2..67ea2034a 100644
--- a/src/i18n/locales/en-US.json
+++ b/src/i18n/locales/en-US.json
@@ -58,6 +58,7 @@
   "infobar.updateAvailable": "A new update for Franz is available.",
   "infobar.buttonReloadServices": "Reload services",
   "infobar.buttonInstallUpdate": "Restart & install update",
+  "infobar.buttonChangelog": "What is new?",
   "infobar.requiredRequestsFailed": "Could not load services and user information",
   "sidebar.settings": "Settings",
   "sidebar.addNewService": "Add new service",
diff --git a/src/styles/info-bar.scss b/src/styles/info-bar.scss
index c30c951ee..b6d1e84e2 100644
--- a/src/styles/info-bar.scss
+++ b/src/styles/info-bar.scss
@@ -46,6 +46,10 @@
     }
   }
 
+  a {
+    // text-decoration: underline;
+  }
+
   &.info-bar--bottom {
     order: 10;
   }