fix frontend bugs #19

Merged
Edd merged 2 commits from na/fix-frontend into master 2026-01-26 22:01:32 +00:00
3 changed files with 13 additions and 9 deletions
Showing only changes of commit 29ebda9b18 - Show all commits
-5
View File
@@ -165,13 +165,11 @@ import { useAuthStore } from "~/stores/auth-store.js";
const authStore = useAuthStore(); const authStore = useAuthStore();
const router = useRouter(); const router = useRouter();
// State
const isDark = ref(false); const isDark = ref(false);
const isUserMenuOpen = ref(false); const isUserMenuOpen = ref(false);
const isMobileMenuOpen = ref(false); const isMobileMenuOpen = ref(false);
const userMenuRef = ref(null); const userMenuRef = ref(null);
// Toggle Dark Mode
function toggleDark() { function toggleDark() {
isDark.value = !isDark.value; isDark.value = !isDark.value;
if (isDark.value) { if (isDark.value) {
@@ -183,7 +181,6 @@ function toggleDark() {
} }
} }
// Navigation Links
const navLinks = [ const navLinks = [
{ name: 'Profile', path: '/profile' }, { name: 'Profile', path: '/profile' },
]; ];
@@ -208,13 +205,11 @@ function closeDropdowns(event) {
} }
onMounted(() => { onMounted(() => {
// Initialize Theme
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) { if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
isDark.value = true; isDark.value = true;
document.documentElement.classList.add('dark'); document.documentElement.classList.add('dark');
} }
// Click listener for closing dropdowns
window.addEventListener('click', closeDropdowns); window.addEventListener('click', closeDropdowns);
}); });
+3
View File
@@ -53,6 +53,7 @@
import { useAuthStore } from "~/stores/auth-store.js"; import { useAuthStore } from "~/stores/auth-store.js";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
const notifications = useNotificationStore();
const config = useRuntimeConfig(); const config = useRuntimeConfig();
const api = config.public.apiBase; const api = config.public.apiBase;
const authStore = useAuthStore(); const authStore = useAuthStore();
@@ -94,8 +95,10 @@ async function handleLogin() {
token.value = response._data.token; token.value = response._data.token;
user.value = response._data.user; user.value = response._data.user;
if (response._data.user.mustChangePassword === true) { if (response._data.user.mustChangePassword === true) {
notifications.error("Please update your password.");
router.push("/profile/update-password"); router.push("/profile/update-password");
} else { } else {
notifications.success("Logged in successfully!");
router.push("/"); router.push("/");
} }
} }
+10 -4
View File
@@ -64,8 +64,8 @@
<select v-model="sortBy" <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"> 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="date">Date</option>
<option value="votes">Rating</option> <option value="rating">Rating</option>
<option value="comments">Comments</option> <option value="comment">Comments</option>
</select> </select>
<button <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" 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); subscribedTags.value = myTags.map(t => t.id);
} catch (err) { } catch (err) {
console.error("Error fetching tags:", 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); else subscribedTags.value.push(tag.id);
console.error("Sync failed:", err); console.error("Sync failed:", err);
notifications.error("Failed to subscribe to tag");
} }
}; };
@@ -451,6 +453,7 @@ const loadPosts = async () => {
} }
} catch (err) { } catch (err) {
console.error("Failed to fetch posts:", err); console.error("Failed to fetch posts:", err);
notifications.error("Failed to load publications");
} finally { } finally {
loading.value = false; loading.value = false;
} }
@@ -465,6 +468,7 @@ const fetchPostDetail = async (id) => {
selectedPost.value = postDetail; selectedPost.value = postDetail;
} catch (err) { } catch (err) {
console.error("Failed to fetch post detail:", err); console.error("Failed to fetch post detail:", err);
notifications.error("Failed to fetch details");
} finally { } finally {
loading.value = false; loading.value = false;
} }
@@ -497,6 +501,8 @@ const votePost = async (targetPost, direction) => {
selectedPost.value.my_vote = response.my_vote; selectedPost.value.my_vote = response.my_vote;
} }
notifications.success("Voted with success");
} catch (error) { } catch (error) {
console.error("Vote failed", error); console.error("Vote failed", error);
notifications.error("Failed to submit vote."); notifications.error("Failed to submit vote.");
@@ -514,9 +520,9 @@ const filteredPosts = computed(() => {
return result.sort((a, b) => { return result.sort((a, b) => {
const modifier = sortDesc.value ? 1 : -1; const modifier = sortDesc.value ? 1 : -1;
if (sortBy.value === 'votes') { if (sortBy.value === 'rating') {
return (b.rating - a.rating) * modifier; return (b.rating - a.rating) * modifier;
} else if (sortBy.value === 'comments') { } else if (sortBy.value === 'comment') {
return (b.commentCount - a.commentCount) * modifier; return (b.commentCount - a.commentCount) * modifier;
} else { } else {
return (new Date(b.publicationDate).getTime() - new Date(a.publicationDate).getTime()) * modifier; return (new Date(b.publicationDate).getTime() - new Date(a.publicationDate).getTime()) * modifier;