chore: cleaner way to implement redirect if role permission denied

apps/dashboard/src/lib/components/RoleBasedSecurity/index.svelte

@@ -4,6 +4,7 @@
   import type { GroupPerson } from '$lib/utils/types';
 
   export let allowedRoles: number[] = [];
+  export let onDenied = () => {};
 
   let userRole: number = 0;
 
@@ -11,6 +12,10 @@
     const user: GroupPerson = $group.people.find((person) => person.profile_id === $profile.id)!;
 
     userRole = user ? user.role_id : userRole;
+
+    if ($group.people.length && !allowedRoles.includes(userRole)) {
+      onDenied();
+    }
   }
 </script>
 

apps/dashboard/src/lib/utils/redirect.ts

@@ -1,11 +0,0 @@
-import { goto } from '$app/navigation';
-import { globalStore } from '$lib/utils/store/app';
-import { get } from 'svelte/store';
-
-export function redirectToLesson(settings, courseId) {
-  const globalStoreVal = get(globalStore);
-
-  if (!settings && globalStoreVal.isOrgSite) {
-    goto(`${courseId}/lessons?next=true`);
-  }
-}

apps/dashboard/src/routes/courses/[id]/+page.svelte

@@ -30,9 +30,10 @@
     triggerSendEmail
   } from '$lib/utils/services/notification/notification';
   import NewsFeedLoader from '$lib/components/Course/components/NewsFeed/NewsFeedLoader.svelte';
-  import { t } from '$lib/utils/functions/translations.js';
+  import { t } from '$lib/utils/functions/translations';
-  import { currentOrg } from '$lib/utils/store/org.js';
+  import { currentOrg } from '$lib/utils/store/org';
-  import { redirectToLesson } from '$lib/utils/redirect.js';
+  import type { CurrentOrg } from '$lib/utils/types/org';
+  import { goto } from '$app/navigation';
 
   export let data;
 
@@ -223,7 +224,16 @@
     };
   }
 
-  $: redirectToLesson($currentOrg?.customization?.course?.newsfeed, data.courseId);
+  function getPageRoles(org: CurrentOrg) {
+    const roles = [1, 2];
+
+    if (org.customization.course.newsfeed) {
+      roles.push(3);
+    }
+
+    return roles;
+  }
+
   $: initNewsFeed(data.courseId);
 
   $: setAuthor($group, $profile.id);
@@ -232,7 +242,12 @@
 </script>
 
 <CourseContainer bind:courseId={data.courseId}>
-  <RoleBasedSecurity allowedRoles={[1, 2, $currentOrg.customization.course.newsfeed ? 3 : 0]}>
+  <RoleBasedSecurity
+    allowedRoles={getPageRoles($currentOrg)}
+    onDenied={() => {
+      goto(`/courses/${data.courseId}/lessons?next=true`);
+    }}
+  >
     <PageNav title={$t('course.navItem.news_feed.heading')} disableSticky={true}>
       <slot:fragment slot="widget">
         <RoleBasedSecurity allowedRoles={[1, 2]}>

apps/dashboard/src/routes/courses/[id]/marks/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { goto } from '$app/navigation';
   import AudioConsoleIcon from 'carbon-icons-svelte/lib/AudioConsole.svelte';
   import CourseContainer from '$lib/components/CourseContainer/index.svelte';
   import PageNav from '$lib/components/PageNav/index.svelte';
@@ -16,15 +17,16 @@
   import { course } from '$lib/components/Course/store';
   import { snackbar } from '$lib/components/Snackbar/store';
   import { globalStore } from '$lib/utils/store/app';
-  import { t } from '$lib/utils/functions/translations.js';
+  import { t } from '$lib/utils/functions/translations';
   import { currentOrg } from '$lib/utils/store/org';
-  import { redirectToLesson } from '$lib/utils/redirect.js';
+  import type { CurrentOrg } from '$lib/utils/types/org';
+  import type { GroupPerson } from '$lib/utils/types';
 
   export let data;
 
   let borderBottomGrey = 'border-r-0 border-t-0 border-b border-l-0 border-gray-300';
   let borderleftGrey = 'border-r-0 border-t-0 border-b-0 border-l border-gray-300';
-  let students = [];
+  let students: GroupPerson[] = [];
 
   let lessonMapping = {}; // { lessonId: { exerciseId: exerciseTitle, ... }, ... }
   let studentMarksByExerciseId = {}; // { groupMemberId: { exerciseId: `total_gotten/points`, ... }, ... }
@@ -33,7 +35,7 @@
     if (!studentExerciseData) return 0;
 
     return Object.values(studentExerciseData).reduce(
-      (total, point) => (total += parseInt(point)),
+      (total: number, point) => (total += parseInt(point as string)),
       0
     );
   }
@@ -82,16 +84,30 @@
     });
   }
 
+  function getPageRoles(org: CurrentOrg) {
+    const roles = [1, 2];
+
+    if (org.customization.course.grading) {
+      roles.push(3);
+    }
+
+    return roles;
+  }
+
   $: students = $globalStore.isStudent
     ? $group.people.filter((person) => !!person.profile && person.profile.id === $profile.id)
     : $group.people.filter((person) => !!person.profile && person.role_id === ROLE.STUDENT);
 
-  $: redirectToLesson($currentOrg.customization.course.grading, data.courseId);
   $: browser && $course.id && firstRender($course.id);
 </script>
 
 <CourseContainer bind:courseId={data.courseId}>
-  <RoleBasedSecurity allowedRoles={[1, 2, $currentOrg.customization.course.grading ? 3 : 0]}>
+  <RoleBasedSecurity
+    allowedRoles={getPageRoles($currentOrg)}
+    onDenied={() => {
+      goto(`/courses/${data.courseId}/lessons?next=true`);
+    }}
+  >
     <PageNav title={$t('course.navItem.marks.title')} />
 
     <PageBody width="w-full max-w-6xl md:w-11/12">

apps/dashboard/src/routes/courses/[id]/submissions/+page.svelte

@@ -347,8 +347,8 @@
   bind:isGradeWithAI
 />
 
-<RoleBasedSecurity allowedRoles={[1, 2]}>
+<CourseContainer bind:courseId={data.courseId}>
-  <CourseContainer bind:courseId={data.courseId}>
+  <RoleBasedSecurity allowedRoles={[1, 2]}>
     <PageNav title={$t('course.navItem.submissions.title')} />
 
     <PageBody width="w-full max-w-6xl md:w-11/12 overflow-x-auto">
@@ -424,8 +424,8 @@
         {/each}
       </div>
     </PageBody>
-  </CourseContainer>
+  </RoleBasedSecurity>
-</RoleBasedSecurity>
+</CourseContainer>
 
 <style>
   .section {