fix(dashboard): Save button not showing in certificate settings page (#854)

* Fixed Validation of allowing teachers create compliance courses without setting deadline

* greptile highlightCertificateSettings decraration suggestion

* greptile multiple error bar showing fix suggestion

* organization race condition

* Delete screenshots/Screenshot 2026-07-22 at 11.52.00 AM.png

* deleted unwanted files

* code review fixes

* Changed AttentionHightlight component to work with just one parameter

created fixed Route Enums, Paths and Sections for

* Kebab-case naming fix

* Changes for code comments

* Made changes to add tab to the query param

* Apply suggestion from @greptile-apps[bot]

Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>

---------

Co-authored-by: Rotimi Best <[email protected]>
Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>

apps/dashboard/src/lib/features/course/components/ceritficate/certificate-edit.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-  import { page } from '$app/state';
   import * as UnderlineTabs from '@cio/ui/custom/underline-tabs';
   import { t } from '$lib/utils/functions/translations';
 
@@ -11,25 +10,16 @@
   type Props = {
     errors: Record<string, string>;
     activeTab?: string;
+    onActiveTabChange?: (tab: string) => void;
   };
 
-  let { errors }: Props = $props();
-
-  let activeTab = $state('design');
-
-  // Initialize activeTab from URL parameter if present
-  $effect(() => {
-    const tabParam = page.url.searchParams.get('tab');
-    if (tabParam && (tabParam === 'design' || tabParam === 'settings')) {
-      activeTab = tabParam;
-    }
-  });
+  let { errors, activeTab = 'design', onActiveTabChange }: Props = $props();
 </script>
 
 <UpgradeBanner>{$t('upgrade.certificate')}</UpgradeBanner>
 
 <main class="px-2 md:-mr-3 md:-ml-3">
-  <UnderlineTabs.Root bind:value={activeTab} class="w-full">
+  <UnderlineTabs.Root value={activeTab} onValueChange={(value) => onActiveTabChange?.(value)} class="w-full">
     <UnderlineTabs.List>
       <UnderlineTabs.Trigger value="design">
         {$t('course.navItem.certificates.tab_design')}

apps/dashboard/src/lib/features/course/pages/certificates.svelte

@@ -7,15 +7,16 @@
   type Props = {
     errors: Record<string, string>;
     activeTab?: string;
+    onActiveTabChange?: (tab: string) => void;
   };
 
-  let { errors, activeTab = $bindable('design') }: Props = $props();
+  let { errors, activeTab = 'design', onActiveTabChange }: Props = $props();
 </script>
 
 <IssueCertificateModal />
 
 <RoleBasedSecurity allowedRoles={[1, 2]}>
-  <CertificateEdit {errors} bind:activeTab />
+  <CertificateEdit {errors} {activeTab} {onActiveTabChange} />
 </RoleBasedSecurity>
 <RoleBasedSecurity onlyStudent allowedRoles={[3]}>
   <StudentCertificate />