Prevent navigation issue after login.

fix #3627

frontend/src/layouts/admin/AdminLayout.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted } from 'vue'
+import { ref, computed } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import { useAuthStore, useParametersStore } from '@/stores'
 import parametersApi from '@/api/parameters'
@@ -17,6 +17,7 @@ const parametersStore = useParametersStore()
 
 const isRspamdVisible = ref(false)
 const rspamdUrl = ref('/rspamd')
+const registeredApplications = ref([])
 
 const authUser = computed(() => authStore.authUser)
 const imapMigrationEnabled = computed(
@@ -27,120 +28,132 @@ const openRspamdDashboard = () => {
   window.location = rspamdUrl.value
 }
 
-const settings = []
-const adminMenuItems = [
-  {
-    text: $gettext('Dashboard'),
-    to: { name: 'Dashboard' },
-    exact: true,
-    icon: 'mdi-view-dashboard-outline',
-  },
-  {
-    text: $gettext('Domains'),
-    to: { name: 'DomainList' },
-    icon: 'mdi-domain',
-    roles: [constants.DOMAIN_ADMIN, constants.RESELLER, constants.SUPER_ADMIN],
-  },
-  {
-    text: $gettext('Identities'),
-    to: { name: 'Identities' },
-    icon: 'mdi-account',
-    roles: [constants.DOMAIN_ADMIN, constants.RESELLER, constants.SUPER_ADMIN],
-  },
-  {
-    text: $gettext('Alarms'),
-    to: { name: 'Alarms' },
-    icon: 'mdi-bell',
-  },
-  {
-    icon: 'mdi-history',
-    text: $gettext('Monitoring'),
-    roles: [constants.SUPER_ADMIN, constants.RESELLER, constants.DOMAIN_ADMIN],
-    children: [
-      {
-        text: $gettext('Statistics'),
-        to: { name: 'Statistics' },
-        roles: [constants.SUPER_ADMIN],
-      },
-      {
-        text: $gettext('Audit trail'),
-        to: { name: 'AuditTrail' },
-        roles: [constants.SUPER_ADMIN],
-      },
-      {
-        text: $gettext('Messages'),
-        to: { name: 'MessageLog' },
-        roles: [
-          constants.DOMAIN_ADMIN,
-          constants.RESELLER,
-          constants.SUPER_ADMIN,
-        ],
-      },
-    ],
-  },
-  {
-    icon: 'mdi-email-sync-outline',
-    text: $gettext('IMAP Migration'),
-    roles: [constants.SUPER_ADMIN, constants.RESELLER],
-    condition: () => imapMigrationEnabled.value,
-    children: [
-      {
-        text: $gettext('Email providers'),
-        to: { name: 'ProvidersList' },
-        roles: [constants.SUPER_ADMIN, constants.RESELLER],
-      },
-      {
-        text: $gettext('Migrations'),
-        to: { name: 'MigrationsList' },
-        roles: [constants.RESELLER, constants.SUPER_ADMIN],
-      },
-    ],
-  },
-  {
-    icon: 'mdi-cog',
-    text: $gettext('Settings'),
-    children: settings,
-    roles: [constants.SUPER_ADMIN],
-  },
-  {
-    icon: 'mdi-email-check-outline',
-    text: 'Rspamd',
-    action: openRspamdDashboard,
-    roles: [constants.SUPER_ADMIN],
-    condition: () => isRspamdVisible.value,
-  },
-  {
-    icon: 'mdi-information',
-    text: $gettext('Information'),
-    roles: [constants.SUPER_ADMIN],
-    to: { name: 'Information' },
-    withBell: true,
-  },
-]
-
-onMounted(() => {
-  if (authUser.value.role === constants.SUPER_ADMIN) {
-    parametersApi.getGlobalApplications().then((response) => {
-      response.data.forEach((item) => {
-        settings.push({
-          text: item.label,
-          to: { name: 'ParametersEdit', params: { app: item.name } },
-        })
-      })
+const adminMenuItems = computed(() => {
+  const result = [
+    {
+      text: $gettext('Dashboard'),
+      to: { name: 'Dashboard' },
+      exact: true,
+      icon: 'mdi-view-dashboard-outline',
+    },
+    {
+      text: $gettext('Domains'),
+      to: { name: 'DomainList' },
+      icon: 'mdi-domain',
+      roles: [
+        constants.DOMAIN_ADMIN,
+        constants.RESELLER,
+        constants.SUPER_ADMIN,
+      ],
+    },
+    {
+      text: $gettext('Identities'),
+      to: { name: 'Identities' },
+      icon: 'mdi-account',
+      roles: [
+        constants.DOMAIN_ADMIN,
+        constants.RESELLER,
+        constants.SUPER_ADMIN,
+      ],
+    },
+    {
+      text: $gettext('Alarms'),
+      to: { name: 'Alarms' },
+      icon: 'mdi-bell',
+    },
+    {
+      icon: 'mdi-history',
+      text: $gettext('Monitoring'),
+      roles: [
+        constants.SUPER_ADMIN,
+        constants.RESELLER,
+        constants.DOMAIN_ADMIN,
+      ],
+      children: [
+        {
+          text: $gettext('Statistics'),
+          to: { name: 'Statistics' },
+          roles: [constants.SUPER_ADMIN],
+        },
+        {
+          text: $gettext('Audit trail'),
+          to: { name: 'AuditTrail' },
+          roles: [constants.SUPER_ADMIN],
+        },
+        {
+          text: $gettext('Messages'),
+          to: { name: 'MessageLog' },
+          roles: [
+            constants.DOMAIN_ADMIN,
+            constants.RESELLER,
+            constants.SUPER_ADMIN,
+          ],
+        },
+      ],
+    },
+    {
+      icon: 'mdi-email-sync-outline',
+      text: $gettext('IMAP Migration'),
+      roles: [constants.SUPER_ADMIN, constants.RESELLER],
+      condition: () => imapMigrationEnabled.value,
+      children: [
+        {
+          text: $gettext('Email providers'),
+          to: { name: 'ProvidersList' },
+          roles: [constants.SUPER_ADMIN, constants.RESELLER],
+        },
+        {
+          text: $gettext('Migrations'),
+          to: { name: 'MigrationsList' },
+          roles: [constants.RESELLER, constants.SUPER_ADMIN],
+        },
+      ],
+    },
+  ]
+  const settings = []
+  registeredApplications.value.forEach((item) => {
+    settings.push({
+      text: item.label,
+      to: { name: 'ParametersEdit', params: { app: item.name } },
     })
-    if (parametersStore.imapMigrationEnabled === null) {
-      parametersApi.getGlobalApplication('imap_migration').then((response) => {
-        parametersStore.imapMigrationEnabled =
-          response.data.params.enabled_imapmigration
-      })
-    }
-    capabilitiesApi.getCapabilities().then((response) => {
-      isRspamdVisible.value = 'rspamd' in response.data.capabilities
-      if (isRspamdVisible.value) {
-        rspamdUrl.value =
-          response.data.capabilities.rspamd.location || '/rspamd'
-      }
-    })
-  }
+  })
+  return result.concat([
+    {
+      icon: 'mdi-cog',
+      text: $gettext('Settings'),
+      children: settings,
+      roles: [constants.SUPER_ADMIN],
+    },
+    {
+      icon: 'mdi-email-check-outline',
+      text: 'Rspamd',
+      action: openRspamdDashboard,
+      roles: [constants.SUPER_ADMIN],
+      condition: () => isRspamdVisible.value,
+    },
+    {
+      icon: 'mdi-information',
+      text: $gettext('Information'),
+      roles: [constants.SUPER_ADMIN],
+      to: { name: 'Information' },
+      withBell: true,
+    },
+  ])
 })
+
+if (authUser.value.role === constants.SUPER_ADMIN) {
+  let response = await parametersApi.getGlobalApplications()
+  registeredApplications.value = response.data
+
+  if (parametersStore.imapMigrationEnabled === null) {
+    response = await parametersApi.getGlobalApplication('imap_migration')
+    parametersStore.imapMigrationEnabled =
+      response.data.params.enabled_imapmigration
+  }
+  response = await capabilitiesApi.getCapabilities()
+  isRspamdVisible.value = 'rspamd' in response.data.capabilities
+  if (isRspamdVisible.value) {
+    rspamdUrl.value = response.data.capabilities.rspamd.location || '/rspamd'
+  }
+}
 </script>

frontend/src/views/DashboardView.vue

@@ -1,17 +1,19 @@
 <template>
-  <v-toolbar flat>
-    <v-toolbar-title>{{ welcomeMsg }}</v-toolbar-title>
-  </v-toolbar>
+  <div>
+    <v-toolbar flat>
+      <v-toolbar-title>{{ welcomeMsg }}</v-toolbar-title>
+    </v-toolbar>
 
-  <v-row>
-    <v-col sm="12" md="6">
-      <NewsFeedWidget />
-    </v-col>
-  </v-row>
+    <v-row>
+      <v-col sm="12" md="6">
+        <NewsFeedWidget />
+      </v-col>
+    </v-row>
+  </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { onMounted, ref } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import NewsFeedWidget from '@/components/admin/dashboard/NewsFeedWidget'
 import parametersApi from '@/api/parameters'
@@ -20,12 +22,14 @@ const { $gettext } = useGettext()
 
 const welcomeMsg = ref('')
 
-const response = await parametersApi.getGlobalApplication('core')
-if (response.data.params.custom_welcome_message) {
-  welcomeMsg.value = response.data.params.custom_welcome_message
-} else {
-  welcomeMsg.value = $gettext('Welcome to Modoboa')
-}
+onMounted(async () => {
+  const response = await parametersApi.getGlobalApplication('core')
+  if (response.data.params.custom_welcome_message) {
+    welcomeMsg.value = response.data.params.custom_welcome_message
+  } else {
+    welcomeMsg.value = $gettext('Welcome to Modoboa')
+  }
+})
 </script>
 
 <style scoped>