Merge pull request 'fix frontend bugs' (#19) from na/fix-frontend into master

Reviewed-on: https://gitea.fernandovideira.com/SyntaxSquad/DAEProject_Frontend/pulls/19
Reviewed-by: FernandoJVideira <[email protected]>
Reviewed-by: Afonso Clerigo Mendes de Sousa <[email protected]>

app/layouts/default.vue

@@ -165,13 +165,11 @@ import { useAuthStore } from "~/stores/auth-store.js";
 const authStore = useAuthStore();
 const router = useRouter();
 
-// State
 const isDark = ref(false);
 const isUserMenuOpen = ref(false);
 const isMobileMenuOpen = ref(false);
 const userMenuRef = ref(null);
 
-// Toggle Dark Mode
 function toggleDark() {
     isDark.value = !isDark.value;
     if (isDark.value) {
@@ -183,7 +181,6 @@ function toggleDark() {
     }
 }
 
-// Navigation Links
 const navLinks = [
     { name: 'Profile', path: '/profile' },
 ];
@@ -208,13 +205,11 @@ function closeDropdowns(event) {
 }
 
 onMounted(() => {
-    // Initialize Theme
     if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
         isDark.value = true;
         document.documentElement.classList.add('dark');
     }
 
-    // Click listener for closing dropdowns
     window.addEventListener('click', closeDropdowns);
 });
 

app/pages/auth/login.vue

@@ -53,6 +53,7 @@
 import { useAuthStore } from "~/stores/auth-store.js";
 import { storeToRefs } from "pinia";
 
+const notifications = useNotificationStore();
 const config = useRuntimeConfig();
 const api = config.public.apiBase;
 const authStore = useAuthStore();
@@ -94,8 +95,10 @@ async function handleLogin() {
           token.value = response._data.token;
           user.value = response._data.user;
           if (response._data.user.mustChangePassword === true) {
+            notifications.error("Please update your password.");
             router.push("/profile/update-password");
           } else {
+            notifications.success("Logged in successfully!");
             router.push("/");
           }
         }

app/pages/index.vue

@@ -64,8 +64,8 @@
                 <select v-model="sortBy"
                   class="bg-white dark:bg-gray-900 border dark:border-gray-800 rounded-l-lg px-3 py-2 text-xs font-bold uppercase outline-none focus:ring-1 focus:ring-blue-500 cursor-pointer border-r-0">
                   <option value="date">Date</option>
-                  <option value="votes">Rating</option>
-                  <option value="comments">Comments</option>
+                  <option value="rating">Rating</option>
+                  <option value="comment">Comments</option>
                 </select>
                 <button
                   class="bg-white dark:bg-gray-900 border dark:border-gray-800 rounded-r-lg px-3 py-2 text-xs font-bold hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
@@ -387,6 +387,7 @@ const fetchTags = async () => {
     subscribedTags.value = myTags.map(t => t.id);
   } catch (err) {
     console.error("Error fetching tags:", err);
+    notifications.error("Failed to subscribe to tag");
   }
 
 };
@@ -413,6 +414,7 @@ const toggleTagSubscription = async (tag) => {
     else subscribedTags.value.push(tag.id);
 
     console.error("Sync failed:", err);
+    notifications.error("Failed to subscribe to tag");
   }
 
 };
@@ -451,6 +453,7 @@ const loadPosts = async () => {
     }
   } catch (err) {
     console.error("Failed to fetch posts:", err);
+    notifications.error("Failed to load publications");
   } finally {
     loading.value = false;
   }
@@ -465,6 +468,7 @@ const fetchPostDetail = async (id) => {
     selectedPost.value = postDetail;
   } catch (err) {
     console.error("Failed to fetch post detail:", err);
+    notifications.error("Failed to fetch details");
   } finally {
     loading.value = false;
   }
@@ -497,6 +501,8 @@ const votePost = async (targetPost, direction) => {
       selectedPost.value.my_vote = response.my_vote;
     }
 
+    notifications.success("Voted with success");
+
   } catch (error) {
     console.error("Vote failed", error);
     notifications.error("Failed to submit vote.");
@@ -514,9 +520,9 @@ const filteredPosts = computed(() => {
   return result.sort((a, b) => {
     const modifier = sortDesc.value ? 1 : -1;
 
-    if (sortBy.value === 'votes') {
+    if (sortBy.value === 'rating') {
       return (b.rating - a.rating) * modifier;
-    } else if (sortBy.value === 'comments') {
+    } else if (sortBy.value === 'comment') {
       return (b.commentCount - a.commentCount) * modifier;
     } else {
       return (new Date(b.publicationDate).getTime() - new Date(a.publicationDate).getTime()) * modifier;