🎨 Improving error system, fixing profile store, and more stuff

modules/app/pages/join/index.vue

@@ -14,6 +14,7 @@ const config = useRuntimeConfig()
 
 const router = useRouter()
 const toast = useToast()
+const { showErrorToast } = useErrorSystem()
 const { auth } = useSupabaseClient<Database>()
 
 const schema = object({
@@ -65,15 +66,8 @@ async function onSubmit(event: FormSubmitEvent<Schema>) {
   })
 
   if (error) {
-    console.log(error)
-    toast.add({
-      title: 'Erreur',
-      description: 'Une erreur est survenue lors de l\'inscription',
-      color: 'red',
-    })
+    showErrorToast(error, 'Une erreur est survenue lors de l\'inscription')
   } else {
-    console.log(data)
-    // Redirect to the waiting page
     toast.add({
       title: 'Super !',
       description: 'On a bien reçu ton inscription, un email de validation t\'a été envoyé',
@@ -86,7 +80,6 @@ async function onSubmit(event: FormSubmitEvent<Schema>) {
 }
 
 async function onError(event: FormErrorEvent) {
-  console.log(event.errors)
   const element = document.getElementById(event.errors[0].id)
   element?.focus()
   element?.scrollIntoView({ behavior: 'smooth', block: 'center' })

modules/app/pages/profile/auth/reset.vue

@@ -2,10 +2,12 @@
 definePageMeta({
   name: 'ProfileAuthResetPassword',
 })
+
+const router = useRouter()
 </script>
 
 <template>
   <UCard class="container mx-auto max-w-screen-md">
-    <PasswordUpdateForm />
+    <PasswordUpdateForm @success="() => router.to('/signin')" />
   </UCard>
 </template>

modules/app/pages/profile/index.vue

@@ -5,7 +5,7 @@ definePageMeta({
   name: 'Profile',
 })
 
-const { displayName, profile } = useProfile()
+const { displayName, profile } = storeToRefs(useProfile())
 
 const isPasswordModalOpen = ref(false)
 const isEmailModalOpen = ref(false)

modules/app/pages/signin/confirm.vue

@@ -5,8 +5,10 @@ definePageMeta({
   name: 'SigninConfirm',
 })
 
+const route = useRoute()
 const user = useSupabaseUser()
 const { auth } = useSupabaseClient<Database>()
+const { showErrorToast } = useErrorSystem()
 
 watch(user, () => {
   if (user.value)
@@ -14,11 +16,18 @@ watch(user, () => {
 }, { immediate: true })
 
 onMounted(async () => {
-  const token_hash = window.location.hash.replace('#', '')
+  const token_hash = route.hash.replace('#', '')
   const type = 'signup'
 
   const { error } = await auth.verifyOtp({ token_hash, type })
-  if (error) console.log(error)
+  showErrorToast(error)
+
+  // if (params.get('error_code').startsWith('4')) {
+  //   // show error message if error is a 4xx error
+  //   window.alert(params.get('error_description'))
+  // }
+
+  console.log('redirecting...')
 })
 </script>
 

modules/app/pages/signin/forgot.vue

@@ -11,6 +11,7 @@ definePageMeta({
 const config = useRuntimeConfig()
 const router = useRouter()
 const toast = useToast()
+const { showErrorToast } = useErrorSystem()
 
 const loading = ref(false)
 const sended = ref(false)
@@ -37,15 +38,8 @@ async function onSend(event: FormSubmitEvent<Schema>) {
   })
 
   if (error) {
-    console.log(error)
-    toast.add({
-      title: 'Erreur',
-      description: 'Une erreur est survenue lors de l\'envoi du lien de récupération',
-      color: 'red',
-    })
+    showErrorToast(error, 'Une erreur est survenue lors de l\'envoi du lien de récupération')
   } else {
-    console.log(data)
-
     toast.add({
       title: 'Va regarder ta boite de courriel !',
       description: 'Nous avons envoyé un lien de récupération à votre adresse courriel',

modules/app/pages/signin/index.vue

@@ -9,6 +9,7 @@ definePageMeta({
 
 const router = useRouter()
 const toast = useToast()
+const { showErrorToast } = useErrorSystem()
 
 const loading = ref(false)
 const { auth } = useSupabaseClient<Database>()
@@ -47,15 +48,8 @@ async function onSignin(event: FormSubmitEvent<Schema>) {
   // })
 
   if (error) {
-    console.log(error)
-    toast.add({
-      title: 'Erreur',
-      description: 'Une erreur est survenue lors de ton inscription',
-      color: 'red',
-    })
+    showErrorToast(error, 'Une erreur est survenue lors de ton inscription')
   } else {
-    console.log(data)
-
     toast.add({
       title: 'Connecté(e)',
       description: 'Que la force Orange soit avec toi !',
@@ -81,12 +75,17 @@ async function onSignin(event: FormSubmitEvent<Schema>) {
         <UInput :ui="inputStyle.ui" v-bind="inputStyle.attrs" type="password" v-model="state.password" />
       </UFormGroup>
 
-      <div class="mt-8 md:justify-center flex flex-col md:flex-row gap-8">
+      <div class="mt-8 md:justify-center flex flex-col md:flex-row gap-2 md:gap-8">
         <UButton type="submit" :disabled="loading" :loading="loading">Se Connecter</UButton>
         <UButton :to="{ name: 'SigninForgot' }" variant="ghost">Mot de passe oublié ?</UButton>
       </div>
     </UForm>
 
+    <p class="mt-8">
+      Tu n'as pas encore de compte ? alors tu peux
+      <UButton class="ml-2" to="/join" variant="outline">t'inscrire sur Force Orange</UButton>
+    </p>
+
     <!-- <p>ou bien</p>
 
     <div>