fix: replace button not working on landing page editor (#141)

* CLASSROOMIO-ISSUE-46: Replace Button Bug Fix

* update posthog and fix issue found on gitpod

---------

Co-authored-by: Rotimi Best <best@classroomio.com>

apps/dashboard/package.json

@@ -47,7 +47,7 @@
     "nodemailer": "^6.9.5",
     "openai-edge": "^1.2.2",
     "pluralize": "^8.0.0",
-    "posthog-js": "^1.96.0",
+    "posthog-js": "^1.103.0",
     "sirv": "^2.0.3",
     "svelte-email": "^0.0.4",
     "svelte-ui": "workspace:*",

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

@@ -22,7 +22,7 @@
   import UploadWidget from '$lib/components/UploadWidget/index.svelte';
   import { handleOpenWidget } from '$lib/components/CourseLandingPage/store';
 
-  import { Restart  } from 'carbon-icons-svelte';
+  import { Restart } from 'carbon-icons-svelte';
   import IconButton from '$lib/components/IconButton/index.svelte';
   import generateSlug from '$lib/utils/functions/generateSlug';
 
@@ -36,7 +36,7 @@
   let avatar: string | undefined;
 
   function widgetControl() {
-    $handleOpenWidget.open = true;
+    $handleOpenWidget.open = !$handleOpenWidget.open;
   }
 
   function getLessonOrder(id: string) {
@@ -174,14 +174,14 @@
         grading: !!course.metadata.grading,
         lesson_download: !!course.metadata.lessonDownload,
         is_published: !!course.is_published,
-        allow_new_students: course.metadata.allowNewStudent,
+        allow_new_students: course.metadata.allowNewStudent
       };
     }
   }
 
   const generateNewCourseLink = () => {
     $course.slug = generateSlug($course.title);
-  }
+  };
 
   $: $settings.course_description = $course.description;
   $: $settings.course_title = $course.title;

apps/dashboard/src/lib/components/CourseLandingPage/components/Editor/HeaderForm.svelte

@@ -8,7 +8,7 @@
   export let course = {};
 
   function widgetControl() {
-    $handleOpenWidget.open = true;
+    $handleOpenWidget.open = !$handleOpenWidget.open;
   }
 </script>
 

apps/dashboard/src/lib/components/CourseLandingPage/components/Editor/index.svelte

@@ -5,6 +5,7 @@
   import ChevronRightIcon from 'carbon-icons-svelte/lib/ChevronRight.svelte';
   import ArrowLeftIcon from 'carbon-icons-svelte/lib/ArrowLeft.svelte';
   import ArrowUpRightIcon from 'carbon-icons-svelte/lib/ArrowUpRight.svelte';
+  import ChevronLeftIcon from 'carbon-icons-svelte/lib/ChevronLeft.svelte';
   import { currentOrgDomain } from '$lib/utils/store/org';
 
   import IconButton from '$lib/components/IconButton/index.svelte';
@@ -20,7 +21,6 @@
   import { VARIANTS } from '$lib/components/PrimaryButton/constants';
   import { updateCourse } from '$lib/utils/services/courses';
   import generateSlug from '$lib/utils/functions/generateSlug';
-  import ChevronLeftIcon from 'carbon-icons-svelte/lib/ChevronLeft.svelte';
 
   import { isMobile } from '$lib/utils/store/useMobile';
   import CustomPromptBtn from '$lib/components/AI/AIButton/CustomPromptBtn.svelte';

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

@@ -13,7 +13,7 @@
   import { getLectureNo } from '../Course/function';
   import { NAV_ITEMS } from './constants';
   import Modal from '../Modal/index.svelte';
-  import { reviewsModalStore } from './store';
+  import { handleOpenWidget, reviewsModalStore } from './store';
   import Chip from '../Chip/index.svelte';
   import Avatar from '$lib/components/Avatar/index.svelte';
   import PrimaryButton from '$lib/components/PrimaryButton/index.svelte';
@@ -23,6 +23,8 @@
   import HtmlRender from '$lib/components/HTMLRender/HTMLRender.svelte';
   import { calDateDiff } from '$lib/utils/functions/date';
   import { currentOrg } from '$lib/utils/store/org';
+  import UploadWidget from '$lib/components/UploadWidget/index.svelte';
+  import { course } from '$lib/components/Course/store';
 
   export let editMode = false;
   export let courseData: Course;
@@ -120,6 +122,9 @@
           }}
           isDisabled={!courseData.metadata.allowNewStudent}
         />
+        {#if $handleOpenWidget.open}
+          <UploadWidget bind:imageURL={$course.logo} />
+        {/if}
       </div>
 
       <!-- Banner Image getEmbedId(videoUrl) -->

apps/dashboard/src/lib/utils/functions/showAppsSideBar.js

@@ -1,5 +1,5 @@
 function showAppsSideBar(path) {
-  return path.includes('/lessons/') && !path.includes('landingpage');
+  return path?.includes('/lessons/') && !path?.includes('landingpage');
 }
 
 export default showAppsSideBar;