chore: Show new account modal if user accounts are empty (#2448)

app/javascript/dashboard/App.vue

@@ -3,12 +3,17 @@
     <transition name="fade" mode="out-in">
       <router-view></router-view>
     </transition>
+    <add-account-modal
+      :show="showAddAccountModal"
+      :has-accounts="hasAccounts"
+    />
     <woot-snackbar-box />
   </div>
 </template>
 
 <script>
 import { mapGetters } from 'vuex';
+import AddAccountModal from '../dashboard/components/layout/sidebarComponents/AddAccountModal';
 import WootSnackbarBox from './components/SnackbarContainer';
 import { accountIdFromPathname } from './helper/URLHelper';
 
@@ -17,14 +22,36 @@ export default {
 
   components: {
     WootSnackbarBox,
+    AddAccountModal,
+  },
+
+  data() {
+    return {
+      showAddAccountModal: false,
+    };
   },
 
   computed: {
     ...mapGetters({
       getAccount: 'accounts/getAccount',
+      currentUser: 'getCurrentUser',
     }),
+    hasAccounts() {
+      return (
+        this.currentUser &&
+        this.currentUser.accounts &&
+        this.currentUser.accounts.length !== 0
+      );
+    },
   },
 
+  watch: {
+    currentUser() {
+      if (!this.hasAccounts) {
+        this.showAddAccountModal = true;
+      }
+    },
+  },
   mounted() {
     this.$store.dispatch('setUser');
     this.setLocale(window.chatwootConfig.selectedLocale);