Switch from token to cookie auth

Seasoned.Frontend/app/pages/gallery.vue

@@ -197,25 +197,17 @@ const showDetails = ref(false)
 const selectedRecipe = ref(null)
 const isEditing = ref(false)
 const originalRecipe = ref(null)
+const config = useRuntimeConfig()
 
 onMounted(async () => {
   await fetchRecipes()
 })
 
 const fetchRecipes = async () => {
-  const token = useCookie('seasoned_token').value 
-                || (import.meta.client ? localStorage.getItem('token') : null)
-
-  if (!token) {
-    return navigateTo('/login')
-  }
-
   try {
     loading.value = true
     const data = await $fetch(`${config.public.apiBase}api/recipe/my-collection`, {
-      headers: {
-        'Authorization': `Bearer ${token}`
-      }
+      credentials: 'include' 
     })
     recipes.value = data
   } catch (err) {
@@ -234,34 +226,38 @@ const openRecipe = (recipe) => {
 }
 
 const editRecipe = (recipe) => {
+  originalRecipe.value = JSON.parse(JSON.stringify(recipe)) 
   selectedRecipe.value = { ...recipe }
-  originalRecipe.value = { ...recipe }
   isEditing.value = true
   showDetails.value = true
 }
 
 const closeDetails = () => {
+  if (isEditing.value && originalRecipe.value) {
+    const index = recipes.value.findIndex(r => r.id === originalRecipe.value.id)
+    if (index !== -1) {
+      recipes.value[index] = originalRecipe.value
+    }
+  }
+  
   showDetails.value = false
   isEditing.value = false
+  originalRecipe.value = null
 }
 
 const saveChanges = async () => {
-  const token = useCookie('seasoned_token').value
-
-  try {
+ try {
     await $fetch(`${config.public.apiBase}api/recipe/update/${selectedRecipe.value.id}`, {
       method: 'PUT',
-      headers: { 'Authorization': `Bearer ${token}` },
+      credentials: 'include',
       body: selectedRecipe.value
     })
 
     await fetchRecipes()
-    
-    isEditing.value = false
-    showDetails.value = false
+    closeDetails()
   } catch (e) {
     console.error("Failed to update recipe:", e)
-    alert("Could not save changes. Please try again.")
+    alert("Could not save changes. Your session might have expired.")
   }
 }
 
@@ -297,12 +293,13 @@ const saveChanges = async () => {
   //showDetails.value = false
 //}
 
-const getRecipeIcon = (title) => {
-  const t = title.toLowerCase()
+const getRecipeIcon = (recipe) => {
   if (recipe.icon) return recipe.icon
+  const t = (recipe.title || '').toLowerCase()
   if (t.includes('cake') || t.includes('cookie') || t.includes('dessert')) return 'mdi-cookie'
   if (t.includes('soup') || t.includes('stew')) return 'mdi-bowl-mix'
   if (t.includes('drink') || t.includes('cocktail')) return 'mdi-glass-cocktail'
+  
   return 'mdi-silverware-fork-knife'
 }
 </script>

Seasoned.Frontend/app/pages/index.vue

@@ -144,11 +144,15 @@ const isDragging = ref(false)
 const saving = ref(false)
 const hasSaved = ref(false)
 
-const isAuthenticated = () => {
-  if (import.meta.client) {
-    return !!localStorage.getItem('token');
+const isAuthenticated = async () => {
+ try {
+    await $fetch('/api/auth/manage/info', {
+      credentials: 'include'
+    })
+    return true
+  } catch {
+    return false
   }
-  return false;
 }
 
 const handleViewCollection = () => {
@@ -196,7 +200,6 @@ const uploadImage = async () => {
 const saveToCollection = async () => {
   if (!recipe.value || hasSaved.value) return;
 
-  // 1. Get the token (same logic as gallery)
   const token = useCookie('seasoned_token').value 
                 || (import.meta.client ? localStorage.getItem('token') : null)
 
@@ -210,9 +213,6 @@ const saveToCollection = async () => {
   try {
     await $fetch(`${config.public.apiBase}api/recipe/save`, {
       method: 'POST',
-      headers: {
-        'Authorization': `Bearer ${token}`
-      },
       body: recipe.value
     });
     hasSaved.value = true;

Seasoned.Frontend/app/pages/login.vue

@@ -72,7 +72,7 @@ const handleAuth = async () => {
   const endpoint = isLogin.value ? 'api/auth/login' : 'api/auth/register'
   
   const url = isLogin.value 
-    ? `${config.public.apiBase}${endpoint}?useCookies=false` 
+    ? `${config.public.apiBase}${endpoint}?useCookies=true` 
     : `${config.public.apiBase}${endpoint}`
 
   try {
@@ -80,33 +80,16 @@ const handleAuth = async () => {
       method: 'POST',
       body: {
         email: email.value,
-        userName: email.value,
         password: password.value
       }
     })
 
     if (isLogin.value) {
-      if (response.accessToken) {
-
-        const tokenCookie = useCookie('seasoned_token', { maxAge: response.expiresIn })
-        tokenCookie.value = response.accessToken
-
-        if (import.meta.client) {
-          localStorage.setItem('token', response.accessToken)
-        }
-
-        navigateTo('/gallery')
-      }
-    } else {
-      alert("Account created successfully! Please sign in to open your ledger.")
-      isLogin.value = true
+      navigateTo('/gallery')
+    
     }
   } catch (err) {
-    const errorDetail = err.data?.errors 
-      ? Object.values(err.data.errors).flat().join('\n') 
-      : "Check your credentials and try again."
-    
-    alert(`Authentication failed:\n${errorDetail}`)
+    alert("Authentication failed. Check your credentials.")
   }
 }
 </script>