From 9911c5dc12495beb7a3c838c89e43fa7adc3f737 Mon Sep 17 00:00:00 2001
From: Nithin David Thomas <1277421+nithindavid@users.noreply.github.com>
Date: Tue, 20 Feb 2024 16:12:51 -0800
Subject: [PATCH] chore: Hide banners on onboarding view (#8934)

---------
Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
---
 app/javascript/dashboard/App.vue              |  8 +++++--
 app/javascript/v3/helpers/RouteHelper.js      | 10 ++++++++
 .../v3/helpers/specs/RouteHelper.spec.js      | 23 ++++++++++++++++++-
 3 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/app/javascript/dashboard/App.vue b/app/javascript/dashboard/App.vue
index 49fe325f6..481c671ce 100644
--- a/app/javascript/dashboard/App.vue
+++ b/app/javascript/dashboard/App.vue
@@ -8,8 +8,8 @@
   >
     <update-banner :latest-chatwoot-version="latestChatwootVersion" />
     <template v-if="currentAccountId">
-      <pending-email-verification-banner />
-      <payment-pending-banner />
+      <pending-email-verification-banner v-if="hideOnOnboardingView" />
+      <payment-pending-banner v-if="hideOnOnboardingView" />
       <upgrade-banner />
     </template>
     <transition name="fade" mode="out-in">
@@ -38,6 +38,7 @@ import vueActionCable from './helper/actionCable';
 import WootSnackbarBox from './components/SnackbarContainer.vue';
 import rtlMixin from 'shared/mixins/rtlMixin';
 import { setColorTheme } from './helper/themeHelper';
+import { isOnOnboardingView } from 'v3/helpers/RouteHelper';
 import {
   registerSubscription,
   verifyServiceWorkerExistence,
@@ -79,6 +80,9 @@ export default {
       const { accounts = [] } = this.currentUser || {};
       return accounts.length > 0;
     },
+    hideOnOnboardingView() {
+      return !isOnOnboardingView(this.$route);
+    },
   },
 
   watch: {
diff --git a/app/javascript/v3/helpers/RouteHelper.js b/app/javascript/v3/helpers/RouteHelper.js
index db508ac13..16bc9cd41 100644
--- a/app/javascript/v3/helpers/RouteHelper.js
+++ b/app/javascript/v3/helpers/RouteHelper.js
@@ -48,3 +48,13 @@ export const validateRouteAccess = (to, next, chatwootConfig = {}) => {
 
   next();
 };
+
+export const isOnOnboardingView = route => {
+  const { name = '' } = route || {};
+
+  if (!name) {
+    return false;
+  }
+
+  return name.includes('onboarding_');
+};
diff --git a/app/javascript/v3/helpers/specs/RouteHelper.spec.js b/app/javascript/v3/helpers/specs/RouteHelper.spec.js
index 8481a8ff4..4ebeccdcb 100644
--- a/app/javascript/v3/helpers/specs/RouteHelper.spec.js
+++ b/app/javascript/v3/helpers/specs/RouteHelper.spec.js
@@ -1,4 +1,4 @@
-import { validateRouteAccess } from '../RouteHelper';
+import { validateRouteAccess, isOnOnboardingView } from '../RouteHelper';
 import { clearBrowserSessionCookies } from 'dashboard/store/utils/api';
 import { replaceRouteWithReload } from '../CommonHelper';
 import Cookies from 'js-cookie';
@@ -67,3 +67,24 @@ describe('#validateRouteAccess', () => {
     expect(next).toHaveBeenCalledWith();
   });
 });
+
+describe('isOnOnboardingView', () => {
+  test('returns true for a route with onboarding name', () => {
+    const route = { name: 'onboarding_welcome' };
+    expect(isOnOnboardingView(route)).toBe(true);
+  });
+
+  test('returns false for a route without onboarding name', () => {
+    const route = { name: 'home' };
+    expect(isOnOnboardingView(route)).toBe(false);
+  });
+
+  test('returns false for a route with null name', () => {
+    const route = { name: null };
+    expect(isOnOnboardingView(route)).toBe(false);
+  });
+
+  test('returns false for an  undefined route object', () => {
+    expect(isOnOnboardingView()).toBe(false);
+  });
+});