CLASSROOMIO-T-248: add allow new user to course setting

CLASSROOMIO-T-248:Updated code based on reviews

Merge branch 'main' into CLASSROOMIO-T-248

CLASSROOMIO-T-248:Add allow new user to course setting


Co-authored-by: Ifeanyi Nwosu <[email protected]>


Merge-request: CLASSROOMIO-MR-114
Merged-by: Best Admin <[email protected]>

src/lib/components/Course/components/Settings/index.svelte

@@ -26,7 +26,6 @@
   let errors = {};
   let avatar;
 
-  // controls widget open and close
   function widgetControl() {
     $handleOpenWidget.open = true;
   }
@@ -118,6 +117,7 @@
         logo,
         tabs,
         grading,
+        allow_new_students,
         lesson_download,
         is_published
       } = $settings;
@@ -130,7 +130,8 @@
           ...(isObject($course.metadata) ? $course.metadata : {}),
           lessonTabsOrder: tabs,
           grading: grading,
-          lessonDownload: lesson_download
+          lessonDownload: lesson_download,
+          allowNewStudent: allow_new_students
         }
       });
 
@@ -142,7 +143,8 @@
         ...(isObject($course.metadata) ? $course.metadata : {}),
         lessonTabsOrder: tabs,
         grading: grading,
-        lessonDownload: lesson_download
+        lessonDownload: lesson_download,
+        allowNewStudent: allow_new_students
       };
       snackbar.success('Saved successfully');
     } catch (error) {
@@ -153,7 +155,6 @@
   };
 
   function setDefault(course) {
-    console.log('course.is_published', course.is_published);
     if (course && Object.keys(course).length) {
       $settings = {
         course_title: course.title,
@@ -162,13 +163,16 @@
         tabs: course.metadata.lessonTabsOrder || $settings.tabs,
         grading: course.metadata.grading,
         lesson_download: course.metadata.lessonDownload,
-        is_published: course.is_published
+        is_published: course.is_published,
+        allow_new_students: course.metadata.allowNewStudent
       };
     }
   }
 
   $: $settings.course_description = $course.description;
   $: $settings.course_title = $course.title;
+  $: $settings.allow_new_students = $settings.is_published;
+
   $: setDefault($course);
 </script>
 
@@ -256,6 +260,18 @@
       </Toggle>
     </Column>
   </Row>
+  <Row class="flex lg:flex-row flex-col py-7 border-bottom-c">
+    <Column sm={8} md={8} lg={8}>
+      <SectionTitle>Allow New Students</SectionTitle>
+      <p>Allow new students to access this course</p>
+    </Column>
+    <Column sm={8} md={8} lg={8}>
+      <Toggle size="sm" bind:toggled={$settings.allow_new_students}>
+        <span slot="labelA" style="color: gray">Disable</span>
+        <span slot="labelB" style="color: gray">Enable</span>
+      </Toggle>
+    </Column>
+  </Row>
   <Row class="flex lg:flex-row flex-col py-7 border-bottom-c">
     <Column sm={8} md={8} lg={8}>
       <SectionTitle>Order Lessons Tab</SectionTitle>

src/lib/components/Course/components/Settings/store.js

@@ -5,6 +5,7 @@ export const settings = writable({
   course_title: '',
   course_description: '',
   grading: false,
+  allow_new_students: false,
   tabs: [
     { id: 1, name: 'Note' },
     { id: 2, name: 'Slide' },

src/lib/components/Course/store.ts

@@ -42,7 +42,8 @@ export const defaultCourse: Course = {
       { id: 3, name: 'Video' }
     ],
     grading: false,
-    lessonDownload: true
+    lessonDownload: true,
+    allowNewStudent: false
   }
 };
 

src/lib/components/CourseLandingPage/components/PricingSection.svelte

@@ -99,6 +99,7 @@
             label={isFree ? 'Join Course' : 'Buy Now'}
             className="w-full sm:w-full h-[40px]"
             onClick={handleJoinCourse}
+            isDisabled={!editMode && !courseData.metadata.allowNewStudent}
           />
         </div>
       </div>
@@ -135,6 +136,7 @@
           label={isFree ? 'Join Course' : 'Buy Now'}
           className="w-full sm:w-full py-3 mb-3"
           onClick={handleJoinCourse}
+          isDisabled={!editMode && !courseData.metadata.allowNewStudent}
         />
         <p class="dark:text-white font-light text-sm text-gray-500">Early bird offer. Buy ASAP</p>
       </div>

src/lib/components/CourseLandingPage/index.svelte

@@ -40,7 +40,7 @@
   let totalRatings = 0;
   let startCoursePayment = false;
   let isVisible = false;
-  let observer;
+  let observer: { destroy: () => void };
 
   // initialize the expandDescription array with 'false' values for each review.
   let expandDescription = Array(reviews.length).fill(false);
@@ -75,7 +75,7 @@
   onMount(() => {
     window.onhashchange = locationHashChanged;
     const targetNode = document.querySelector('.target-component');
-    observer = observeIntersection(targetNode, (inView) => {
+    observer = observeIntersection(targetNode, (inView: boolean) => {
       isVisible = inView;
     });
   });
@@ -132,6 +132,7 @@
           onClick={() => {
             startCoursePayment = true;
           }}
+          isDisabled={!editMode && !courseData.metadata.allowNewStudent}
         />
       </div>
 

src/lib/utils/types/index.ts

@@ -81,6 +81,7 @@ interface CourseMetadata {
   lessonTabsOrder?: Array<Tabs>;
   grading?: boolean;
   lessonDownload?: boolean;
+  allowNewStudent: boolean;
 }
 
 export interface LessonCommentInsertPayload {