v3.0.5 (#586)

* fix(settings): harden disabled-course persistence and cross-device refresh

- always refetch user settings on mount/focus/reconnect with 60s polling
- await disabled course enable/disable persistence before showing success toast
- make settings update helpers async via mutateAsync
- update disabled-course and provider tests for async flows and refetch policy

* fix(user-settings): update mutation calls to use mutate instead of mutateAsync

* fix(course-card): prevent default event behavior on button clicks and update error handling

* fix(useDisabledCourses): add async/await to example for disabling and enabling courses

Author: devakesu

.example.env

@@ -43,7 +43,7 @@ NEXT_PUBLIC_APP_NAME=GhostClass
 # (calculate-version job). A GitHub Secret here would always be stale after
 # an auto-version bump. Keep in sync with package.json for local dev only.
 # 🔨 Build-time (auto-derived from git tag by pipeline — not a GitHub Secret)
-NEXT_PUBLIC_APP_VERSION=3.0.4
+NEXT_PUBLIC_APP_VERSION=3.0.5
 
 # ⚠️ Your production domain WITHOUT https://
 # All URL-based variables are derived from this.

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "ghostclass",
-  "version": "3.0.4",
+  "version": "3.0.5",
   "private": true,
   "engines": {
     "node": ">=22.12.0",

package.json

@@ -6,7 +6,7 @@ openapi: 3.1.0
 
 info:
   title: GhostClass API
-  version: 3.0.4
+  version: 3.0.5
   description: |
     **GhostClass API** provides endpoints for managing attendance synchronization with EzyGo.
     

public/openapi/openapi.yaml

@@ -412,7 +412,7 @@ export default function TrackingClient() {
             )}
 
             {showPinnedCourse && activeCourseMeta && (
-              <div className="fixed top-[88px] left-1/2 z-30 flex w-[min(44rem,calc(100%-2rem))] -translate-x-1/2 items-center gap-2 rounded-md border border-border/70 bg-background/96 px-3 py-2 shadow-md backdrop-blur-sm">
+              <div className="fixed top-22 left-1/2 z-30 flex w-[min(44rem,calc(100%-2rem))] -translate-x-1/2 items-center gap-2 rounded-md border border-border/70 bg-background/96 px-3 py-2 shadow-md backdrop-blur-sm">
                 <div className="rounded-md bg-primary/10 p-1.5 text-primary"><BookOpen size={16} aria-hidden="true" /></div>
                 <h3 className="text-left text-sm font-semibold text-foreground/90 capitalize">{activeCourseMeta.displayCourseName.toLowerCase()}</h3>
                 {activeCourseMeta.isDisabled && (

src/app/(protected)/tracking/TrackingClient.tsx

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { render, screen, within, fireEvent } from '@testing-library/react';
+import { render, screen, within, fireEvent, waitFor } from '@testing-library/react';
 import { CourseCard, ExtendedCourse } from '../course-card';
 import { useCourseDetails } from '@/hooks/courses/attendance';
 import { toast } from 'sonner';
@@ -294,8 +294,10 @@ describe('CourseCard', () => {
       fireEvent.click(toggle);
       const disableConfirmBtn = await screen.findByRole('button', { name: /^disable$/i });
       fireEvent.click(disableConfirmBtn);
-      expect(vi.mocked(toast.success)).toHaveBeenCalledWith('CS101 disabled', {
-        description: 'Challenge passed',
+      await waitFor(() => {
+        expect(vi.mocked(toast.success)).toHaveBeenCalledWith('CS101 disabled', {
+          description: 'Challenge passed',
+        });
       });
     });
 
@@ -314,7 +316,9 @@ describe('CourseCard', () => {
       fireEvent.click(toggle);
       const enableConfirmBtn = await screen.findByRole('button', { name: /^enable$/i });
       fireEvent.click(enableConfirmBtn);
-      expect(vi.mocked(toast.success)).toHaveBeenCalledWith('CS101 enabled');
+      await waitFor(() => {
+        expect(vi.mocked(toast.success)).toHaveBeenCalledWith('CS101 enabled');
+      });
     });
   });
 

src/components/attendance/__tests__/course-card.test.tsx

@@ -652,14 +652,19 @@ export function CourseCard({ course }: CourseCardProps) {
             <AlertDialogAction
               className="custom-button bg-red-600! hover:bg-red-700! border-none!"
               disabled={isOtherReason && !customReason.trim()}
-              onClick={() => {
+              onClick={async (event) => {
+                event.preventDefault();
                 if (!courseCode) return;
                 const reason = isOtherReason ? customReason.trim() : disableReason;
-                disableCourse(courseCode, reason);
-                setShowDisableDialog(false);
-                toast.success(`${courseCode} disabled`, {
-                  description: reason,
-                });
+                try {
+                  await disableCourse(courseCode, reason);
+                  setShowDisableDialog(false);
+                  toast.success(`${courseCode} disabled`, {
+                    description: reason,
+                  });
+                } catch {
+                  // Provider-level mutation handler already displays an error toast.
+                }
               }}
             >
               Disable
@@ -682,11 +687,16 @@ export function CourseCard({ course }: CourseCardProps) {
             <AlertDialogCancel className="custom-button">Cancel</AlertDialogCancel>
             <AlertDialogAction
               className="custom-button bg-green-600! hover:bg-green-700! border-none!"
-              onClick={() => {
+              onClick={async (event) => {
+                event.preventDefault();
                 if (!courseCode) return;
-                enableCourse(courseCode);
-                setShowEnableDialog(false);
-                toast.success(`${courseCode} enabled`);
+                try {
+                  await enableCourse(courseCode);
+                  setShowEnableDialog(false);
+                  toast.success(`${courseCode} enabled`);
+                } catch {
+                  // Provider-level mutation handler already displays an error toast.
+                }
               }}
             >
               Enable

src/components/attendance/course-card.tsx

@@ -82,13 +82,13 @@ describe("useDisabledCourses", () => {
     expect(result.current.disabledCodes.size).toBe(0);
   });
 
-  it("disableCourse calls updateDisabledCourses with correct map", () => {
+  it("disableCourse calls updateDisabledCourses with correct map", async () => {
     const { result } = renderHook(() =>
       useDisabledCourses({ academicYear: "2025-2026", semester: "even" })
     );
 
-    act(() => {
-      result.current.disableCourse("CS202", "Other reason");
+    await act(async () => {
+      await result.current.disableCourse("CS202", "Other reason");
     });
 
     expect(mockUpdateDisabledCourses).toHaveBeenCalledWith({
@@ -99,38 +99,38 @@ describe("useDisabledCourses", () => {
     });
   });
 
-  it("enableCourse removes course from map", () => {
+  it("enableCourse removes course from map", async () => {
     const { result } = renderHook(() =>
       useDisabledCourses({ academicYear: "2025-2026", semester: "even" })
     );
 
-    act(() => {
-      result.current.enableCourse("CS101");
+    await act(async () => {
+      await result.current.enableCourse("CS101");
     });
 
     // Entire semester bucket should be removed since it becomes empty
     expect(mockUpdateDisabledCourses).toHaveBeenCalledWith({});
   });
 
-  it("enableCourse is a no-op when semester key is null", () => {
+  it("enableCourse is a no-op when semester key is null", async () => {
     const { result } = renderHook(() =>
       useDisabledCourses({ academicYear: null, semester: null })
     );
 
-    act(() => {
-      result.current.enableCourse("CS101");
+    await act(async () => {
+      await result.current.enableCourse("CS101");
     });
 
     expect(mockUpdateDisabledCourses).not.toHaveBeenCalled();
   });
 
-  it("disableCourse is a no-op when semester key is null", () => {
+  it("disableCourse is a no-op when semester key is null", async () => {
     const { result } = renderHook(() =>
       useDisabledCourses({ academicYear: null, semester: null })
     );
 
-    act(() => {
-      result.current.disableCourse("CS101", "reason");
+    await act(async () => {
+      await result.current.disableCourse("CS101", "reason");
     });
 
     expect(mockUpdateDisabledCourses).not.toHaveBeenCalled();

src/hooks/courses/__tests__/useDisabledCourses.test.ts

@@ -33,9 +33,9 @@ export interface UseDisabledCoursesReturn {
   /** Get the disable reason for a course code in the current semester (or null) */
   getDisableReason: (code: string) => string | null;
   /** Disable a course code with a reason in the current semester */
-  disableCourse: (code: string, reason: string) => void;
+  disableCourse: (code: string, reason: string) => Promise<void>;
   /** Enable a previously-disabled course code in the current semester */
-  enableCourse: (code: string) => void;
+  enableCourse: (code: string) => Promise<void>;
   /** Whether the settings are still loading */
   isLoading: boolean;
 }
@@ -48,14 +48,16 @@ export interface UseDisabledCoursesReturn {
  *
  * @example
  * ```tsx
+ * async function handleCourseToggle() {
  * const { isDisabled, disableCourse, enableCourse } = useDisabledCourses({
  *   academicYear: "2025-2026",
  *   semester: "even",
  * });
  *
  * if (isDisabled("GXEST204")) { … }
- * disableCourse("GXEST204", "Challenge passed");
- * enableCourse("GXEST204");
+ * await disableCourse("GXEST204", "Challenge passed");
+ * await enableCourse("GXEST204");
+ * }
  * ```
  */
 export function useDisabledCourses({
@@ -103,18 +105,18 @@ export function useDisabledCourses({
   );
 
   const disableCourse = useCallback(
-    (code: string, reason: string) => {
+    async (code: string, reason: string) => {
       if (!semKey) return;
       const newMap: DisabledCoursesMap = structuredClone(disabledCoursesMap);
       if (!newMap[semKey]) newMap[semKey] = {};
       newMap[semKey][code.toUpperCase()] = reason;
-      updateDisabledCourses(newMap);
+      await updateDisabledCourses(newMap);
     },
     [semKey, disabledCoursesMap, updateDisabledCourses]
   );
 
   const enableCourse = useCallback(
-    (code: string) => {
+    async (code: string) => {
       if (!semKey) return;
       const newMap: DisabledCoursesMap = structuredClone(disabledCoursesMap);
       if (!newMap[semKey]) return;
@@ -130,7 +132,7 @@ export function useDisabledCourses({
       if (Object.keys(newMap[semKey]).length === 0) {
         delete newMap[semKey];
       }
-      updateDisabledCourses(newMap);
+      await updateDisabledCourses(newMap);
     },
     [semKey, disabledCoursesMap, updateDisabledCourses]
   );

src/hooks/courses/useDisabledCourses.ts

@@ -159,14 +159,14 @@ describe('UserSettingsProvider', () => {
     expect(screen.getByTestId('loading').textContent).toBe('true');
   });
 
-  it('provides isLoading=true when query is fetching', () => {
+  it('keeps isLoading=false during background fetching', () => {
     vi.mocked(useQuery).mockReturnValue({
       data: undefined,
       isLoading: false,
       isFetching: true,
     } as any);
     render(<WrappedConsumer />);
-    expect(screen.getByTestId('loading').textContent).toBe('true');
+    expect(screen.getByTestId('loading').textContent).toBe('false');
   });
 
   it('provides settings when query returns data', () => {
@@ -189,6 +189,21 @@ describe('UserSettingsProvider', () => {
     expect(screen.getByTestId('settings').textContent).toBe('no-settings');
   });
 
+  it('configures refetch policy for cross-device settings sync', () => {
+    render(<WrappedConsumer />);
+
+    const firstCallArgs = vi.mocked(useQuery).mock.calls[0]?.[0] as unknown as
+      | Record<string, unknown>
+      | undefined;
+
+    expect(firstCallArgs).toBeDefined();
+    expect(firstCallArgs?.refetchOnMount).toBe('always');
+    expect(firstCallArgs?.refetchOnWindowFocus).toBe('always');
+    expect(firstCallArgs?.refetchOnReconnect).toBe('always');
+    expect(firstCallArgs?.refetchInterval).toBe(60 * 1000);
+    expect(firstCallArgs?.refetchIntervalInBackground).toBe(false);
+  });
+
   describe('useUserSettings guard', () => {
     it('throws when used outside provider', () => {
       const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
@@ -242,7 +257,7 @@ describe('UserSettingsProvider', () => {
         </UserSettingsProvider>
       );
       screen.getByRole('button').click();
-      expect(mockMutate).toHaveBeenCalledWith({ disabled_courses: map });
+      expect(mockMutateAsync).toHaveBeenCalledWith({ disabled_courses: map });
     });
   });