Update sprinkle account plugin

userfrosting · Jul 26, 2024 · 223f5dc · 223f5dc
1 parent 5f13171
commit 223f5dc
Show file tree

Hide file tree

Showing 6 changed files with 339 additions and 326 deletions.
diff --git a/app/assets/components/NavBar.vue b/app/assets/components/NavBar.vue
@@ -3,15 +3,13 @@ import { useAuthStore } from '@userfrosting/sprinkle-account/stores'
 
 // Logout API variables
 const auth = useAuthStore()
-auth.check() // TODO : Move to main.ts ?
 </script>
 
 <template>
     <UFNavBar title="Userfrosting">
         <UFNavBarItem :to="{ name: 'home' }" label="Home" />
         <UFNavBarItem :to="{ name: 'about' }" label="About" />
         <UFNavBarItem :to="{ name: 'auth' }" label="Auth" />
-        <UFNavBarItem :to="{ name: 'login' }" label="Login" />
         <UFNavBarLogin v-if="!auth.isAuthenticated" />
         <UFNavBarUserCard
             v-if="auth.isAuthenticated"

diff --git a/app/assets/main.ts b/app/assets/main.ts
@@ -10,14 +10,18 @@ const pinia = createPinia()
 pinia.use(piniaPluginPersistedstate)
 app.use(pinia)
 
+/** Setup Router */
+import router from './router'
+app.use(router)
+
 /** Setup Theme */
 import '@userfrosting/theme-pink-cupcake/less/main.less'
 import PinkCupcake from '@userfrosting/theme-pink-cupcake'
 app.use(PinkCupcake)
 
-/** Setup Router */
-import router from './router'
-app.use(router)
+/** Setup Account Sprinkle */
+import AccountSprinkle from '@userfrosting/sprinkle-account'
+app.use(AccountSprinkle, {router})
 
 // Done
 app.mount('#app')
diff --git a/app/assets/router/index.js → app/assets/router/index.ts b/app/assets/router/index.js → app/assets/router/index.ts
@@ -1,5 +1,4 @@
 import { createRouter, createWebHistory } from 'vue-router'
-import { useAuthStore } from '@userfrosting/sprinkle-account/stores'
 
 const router = createRouter({
     history: createWebHistory(),
@@ -17,6 +16,11 @@ const router = createRouter({
                 {
                     path: '/about',
                     name: 'about',
+                    meta: {
+                        auth: {
+                            redirect: { name: 'login' },
+                        }
+                    },
                     component: () => import('../views/AboutView.vue')
                 },
                 {
@@ -27,13 +31,12 @@ const router = createRouter({
                 {
                     path: '/login',
                     name: 'login',
-                    component: () => import('../views/LoginView.vue'),
-                    beforeEnter: () => {
-                        const auth = useAuthStore()
-                        if (auth.isAuthenticated) {
-                            return { name: 'home' }
+                    meta: {
+                        guest: {
+                            redirect: { name: 'home' }
                         }
-                    }
+                    },
+                    component: () => import('../views/LoginView.vue')
                 }
             ]
         }

diff --git a/app/assets/views/AuthView.vue b/app/assets/views/AuthView.vue
@@ -12,7 +12,9 @@ const auth = useAuthStore()
             <Logout />
         </div>
         <div v-else>
-            <UFFormLogin />
+            <UFCardBox>
+                <UFFormLogin />
+            </UFCardBox>
         </div>
         <div>
             <AuthCheck />