Simplify everything to match supabase example and also downgrade supabase

pages/dashboard.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
+  const user = await useSupabaseUser();
   definePageMeta({
     middleware: ['auth'],
-    layout: "authenticated",
   });
 </script>
 <template>
   <div>
-    <h3>Dashboard</h3>
+    <h3>{{ user?.user_metadata.full_name }}'s Dashboard</h3>
+    <div>Stuff</div>
   </div>
 </template>

pages/index.vue

@@ -1,17 +1,15 @@
 <script setup lang="ts">
-  definePageMeta({
-    middleware: ['auth'],
-  });
-
-  //horrible horrible kludge from https://github.com/nuxt-modules/supabase/issues/28#issuecomment-1353070523
-  const user = useSupabaseUser();
-  watchEffect(async () => {
-    if (user.value) await navigateTo("dashboard");
-  });  
+  const user = useSupabaseUser()
+  const supabase = useSupabaseClient();
+  watchEffect(() => {
+    if (user.value) {
+      navigateTo('/dashboard', {replace: true})
+    }
+  })
 </script>
 <template>
   <div>
     <h3>Index</h3>
-    <NuxtLink to="/login">Login</NuxtLink>
+    <button @click="supabase.auth.signInWithOAuth({provider: 'google'})">Sign In with Google</button>
   </div>
 </template>

pages/login.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-  definePageMeta({
-    middleware: ['auth'],
-  });
-
-  const supabase = useSupabaseAuthClient();
-
-  async function signInWithGoogle() {
-    const { data, error } = await supabase.auth.signInWithOAuth({
-      provider: 'google',
-      // options: { redirectTo: 'dashboard'} // the redirectTo option doesn't work
-    })
-    // navigateTo('dashboard'); // This doesn't work, it navigates prior to the oauth handshake completing and then the handshake lands on the index page and ignores the middleware.
-  }
-</script>
-
-<template>
-  <div>
-    Login
-    <button @click="signInWithGoogle()">Sign In with Google</button>
-  </div>
-</template>