Rotimi Best
bf3a7e7057
* fix(dashboard): hide in-progress badge on compliance learner cards Keep the due date on My Learning and LMS current-course cards, and only show compliance status badges for states that need attention. Co-authored-by: best <[email protected]> * fix(dashboard): enforce compliance deadline when publishing from view course site Reuse the settings deadline-required dialog and navigate to the completion deadline section so unpublished-site publish matches settings and the API. Co-authored-by: best <[email protected]> * fix(dashboard): keep attention highlight visible after deadline navigation Prevent goto and dialog focus restoration from scrolling away from the completion deadline section before the highlight pulse can render. Co-authored-by: best <[email protected]> * fix(dashboard): keep deadline attention highlight visible longer Use onMount plus afterNavigate so the completion deadline ring is not lost to navigation scroll races, and show a stronger primary ring for five seconds. Co-authored-by: best <[email protected]> * test(dashboard): use Jest APIs in compliance badge tests Drop the Vitest import so the new test matches the dashboard's declared Jest runner and @types/jest globals. Co-authored-by: best <[email protected]> ---------
92 lines
2.6 KiB
Svelte
92 lines
2.6 KiB
Svelte
<script lang="ts">
|
|
import { tick } from 'svelte';
|
|
import { Button } from '@cio/ui/base/button';
|
|
import * as Dialog from '@cio/ui/base/dialog';
|
|
import { courseApi } from '$features/course/api';
|
|
import { publishCourse } from '$features/course/utils/publish-course';
|
|
import { openCoursePreview } from '$features/course/utils/course-preview';
|
|
import { goToCourseCompletionDeadline } from '$features/course/utils/compliance-deadline';
|
|
import { t } from '$lib/utils/functions/translations';
|
|
import CertificateDeadlineRequiredDialog from './certificate-deadline-required-dialog.svelte';
|
|
|
|
interface Props {
|
|
open?: boolean;
|
|
currentOrgDomain?: string;
|
|
}
|
|
|
|
let { open = $bindable(false), currentOrgDomain = '' }: Props = $props();
|
|
|
|
let isPublishing = $state(false);
|
|
let openDeadlineDialog = $state(false);
|
|
|
|
async function handlePublishCourse() {
|
|
const course = courseApi.course;
|
|
if (!course?.id) {
|
|
return;
|
|
}
|
|
|
|
isPublishing = true;
|
|
|
|
const result = await publishCourse(course);
|
|
isPublishing = false;
|
|
|
|
if (!result.ok && result.reason === 'missing_deadline') {
|
|
open = false;
|
|
await tick();
|
|
openDeadlineDialog = true;
|
|
return;
|
|
}
|
|
|
|
if (!result.ok) {
|
|
return;
|
|
}
|
|
|
|
open = false;
|
|
|
|
openCoursePreview({
|
|
courseId: course.id,
|
|
courseSlug: courseApi.course?.slug,
|
|
currentOrgDomain
|
|
});
|
|
}
|
|
|
|
async function goToCompletionDeadline() {
|
|
const courseId = courseApi.course?.id;
|
|
openDeadlineDialog = false;
|
|
|
|
if (!courseId) {
|
|
return;
|
|
}
|
|
|
|
await tick();
|
|
goToCourseCompletionDeadline(courseId);
|
|
}
|
|
</script>
|
|
|
|
<Dialog.Root
|
|
bind:open
|
|
onOpenChange={(isOpen) => {
|
|
if (!isOpen && !isPublishing) {
|
|
open = false;
|
|
}
|
|
}}
|
|
>
|
|
<Dialog.Content class="w-[calc(100%-2rem)] max-w-md! p-4" onCloseAutoFocus={(e) => e.preventDefault()}>
|
|
<Dialog.Header>
|
|
<Dialog.Title>{$t('course.view_course_site.unpublished_title')}</Dialog.Title>
|
|
<Dialog.Description>{$t('course.view_course_site.unpublished_description')}</Dialog.Description>
|
|
</Dialog.Header>
|
|
|
|
<Dialog.Footer>
|
|
<Button variant="outline" onclick={() => (open = false)} disabled={isPublishing}>
|
|
{$t('course.view_course_site.cancel')}
|
|
</Button>
|
|
<Button variant="default" onclick={handlePublishCourse} loading={isPublishing} disabled={!courseApi.course?.id}>
|
|
{$t('course.view_course_site.publish_course')}
|
|
</Button>
|
|
</Dialog.Footer>
|
|
</Dialog.Content>
|
|
</Dialog.Root>
|
|
|
|
<CertificateDeadlineRequiredDialog bind:open={openDeadlineDialog} onGoToDeadline={goToCompletionDeadline} />
|