From b3da2c54f40ff4d11c80ebe2cbd1e290dcd2c0b2 Mon Sep 17 00:00:00 2001
From: Opey Adeyemi <60050089+Opeyem1a@users.noreply.github.com>
Date: Sun, 25 Aug 2024 21:54:06 -0600
Subject: [PATCH] refetch onboarding data after actions (#61)

---
 .../(components)/SetupStepDetailCard.tsx      |  3 +-
 .../setup/(hooks)/useSetupSteps.tsx           | 33 +++++++++++++++----
 .../students/(hooks)/useStudents.tsx          |  2 +-
 .../use-import-student-gradebook-data.ts      |  2 +-
 4 files changed, 30 insertions(+), 10 deletions(-)

diff --git a/src/app/(app)/course/[courseId]/setup/(components)/SetupStepDetailCard.tsx b/src/app/(app)/course/[courseId]/setup/(components)/SetupStepDetailCard.tsx
index a40669a..229eb7a 100644
--- a/src/app/(app)/course/[courseId]/setup/(components)/SetupStepDetailCard.tsx
+++ b/src/app/(app)/course/[courseId]/setup/(components)/SetupStepDetailCard.tsx
@@ -7,6 +7,7 @@ import { Button } from "@/components/ui/button"
 export interface Action {
   onClick: () => void;
   content: ReactNode;
+  loading: boolean;
 }
 
 export interface StepDefinition {
@@ -46,7 +47,7 @@ export const SetupStepDetailCard = ({ steps }: StepDetailCardProps) => {
         </div>
         <div className="flex gap-2 flex-wrap">
           {selectedStep.action && (
-            <Button onClick={selectedStep.action.onClick}>
+            <Button onClick={selectedStep.action.onClick} disabled={selectedStep.action.loading}>
               {selectedStep.action.content}
             </Button>
           )}
diff --git a/src/app/(app)/course/[courseId]/setup/(hooks)/useSetupSteps.tsx b/src/app/(app)/course/[courseId]/setup/(hooks)/useSetupSteps.tsx
index 26d5f89..a77134a 100644
--- a/src/app/(app)/course/[courseId]/setup/(hooks)/useSetupSteps.tsx
+++ b/src/app/(app)/course/[courseId]/setup/(hooks)/useSetupSteps.tsx
@@ -18,11 +18,18 @@ interface UseSetupStepsReturnType {
 }
 
 export const useSetupSteps = (): UseSetupStepsReturnType => {
-  const { data, isLoading } = useOnboardingProgress()
+  const { data, isLoading, refetch } = useOnboardingProgress()
 
-  const { importStudentsFromLmsAsync } = useImportStudentsFromLms()
-  const { importStudentGradebookData } = useImportStudentGradebookData()
-  const { generateTeamsAsync } = useGenerateTeams()
+  const {
+    importStudentsFromLmsAsync,
+    isPending: importStudentsFromLmsPending,
+  } = useImportStudentsFromLms()
+  const {
+    importStudentGradebookDataAsync,
+    isPending: importStudentGradebookDataPending,
+  } = useImportStudentGradebookData()
+  const { generateTeamsAsync, isPending: generateTeamsPending } =
+    useGenerateTeams()
 
   if (!data || isLoading) {
     return {
@@ -37,15 +44,27 @@ export const useSetupSteps = (): UseSetupStepsReturnType => {
   const actions: Partial<Record<StepKey, Action>> = {
     IMPORT_STUDENTS: {
       content: "Import students",
-      onClick: () => importStudentsFromLmsAsync(undefined),
+      onClick: async () => {
+        await importStudentsFromLmsAsync(undefined)
+        await refetch()
+      },
+      loading: importStudentsFromLmsPending,
     },
     STUDENT_DATA: {
       content: "Import gradebook data",
-      onClick: () => importStudentGradebookData(undefined),
+      onClick: async () => {
+        await importStudentGradebookDataAsync(undefined)
+        await refetch()
+      },
+      loading: importStudentGradebookDataPending,
     },
     GENERATE_TEAMS: {
       content: "Generate teams",
-      onClick: () => generateTeamsAsync(undefined),
+      onClick: async () => {
+        await generateTeamsAsync(undefined)
+        await refetch()
+      },
+      loading: generateTeamsPending,
     },
   }
 
diff --git a/src/app/(app)/course/[courseId]/students/(hooks)/useStudents.tsx b/src/app/(app)/course/[courseId]/students/(hooks)/useStudents.tsx
index 1a0715c..6a6f92c 100644
--- a/src/app/(app)/course/[courseId]/students/(hooks)/useStudents.tsx
+++ b/src/app/(app)/course/[courseId]/students/(hooks)/useStudents.tsx
@@ -107,7 +107,7 @@ const useStudentsProvider = (): StudentsContextType => {
     const queryString = createQueryString(queryStringParams)
     const fetchStudents = async () => {
       try {
-        const courseMemberResponse = await fetch(`${process.env.BACKEND_BASE_URI}/api/v1/course-members/course/${courseId}/?${queryString}`,)
+        const courseMemberResponse = await fetch(`${process.env.BACKEND_BASE_URI}/api/v1/course/${courseId}/students?${queryString}`,)
         const courseMemberData = await courseMemberResponse.json()
         const studentsToDisplay: Student[] = courseMemberData.results.map((member: any) => ({
           id: member.user.id,
diff --git a/src/hooks/use-import-student-gradebook-data.ts b/src/hooks/use-import-student-gradebook-data.ts
index f247922..a4fa156 100644
--- a/src/hooks/use-import-student-gradebook-data.ts
+++ b/src/hooks/use-import-student-gradebook-data.ts
@@ -32,7 +32,7 @@ export const useImportStudentGradebookData = () => {
   })
 
   return {
-    importStudentGradebookData: mutation.mutateAsync,
+    importStudentGradebookDataAsync: mutation.mutateAsync,
     ...mutation,
   }
 }