fix: fixed auth0

Author: okijhhyu

.vscode/settings.json

@@ -0,0 +1,5 @@
+{
+  "cSpell.words": [
+    "nuxt"
+  ]
+}

components/common/header/index.vue

@@ -5,17 +5,16 @@
     </router-link>
     <breadrumbs />
     <div class="header-settings">
-      <span class="link-normal" @click="isAuthenticated ? logout() : login()">
-        {{ isAuthenticated }}
-        {{ user }}
-        {{ isAuthenticated ? 'Sign out' : 'Sign in' }}
-      </span>
+      <a class="link-normal" :href="user ? '/api/auth/logout' : '/api/auth/login'">
+        {{ user ? 'Sign out' : 'Sign in' }}
+      </a>
     </div>
   </div>
 </template>
 <script setup lang="ts">
 import Breadrumbs from '@/components/common/breadcrumbs/index.vue'
-import { useAuth0 } from '@/composables/auth0';
-const { login, isAuthenticated, logout, user } = useAuth0()
-const auth = computed(() => { return isAuthenticated })
+const user = useUser()
+// import { useAuth0 } from '@/composables/auth0';
+// const { login, isAuthenticated, logout, user } = useAuth0()
+// const auth = computed(() => { return isAuthenticated })
 </script>

composables/auth0.js

@@ -0,0 +1,6 @@
+import { useState } from '#app'
+import { User } from '@auth0/auth0-spa-js'
+
+export default function () {
+  return useState<User>('user', () => null)
+}

composables/useUser.js

@@ -0,0 +1,15 @@
+import useUser from "~~/composables/useUser";
+
+export default defineNuxtRouteMiddleware((to, from) => {
+  const user = useUser()
+  const allowedRoutes = ['/', '/login']
+  if (user.value) {
+    if (allowedRoutes.includes(to.path)) {
+      return navigateTo('/private')
+    }
+  } else {
+    if (!allowedRoutes.includes(to.path)) {
+      return navigateTo('/login')
+    }
+  }
+})

middleware/watchdog.global.ts

@@ -1,5 +1,14 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 // import vue from '@vitejs/plugin-vue'
+const {
+  AUTH0_BASE_URL,
+  AUTH0_ISSUER_BASE_URL,
+  AUTH0_CLIENT_ID,
+  AUTH0_CLIENT_SECRET,
+  AUTH0_AUDIENCE,
+  AUTH0_COOKIE_NAME
+} = process.env
+
 export default defineNuxtConfig({
   devtools: { enabled: true },
   // css
@@ -11,7 +20,15 @@ export default defineNuxtConfig({
     user: process.env.DBUSERNAME,
     pass: process.env.DBPASSWORD,
     authSource: process.env.DBAUTHSOURCE,
-    mainPage: process.env.MAINPAGE
+    AUTH0_BASE_URL,
+    AUTH0_ISSUER_BASE_URL,
+    AUTH0_CLIENT_ID,
+    AUTH0_CLIENT_SECRET,
+    AUTH0_AUDIENCE,
+    AUTH0_COOKIE_NAME,
+    public: {
+      AUTH0_COOKIE_NAME
+    }
   },
 
   modules: [