Class data isolation

app/composables/useCoach.ts

@@ -5,9 +5,20 @@ import utc from 'dayjs/plugin/utc'
 
 dayjs.extend(utc)
 export const useCoach = () => {
+  const { classId } = useSelectedClass()
   const callFormApi = async <T>(method: 'GET' | 'POST' | 'PUT' | 'DELETE', params: Record<string, unknown> = {}, body?: Record<string, unknown>): Promise<T> => {
+    if (!classId.value) {
+      throw new Error('Select a class before managing forms')
+    }
+
+    const scopedParams = {
+      ...params,
+      ...(method === 'DELETE' ? body : {}),
+      classId: classId.value,
+    }
+    const scopedBody = { ...body, classId: classId.value }
     const queryString = method === 'GET' || method === 'DELETE'
-      ? `?${new URLSearchParams(Object.entries(params).reduce((acc, [key, value]) => {
+      ? `?${new URLSearchParams(Object.entries(scopedParams).reduce((acc, [key, value]) => {
           if (value !== undefined && value !== null) {
             acc[key] = String(value)
           }
@@ -18,7 +29,7 @@ export const useCoach = () => {
 
     return await $fetch<T>(`/api/form${queryString}`, {
       method,
-      body: method === 'GET' ? undefined : body,
+      body: method === 'GET' || method === 'DELETE' ? undefined : scopedBody,
     })
   }
 
@@ -215,6 +226,11 @@ export const useCoach = () => {
   )
 
   const loadPublishedForms = async () => {
+    if (!classId.value) {
+      publishedForms.value = []
+      return
+    }
+
     try {
       const forms = await callFormApi<any[]>('GET', {
         action: 'listForms',
@@ -227,6 +243,12 @@ export const useCoach = () => {
   }
 
   const syncGroupRangeFromWeeklyDate = async () => {
+    if (!classId.value) {
+      historyGroupStartDate.value = ''
+      historyGroupEndDate.value = ''
+      return
+    }
+
     if (!historyWeekStart.value) {
       historyGroupStartDate.value = ''
       historyGroupEndDate.value = ''
@@ -262,8 +284,11 @@ export const useCoach = () => {
   }
 
   watch(
-    historyWeekStart,
+    [historyWeekStart, classId],
     async () => {
+      publishedForms.value = []
+      selectedFormDetails.value = null
+      editingFormId.value = null
       await syncGroupRangeFromWeeklyDate()
       await loadPublishedForms()
     },
@@ -433,7 +458,7 @@ export const useCoach = () => {
     questions.value     = JSON.parse(JSON.stringify(form.questions))
     editingFormId.value = form.id
     builderSubTab.value = 'creation'
-    navigateTo('/coach/builder')
+    navigateTo({ path: '/coach/builder', query: { class: classId.value } })
   }
 
   const toggleFormPublish = async (form: any) => {
@@ -442,9 +467,10 @@ export const useCoach = () => {
     form.status = form.status === 'Active' ? 'Unpublished' : 'Active'
     const newStatus = form.status === 'Active' ? true : false
 
-    await useFetch(`/api/form/${form.id}`, {
-      method: 'PUT',
-      body: {published: newStatus}
+    await callFormApi('PUT', {}, {
+      action: 'updateForm',
+      id: form.id,
+      published: newStatus,
     })
   }
 
@@ -453,11 +479,45 @@ export const useCoach = () => {
   }
 
   // ── Students / Progress ──
-  const students = useState<any[]>('coachStudents', () => [
-    { id: 1, name: 'Aiden Smith', initials: 'AS', email: 'aiden@school.edu', tickets: 12, streak: 4, lastActive: '2 hours ago' },
-    { id: 2, name: 'Nevin Kumar', initials: 'NK', email: 'nevin@school.edu', tickets: 14, streak: 5, lastActive: 'Just now'     },
-    { id: 3, name: 'Swarna Jay',  initials: 'SJ', email: 'swarna@school.edu',tickets: 8,  streak: 2, lastActive: 'Yesterday'   },
-  ])
+  const students = useState<any[]>('coachStudents', () => [])
+
+  const loadStudents = async () => {
+    if (!classId.value) {
+      students.value = []
+      return
+    }
+
+    const classStudents = await $fetch<Array<{ id: number; name: string; exp: number }>>(
+      `/api/admin/classes/${classId.value}/students`
+    )
+
+    students.value = classStudents.map((student) => ({
+      ...student,
+      initials: student.name
+        .split(/\s+/)
+        .filter(Boolean)
+        .slice(0, 2)
+        .map((part) => part[0]?.toUpperCase())
+        .join(''),
+      tickets: student.exp,
+      streak: 0,
+      lastActive: '',
+    }))
+  }
+
+  watch(
+    classId,
+    async () => {
+      students.value = []
+
+      try {
+        await loadStudents()
+      } catch (error) {
+        console.error('Failed to load class students', error)
+      }
+    },
+    { immediate: true }
+  )
 
   const searchStudent = useState('searchStudent', () => '')
   const sortStudent   = useState('sortStudent',   () => 'tickets')

app/composables/useCurrentFormGroup.ts

@@ -29,17 +29,26 @@ export const useCurrentFormGroup = () => {
     try {
       const formGroupAPIResponse = await $fetch<FormGroup | FormGroup[]>('/api/formGroup?active=true')
 
-      const activeFg = Array.isArray(formGroupAPIResponse) ? formGroupAPIResponse[0] : formGroupAPIResponse
+      const activeFormGroups = Array.isArray(formGroupAPIResponse)
+        ? formGroupAPIResponse
+        : formGroupAPIResponse
+          ? [formGroupAPIResponse]
+          : []
+      const activeFg = activeFormGroups[0]
 
       if (activeFg) {
         FormGroup.value.activeFormGroup = activeFg
 
         try {
-          const formsAPIResponse = await $fetch<Form[]>('/api/form', {
-            query: { action: 'getOnlyActiveFormsinGroup', formGroup: activeFg.id }
-          })
+          const formResponses = await Promise.all(
+            activeFormGroups.map((formGroup) =>
+              $fetch<Form[]>('/api/form', {
+                query: { action: 'getOnlyActiveFormsinGroup', formGroup: formGroup.id }
+              })
+            )
+          )
 
-          FormGroup.value.forms = Array.isArray(formsAPIResponse) ? formsAPIResponse : []
+          FormGroup.value.forms = formResponses.flat()
 
           // Load form components for each form in parallel
           FormGroup.value.formComponents = {}
@@ -72,4 +81,4 @@ export const useCurrentFormGroup = () => {
     loadFormComponents,
     totalFormsInGroup
   }
-}
+}

app/composables/useRaffleSpin.ts

@@ -1,5 +1,6 @@
 import type { Student, FormGroup, Form, FormSubmission } from '~~/prisma/generated/client'
 export const useRaffleSpin = () => {
+  const { classId } = useSelectedClass()
 
   const raffleWeekStart = ref<Date | string>(new Date())
 
@@ -10,9 +11,17 @@ export const useRaffleSpin = () => {
   const spinCount = ref(0)
 
   const loadRaffleFormGroup = async () => {
+    if (!classId.value) {
+      raffleFormGroup.value = null
+      return
+    }
+
     const val = raffleWeekStart.value
     const dateStr = val instanceof Date ? val.toISOString().split('T')[0] : String(val).split('T')[0]
-    const data = await $fetch<FormGroup>(`/api/formGroup?date=${dateStr}`, { method: 'GET' })
+    const data = await $fetch<FormGroup>('/api/formGroup', {
+      method: 'GET',
+      query: { date: dateStr, classId: classId.value },
+    })
     raffleFormGroup.value = data || null
   }
 
@@ -21,7 +30,14 @@ export const useRaffleSpin = () => {
       raffleForms.value = []
       return
     }
-    const data = await $fetch<Form[]>(`/api/form?action=listForms&formGroup=${raffleFormGroup.value.id}`, { method: 'GET' })
+    const data = await $fetch<Form[]>('/api/form', {
+      method: 'GET',
+      query: {
+        action: 'listForms',
+        formGroup: raffleFormGroup.value.id,
+        classId: classId.value,
+      },
+    })
     raffleForms.value = data || []
   }
 
@@ -30,7 +46,10 @@ export const useRaffleSpin = () => {
       raffleSubmissions.value = []
       return
     }
-    const data = await $fetch<FormSubmission[]>(`/api/formSubmission?formGroup=${raffleFormGroup.value.id}`, { method: 'GET' })
+    const data = await $fetch<FormSubmission[]>('/api/formSubmission', {
+      method: 'GET',
+      query: { formGroup: raffleFormGroup.value.id, classId: classId.value },
+    })
     raffleSubmissions.value = data || []
   }
 
@@ -63,7 +82,8 @@ export const useRaffleSpin = () => {
         method: 'PUT',
         body: {
           id: raffleFormGroup.value.id,
-          raffleWinner: studentId
+          raffleWinner: studentId,
+          classId: classId.value,
         }
       })
       await loadRaffleData()
@@ -73,6 +93,14 @@ export const useRaffleSpin = () => {
     }
   }
 
+  watch(classId, async () => {
+    raffleFormGroup.value = null
+    raffleForms.value = []
+    raffleSubmissions.value = []
+    raffleWinner.value = null
+    await loadRaffleData()
+  })
+
   return {
     raffleWinner,
     raffleFormGroup,
@@ -83,4 +111,4 @@ export const useRaffleSpin = () => {
     loadRaffleData,
     spinCount
   }
-}
+}

app/composables/useSelectedClass.ts

@@ -0,0 +1,18 @@
+export const useSelectedClass = () => {
+  const route = useRoute()
+  const storedClassId = useCookie<string | null>('selected-class-token', {
+    sameSite: 'lax',
+  })
+
+  const classId = computed(() => {
+    const queryClassId = route.query.class
+    const normalizedQueryClassId = Array.isArray(queryClassId) ? queryClassId[0] : queryClassId
+
+    return normalizedQueryClassId || storedClassId.value || null
+  })
+
+  return {
+    classId,
+    storedClassId,
+  }
+}

app/layouts/coach.vue

@@ -1,12 +1,9 @@
 <!-- layouts/coach.vue -->
 <script setup lang="ts">
-import { authClient } from '~/utils/auth-client'
-
 const route = useRoute()
 const selectedClassToken = useCookie<string | null>('selected-class-token', {
   sameSite: 'lax',
 })
-
 const routeClassToken = computed(() => {
   const classQuery = route.query.class
   return Array.isArray(classQuery) ? classQuery[0] : classQuery
@@ -26,18 +23,6 @@ function navigateWithinClass(path: string) {
     query: classToken ? { class: classToken } : {},
   })
 }
-
-async function logout() {
-  const confirmed = confirm('Are you sure you want to log out?')
-  if (!confirmed) return
-
-  try {
-    await authClient.signOut()
-    window.location.href = '/auth'
-  } catch (error) {
-    console.error('Logout failed:', error)
-  }
-}
 </script>
 
 <template>
@@ -64,7 +49,7 @@ async function logout() {
 
       <div class="rh-sidebar-footer">
         <NuxtLink to="/" class="rh-back-link">← Back to Portal</NuxtLink>
-        <button class="rh-logout-link" @click="logout">⎋ Logout</button>
+        <LogoutButton class="rh-logout-link" />
       </div>
     </aside>
 

app/middleware/auth.global.ts

@@ -19,6 +19,12 @@ export default defineNuxtRouteMiddleware(async (to) => {
   }
 
   if (to.path === '/auth') {
+    const requestedRole = Array.isArray(to.query.role) ? to.query.role[0] : to.query.role
+
+    if (requestedRole === 'reader') {
+      return navigateTo('/reader')
+    }
+
     if (userRole === 'admin') {
       return navigateTo('/admin')
     }
@@ -37,7 +43,6 @@ export default defineNuxtRouteMiddleware(async (to) => {
   if (isCoachRoute && userRole !== 'admin' && userRole !== 'coach') {
     return navigateTo('/reader/profile')
   }
-
   if (isCoachRoute && to.path !== '/coach/create-class' && userRole === 'coach') {
     const requestFetch = useRequestFetch()
     const classes = await requestFetch<Array<{ joinToken: string }>>('/api/admin/classes')