feat(lms): add student certificates page and sidebar nav (#696)

* feat(lms): add student certificates page and sidebar nav

Add a Certificates item to the student LMS sidebar that lists courses
where the student has earned a certificate. Each course card includes a
View Certificate action linking to the existing per-course certificate
page.

* refactor: reuse isOrgOnFreePlan helper from org store

* chore(i18n): add certificates translations for all locales

---------

apps/dashboard/src/lib/features/course/components/card.svelte

@@ -36,12 +36,13 @@
     isOnLandingPage?: boolean;
     isLMS?: boolean;
     isExplore?: boolean;
+    isCertificateView?: boolean;
     href?: string;
     actions?: Snippet;
     onExploreClick?: () => void;
   }
 
-  let { course, isOnLandingPage, isLMS, isExplore, href, actions, onExploreClick }: Props = $props();
+  let { course, isOnLandingPage, isLMS, isExplore, isCertificateView, href, actions, onExploreClick }: Props = $props();
 
   let {
     bannerImage,
@@ -150,6 +151,10 @@
       return href;
     }
 
+    if (isCertificateView) {
+      return `/courses/${id}/certificates`;
+    }
+
     if (isOnLandingPage || isExplore) {
       if (!slug) {
         return undefined;
@@ -198,6 +203,9 @@
       ? getStudentCourseComplianceDate(course as UserEnrolledCourses[number])
       : null
   );
+  const certificateEarnedAt = $derived(
+    isCertificateView && 'certificateEarnedAt' in course ? course.certificateEarnedAt : null
+  );
 
   function formatDate(value: string | null | undefined) {
     if (!value) {
@@ -275,7 +283,13 @@
               {/if}
             </span>
           {:else if isLMS}
-            {#if !isExplore}
+            {#if isCertificateView}
+              {#if certificateEarnedAt}
+                <p class="ui:text-muted-foreground text-xs">
+                  {$t('certificates.earned_on')}: {formatDate(certificateEarnedAt)}
+                </p>
+              {/if}
+            {:else if !isExplore}
               <div class="flex w-3/4 items-center gap-2">
                 <Progress value={progressRate} />
                 <p class="ui:text-muted-foreground text-xs">{progressRate}%</p>
@@ -305,7 +319,11 @@
 
       {#if isLMS}
         <Button variant="outline" onclick={isExplore && onExploreClick ? onExploreClick : undefined}>
-          {isExplore ? $t('courses.course_card.learn_more') : $t('courses.course_card.continue_course')}
+          {isCertificateView
+            ? $t('certificates.view_certificate')
+            : isExplore
+              ? $t('courses.course_card.learn_more')
+              : $t('courses.course_card.continue_course')}
 
           <ArrowRightIcon class="custom" />
         </Button>