All - UI: radio group position (#410)

* use new account change route meta

* fix radio group position

* fix dep verison

* fix dep version

strr-base-web/app/app.config.ts

@@ -52,8 +52,8 @@ export default defineAppConfig({
       label: '-mt-[2px] pl-3 text-base cursor-pointer'
     },
     radioGroup: {
-      wrapper: 'max-w-bcGovInput',
-      fieldset: 'space-y-4 -mt-4',
+      wrapper: 'max-w-bcGovInput group',
+      fieldset: 'space-y-4 group-has-[legend]:-mt-4 [&:not(:has(legend))]:mt-1',
       legend: 'text-sm font-medium text-gray-700 dark:text-gray-200 mb-0'
     },
     select: {

strr-base-web/app/composables/useStrrModals.ts

@@ -72,27 +72,22 @@ export const useStrrModals = () => {
     })
   }
 
-  function openConfirmSwitchAccountModal (oldAccountId: string) {
+  function openConfirmSwitchAccountModal (newAccountId: string) {
     modal.open(ModalBase, {
       title: t('modal.changeAccountConfirm.title'),
       content: t('modal.changeAccountConfirm.content'),
-      persist: true,
-      closeFn: () => {
-        accountStore.switchCurrentAccount(oldAccountId)
-        modal.close()
-      },
       actions: [
         {
           label: t('modal.changeAccountConfirm.leaveBtn'),
-          handler: () => handleExternalRedirect(config.registryHomeURL + 'dashboard')
+          handler: () => {
+            accountStore.switchCurrentAccount(newAccountId)
+            handleExternalRedirect(config.registryHomeURL + 'dashboard')
+          }
         },
         {
           label: t('btn.cancel'),
           variant: 'outline',
-          handler: () => {
-            accountStore.switchCurrentAccount(oldAccountId)
-            modal.close()
-          }
+          handler: () => modal.close()
         }
       ]
     })

strr-base-web/package.json

@@ -42,7 +42,7 @@
     "vitest": "^1.6.0"
   },
   "dependencies": {
-    "@daxiom/nuxt-core-layer-test": "^0.0.15",
+    "@daxiom/nuxt-core-layer-test": "^0.0.17",
     "@vuepic/vue-datepicker": "^9.0.3",
     "country-codes-list": "^1.6.11",
     "luxon": "^3.5.0",

strr-host-pm-web/package.json

@@ -2,7 +2,7 @@
   "name": "strr-host-pm-web",
   "private": true,
   "type": "module",
-  "version": "0.0.16",
+  "version": "0.0.17",
   "scripts": {
     "build-check": "nuxt build",
     "build": "nuxt generate",
@@ -42,7 +42,7 @@
     "vitest": "^1.6.0"
   },
   "dependencies": {
-    "@daxiom/nuxt-core-layer-test": "^0.0.15",
+    "@daxiom/nuxt-core-layer-test": "^0.0.17",
     "@nuxt/ui": "2.19.2",
     "@vuepic/vue-datepicker": "^9.0.3",
     "country-codes-list": "^1.6.11",

strr-platform-web/app/pages/platform/application.vue

@@ -4,7 +4,6 @@ import { ConnectStepper, FormPlatformReviewConfirm } from '#components'
 const { t } = useI18n()
 const localePath = useLocalePath()
 const strrModal = useStrrModals()
-const accountStore = useConnectAccountStore()
 
 const { validateContact } = useStrrContactStore()
 const { validatePlatformBusiness } = useStrrPlatformBusiness()
@@ -214,24 +213,15 @@ watch(activeStepIndex, (val) => {
   setButtonControl({ leftButtons: [], rightButtons: buttons })
 }, { immediate: true })
 
-// manage account changes mid-application
-const originalAccountId = accountStore.currentAccount.id // TODO: find better solution than this
-watch(() => accountStore.currentAccount.id,
-  (newVal, oldVal) => {
-    if (newVal !== undefined && newVal !== originalAccountId) {
-      strrModal.openConfirmSwitchAccountModal(oldVal)
-    }
-  }
-)
-
 // page stuff
 useHead({
   title: t('strr.title.application')
 })
 
 definePageMeta({
   layout: 'connect-form',
-  middleware: ['auth', 'check-tos', 'require-premium-account', 'application-page']
+  middleware: ['auth', 'check-tos', 'require-premium-account', 'application-page'],
+  onAccountChange: (oldAccount: Account, newAccount: Account) => manageAccountChangeApplication(oldAccount, newAccount)
 })
 
 setBreadcrumbs([

strr-platform-web/app/pages/platform/dashboard.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 const { t } = useI18n()
 const config = useRuntimeConfig().public
-const accountStore = useConnectAccountStore()
 
 const { loading, title, subtitles } = storeToRefs(useConnectDetailsHeaderStore())
 const { downloadApplicationReceipt, loadPlatform } = useStrrPlatformStore()
@@ -20,15 +19,6 @@ const addresses = ref<ConnectAccordionItem[]>([])
 const representatives = ref<ConnectAccordionItem[]>([])
 const completingParty = ref<ConnectAccordionItem | undefined>(undefined)
 
-watch(() => accountStore.currentAccount.id,
-  (newVal) => {
-    if (newVal !== undefined) {
-      const { handleExternalRedirect } = useConnectNav()
-      handleExternalRedirect(config.registryHomeURL + 'dashboard')
-    }
-  }
-)
-
 onMounted(async () => {
   loading.value = true
   await loadPlatform()
@@ -119,7 +109,8 @@ useHead({
 
 definePageMeta({
   layout: 'connect-dashboard',
-  middleware: ['auth', 'check-tos', 'require-premium-account']
+  middleware: ['auth', 'check-tos', 'require-premium-account'],
+  onAccountChange: (oldAccount: Account, newAccount: Account) => manageAccountChangeDashboard(oldAccount, newAccount)
 })
 
 setBreadcrumbs([

strr-platform-web/app/utils/account-change.ts

@@ -0,0 +1,14 @@
+// warning modal to prevent account change
+export function manageAccountChangeApplication (oldAccount: Account, newAccount: Account) {
+  const strrModal = useStrrModals()
+  strrModal.openConfirmSwitchAccountModal(newAccount.id)
+  return false // return false to abort account change
+}
+
+// change accounts and send user to reg dashboard
+export function manageAccountChangeDashboard (oldAccount: Account, newAccount: Account) {
+  useConnectAccountStore().switchCurrentAccount(newAccount.id)
+  const { handleExternalRedirect } = useConnectNav()
+  handleExternalRedirect(useRuntimeConfig().public.registryHomeURL + 'dashboard')
+  return true
+}

strr-platform-web/package.json

@@ -2,7 +2,7 @@
   "name": "strr-platform-web",
   "private": true,
   "type": "module",
-  "version": "0.0.28",
+  "version": "0.0.29",
   "scripts": {
     "build-check": "nuxt build",
     "build": "nuxt generate",
@@ -41,7 +41,7 @@
     "vitest": "^1.6.0"
   },
   "dependencies": {
-    "@daxiom/nuxt-core-layer-test": "^0.0.15",
+    "@daxiom/nuxt-core-layer-test": "^0.0.17",
     "@vuepic/vue-datepicker": "^9.0.3",
     "country-codes-list": "^1.6.11",
     "nuxt": "3.12.4",

strr-strata-web/package.json

@@ -2,7 +2,7 @@
   "name": "strr-strata-web",
   "private": true,
   "type": "module",
-  "version": "0.0.26",
+  "version": "0.0.27",
   "scripts": {
     "build-check": "nuxt build",
     "build": "nuxt generate",
@@ -41,7 +41,7 @@
     "vitest": "^1.6.0"
   },
   "dependencies": {
-    "@daxiom/nuxt-core-layer-test": "^0.0.15",
+    "@daxiom/nuxt-core-layer-test": "^0.0.17",
     "@vuepic/vue-datepicker": "^9.0.3",
     "country-codes-list": "^1.6.11",
     "nuxt": "^3.12.3",