refactor: improve perf on the frontend

apps/web/app/orgs/[orgslug]/(withmenu)/course/[courseuuid]/activity/[activityid]/activity.tsx

@@ -499,6 +499,7 @@ function ActivityChapterDropdown(props: {
                       <Link
                         key={activity.id}
                         href={getUriWithOrg(props.orgslug, '') + `/course/${cleanCourseUuid}/activity/${cleanActivityUuid}`}
+                        prefetch={false}
                         onClick={() => setIsOpen(false)}
                       >
                         <div 

apps/web/app/orgs/[orgslug]/(withmenu)/course/[courseuuid]/activity/[activityid]/page.tsx

@@ -11,25 +11,36 @@ type MetadataProps = {
   searchParams: Promise<{ [key: string]: string | string[] | undefined }>
 }
 
+type Session = {
+  tokens?: {
+    access_token?: string
+  }
+}
+
+// Add this function at the top level to avoid duplicate fetches
+async function fetchCourseMetadata(courseuuid: string, access_token: string | null | undefined) {
+  return await getCourseMetadata(
+    courseuuid,
+    { revalidate: 1800, tags: ['courses'] },
+    access_token || null
+  )
+}
+
 export async function generateMetadata(props: MetadataProps): Promise<Metadata> {
   const params = await props.params;
-  const session = await getServerSession(nextAuthOptions)
-  const access_token = session?.tokens?.access_token
+  const session = await getServerSession(nextAuthOptions as any) as Session
+  const access_token = session?.tokens?.access_token || null
 
   // Get Org context information
   const org = await getOrganizationContextInfo(params.orgslug, {
     revalidate: 1800,
     tags: ['organizations'],
   })
-  const course_meta = await getCourseMetadata(
-    params.courseuuid,
-    { revalidate: 0, tags: ['courses'] },
-    access_token ? access_token : null
-  )
+  const course_meta = await fetchCourseMetadata(params.courseuuid, access_token)
   const activity = await getActivityWithAuthHeader(
     params.activityid,
-    { revalidate: 0, tags: ['activities'] },
-    access_token ? access_token : null
+    { revalidate: 1800, tags: ['activities'] },
+    access_token || null
   )
 
   // SEO
@@ -57,32 +68,29 @@ export async function generateMetadata(props: MetadataProps): Promise<Metadata>
 }
 
 const ActivityPage = async (params: any) => {
-  const session = await getServerSession(nextAuthOptions)
-  const access_token = session?.tokens?.access_token
+  const session = await getServerSession(nextAuthOptions as any) as Session
+  const access_token = session?.tokens?.access_token || null
   const activityid = (await params.params).activityid
   const courseuuid = (await params.params).courseuuid
   const orgslug = (await params.params).orgslug
 
-  const course_meta = await getCourseMetadata(
-    courseuuid,
-    { revalidate: 0, tags: ['courses'] },
-    access_token ? access_token : null
-  )
-  const activity = await getActivityWithAuthHeader(
-    activityid,
-    { revalidate: 0, tags: ['activities'] },
-    access_token ? access_token : null
-  )
+  const [course_meta, activity] = await Promise.all([
+    fetchCourseMetadata(courseuuid, access_token),
+    getActivityWithAuthHeader(
+      activityid,
+      { revalidate: 1800, tags: ['activities'] },
+      access_token || null
+    )
+  ])
+
   return (
-    <>
-      <ActivityClient
-        activityid={activityid}
-        courseuuid={courseuuid}
-        orgslug={orgslug}
-        activity={activity}
-        course={course_meta}
-      />
-    </>
+    <ActivityClient
+      activityid={activityid}
+      courseuuid={courseuuid}
+      orgslug={orgslug}
+      activity={activity}
+      course={course_meta}
+    />
   )
 }
 

apps/web/app/orgs/[orgslug]/(withmenu)/course/[courseuuid]/course.tsx

@@ -223,6 +223,7 @@ const CourseClient = (props: any) => {
                                       )}`
                                     }
                                     rel="noopener noreferrer"
+                                    prefetch={false}
                                   >
                                     <p>{activity.name}</p>
                                   </Link>
@@ -240,6 +241,7 @@ const CourseClient = (props: any) => {
                                               )}`
                                             }
                                             rel="noopener noreferrer"
+                                            prefetch={false}
                                           >
                                             <div className="text-xs bg-gray-100 text-gray-400 font-bold px-2 py-1 rounded-full flex space-x-1 items-center">
                                               <p>Page</p>
@@ -260,6 +262,7 @@ const CourseClient = (props: any) => {
                                             )}`
                                           }
                                           rel="noopener noreferrer"
+                                          prefetch={false}
                                         >
                                           <div className="text-xs bg-gray-100 text-gray-400 font-bold px-2 py-1 rounded-full flex space-x-1 items-center">
                                             <p>Video</p>
@@ -281,6 +284,7 @@ const CourseClient = (props: any) => {
                                               )}`
                                             }
                                             rel="noopener noreferrer"
+                                            prefetch={false}
                                           >
                                             <div className="text-xs bg-gray-100 text-gray-400 font-bold px-2 py-1 rounded-full flex space-x-1 items-center">
                                               <p>Document</p>
@@ -302,6 +306,7 @@ const CourseClient = (props: any) => {
                                               )}`
                                             }
                                             rel="noopener noreferrer"
+                                            prefetch={false}
                                           >
                                             <div className="text-xs bg-gray-100 text-gray-400 font-bold px-2 py-1 rounded-full flex space-x-1 items-center">
                                               <p>Assignment</p>

apps/web/app/orgs/[orgslug]/(withmenu)/course/[courseuuid]/page.tsx

@@ -24,7 +24,7 @@ export async function generateMetadata(props: MetadataProps): Promise<Metadata>
   })
   const course_meta = await getCourseMetadata(
     params.courseuuid,
-    { revalidate: 0, tags: ['courses'] },
+    { revalidate: 1800, tags: ['courses'] },
     access_token ? access_token : null
   )
 
@@ -66,24 +66,23 @@ export async function generateMetadata(props: MetadataProps): Promise<Metadata>
 }
 
 const CoursePage = async (params: any) => {
-  const courseuuid = (await params.params).courseuuid
-  const orgslug = (await params.params).orgslug
   const session = await getServerSession(nextAuthOptions)
   const access_token = session?.tokens?.access_token
+
+  // Fetch course metadata once
   const course_meta = await getCourseMetadata(
-    courseuuid,
-    { revalidate: 0, tags: ['courses'] },
+    params.params.courseuuid,
+    { revalidate: 1800, tags: ['courses'] },
     access_token ? access_token : null
   )
 
   return (
-    <div>
-      <CourseClient
-        courseuuid={courseuuid}
-        orgslug={orgslug}
-        course={course_meta}
-      />
-    </div>
+    <CourseClient
+      courseuuid={params.params.courseuuid}
+      orgslug={params.params.orgslug}
+      course={course_meta}
+      access_token={access_token}
+    />
   )
 }