feat: Update notification in account settings (#1660)

app/controllers/api/v1/accounts_controller.rb

@@ -30,6 +30,7 @@ class Api::V1::AccountsController < Api::BaseController
   end
 
   def show
+    @latest_chatwoot_version = ::Redis::Alfred.get(::Redis::Alfred::LATEST_CHATWOOT_VERSION)
     render 'api/v1/accounts/show.json'
   end
 

app/javascript/dashboard/i18n/locale/en/generalSettings.json

@@ -42,7 +42,8 @@
         "INBOUND_EMAIL_ENABLED": "Conversation continuity with emails is enabled for your account.",
         "CUSTOM_EMAIL_DOMAIN_ENABLED": "You can receive emails in your custom domain now."
       }
-    }
+    },
+    "UPDATE_CHATWOOT": "An update %{latestChatwootVersion} for Chatwoot is available. Please update your instance."
   },
   "FORMS": {
     "MULTISELECT": {

app/javascript/dashboard/routes/dashboard/settings/account/Index.vue

@@ -79,7 +79,14 @@
         </div>
       </div>
       <div class="current-version">
-        {{ `v${globalConfig.appVersion}` }}
+        <div>{{ `v${globalConfig.appVersion}` }}</div>
+        <div v-if="hasAnUpdateAvailable && globalConfig.displayManifest">
+          {{
+            $t('GENERAL_SETTINGS.UPDATE_CHATWOOT', {
+              latestChatwootVersion: latestChatwootVersion,
+            })
+          }}
+        </div>
       </div>
 
       <woot-submit-button
@@ -100,6 +107,7 @@ import { mapGetters } from 'vuex';
 import alertMixin from 'shared/mixins/alertMixin';
 import configMixin from 'shared/mixins/configMixin';
 import accountMixin from '../../../../mixins/account';
+const semver = require('semver');
 
 export default {
   mixins: [accountMixin, alertMixin, configMixin],
@@ -112,6 +120,7 @@ export default {
       supportEmail: '',
       features: {},
       autoResolveDuration: null,
+      latestChatwootVersion: null,
     };
   },
   validations: {
@@ -131,6 +140,16 @@ export default {
       getAccount: 'accounts/getAccount',
       uiFlags: 'accounts/getUIFlags',
     }),
+    hasAnUpdateAvailable() {
+      if (!semver.valid(this.latestChatwootVersion)) {
+        return false;
+      }
+
+      return semver.lt(
+        this.globalConfig.appVersion,
+        this.latestChatwootVersion
+      );
+    },
     languagesSortedByCode() {
       const enabledLanguages = [...this.enabledLanguages];
       return enabledLanguages.sort((l1, l2) =>
@@ -167,6 +186,7 @@ export default {
           custom_email_domain_enabled,
           features,
           auto_resolve_duration,
+          latest_chatwoot_version: latestChatwootVersion,
         } = this.getAccount(this.accountId);
 
         this.$root.$i18n.locale = locale;
@@ -178,6 +198,7 @@ export default {
         this.customEmailDomainEnabled = custom_email_domain_enabled;
         this.features = features;
         this.autoResolveDuration = auto_resolve_duration;
+        this.latestChatwootVersion = latestChatwootVersion;
       } catch (error) {
         // Ignore error
       }

app/javascript/shared/store/globalConfig.js

@@ -1,7 +1,8 @@
 const {
   APP_VERSION: appVersion,
-  CREATE_NEW_ACCOUNT_FROM_DASHBOARD: createNewAccountFromDashboard,
   BRAND_NAME: brandName,
+  CREATE_NEW_ACCOUNT_FROM_DASHBOARD: createNewAccountFromDashboard,
+  DISPLAY_MANIFEST: displayManifest,
   INSTALLATION_NAME: installationName,
   LOGO_THUMBNAIL: logoThumbnail,
   LOGO: logo,
@@ -12,8 +13,9 @@ const {
 
 const state = {
   appVersion,
-  createNewAccountFromDashboard,
   brandName,
+  createNewAccountFromDashboard,
+  displayManifest,
   installationName,
   logo,
   logoThumbnail,

app/views/api/v1/accounts/show.json.jbuilder

@@ -6,3 +6,4 @@ json.custom_email_domain_enabled @account.custom_email_domain_enabled
 json.support_email @account.support_email
 json.features @account.all_features
 json.auto_resolve_duration @account.auto_resolve_duration
+json.latest_chatwoot_version @latest_chatwoot_version

package.json

@@ -33,6 +33,7 @@
     "marked": "^1.2.7",
     "md5": "^2.3.0",
     "query-string": "5",
+    "semver": "^7.3.4",
     "spinkit": "~1.2.5",
     "tailwindcss": "^1.9.6",
     "tween.js": "~16.6.0",

yarn.lock

@@ -9692,7 +9692,7 @@ semver@^6.0.0, semver@^6.1.2, semver@^6.3.0:
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
   integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
 
-semver@^7.3.2:
+semver@^7.3.2, semver@^7.3.4:
   version "7.3.4"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.4.tgz#27aaa7d2e4ca76452f98d3add093a72c943edc97"
   integrity sha512-tCfb2WLjqFAtXn4KEdxIhalnRtoKFN7nAwj0B3ZXCbQloV2tq5eDbcTmT68JJD3nRJq24/XgxtQKFIpQdtvmVw==