current class (04822d91) · Commits · sustech-lms / web

src/lib/components/dashboard/class-switcher.svelte

+16 −25

Original line number	Diff line number	Diff line
		<script lang="ts">
		import CaretSort from 'svelte-radix/CaretSort.svelte';
		import Check from 'svelte-radix/Check.svelte';
		import PlusCircled from 'svelte-radix/PlusCircled.svelte';

		import { cn } from '$lib/utils';
		import * as Avatar from '$lib/components/ui/avatar';
		import { Button } from '$lib/components/ui/button';
		import * as Command from '$lib/components/ui/command';
		import * as Dialog from '$lib/components/ui/dialog';
		@@ -14,35 +12,28 @@
		import * as Select from '$lib/components/ui/select';
		import { tick } from 'svelte';
		import _ from 'lodash';
		import { goto } from '$app/navigation';
		import type { PageClass } from '$lib/shared/class';

		let className: string \| undefined \| null = undefined;
		export { className as class };

		type Class = {
		id: number;
		name: string;
		semester: string;
		};
		export let classes: Class[];
		export let classes: PageClass[];

		const groupedClasses = _.groupBy(classes, (c) => c.semester);
		const groupedClasses = _.groupBy(classes, (c) => c.semester.name);

		let open = false;
		let showClassDialog = false;

		export let selectedClass: Class \| null;
		if (_.isNil(selectedClass)) {
		selectedClass = {
		id: -1,
		name: "Select your class..",
		semester: ""
		}
		}
		export let currentClass: PageClass \| null;

		function closeAndRefocusTrigger(triggerId: string) {
		function closeAndRefocusTrigger(triggerId: string, c: PageClass) {
		open = false;

		tick().then(() => document.getElementById(triggerId)?.focus());
		tick().then(() => {
		document.getElementById(triggerId)?.focus();
		goto(`/${c.course.code}/${c.semester.abbr}`);
		});
		}
		</script>

		@@ -65,7 +56,7 @@
		/>
		<Avatar.Fallback>SC</Avatar.Fallback>
		</Avatar.Root> -->
		{selectedClass.name}
		{currentClass?.name \|\| 'Select your class'}
		<CaretSort class="ml-auto h-4 w-4 shrink-0 opacity-50" />
		</Button>
		</Popover.Trigger>
		@@ -79,8 +70,8 @@
		{#each classes as c}
		<Command.Item
		onSelect={() => {
		selectedClass = c;
		closeAndRefocusTrigger(ids.trigger);
		currentClass = c;
		closeAndRefocusTrigger(ids.trigger, c);
		}}
		value={c.name}
		class="text-sm"
		@@ -95,14 +86,14 @@
		</Avatar.Root> -->
		{c.name}
		<Check
		class={cn('ml-auto h-4 w-4', selectedClass.id !== c.id && 'text-transparent')}
		class={cn('ml-auto h-4 w-4', currentClass?.id !== c.id && 'text-transparent')}
		/>
		</Command.Item>
		{/each}
		</Command.Group>
		{/each}
		</Command.List>
		<Command.Separator />
		<!-- <Command.Separator />
		<Command.List>
		<Command.Group>
		<Command.Item
		@@ -115,7 +106,7 @@
		Create Class
		</Command.Item>
		</Command.Group>
		</Command.List>
		</Command.List> -->
		</Command.Root>
		</Popover.Content>
		</Popover.Root>

src/lib/server/db/class.ts

+7 −4

Original line number	Diff line number	Diff line
		@@ -7,15 +7,18 @@ export async function getUserClasses(userId: number) {
		userId
		},
		include: {
		class: true
		class: {
		include: {
		course: true,
		semester: true
		}
		}
		}
		});

		const classes = classesOnUsers.map((c) => c.class);

		return {
		classes
		};
		return classes;
		}

		export async function getClassByCourseSemester(course: Course, semester: Semester) {

src/lib/shared/class.ts

+8 −2

Original line number	Diff line number	Diff line
		export type Class = {
		export type PageClass = {
		id: number;
		name: string;
		semester: string;
		course: {
		code: string;
		};
		semester: {
		name: string;
		abbr: string;
		};
		};

src/routes/(with-class)/+layout.server.ts

+24 −7

Original line number	Diff line number	Diff line
		@@ -2,6 +2,8 @@ import { db } from '$lib/server/db';
		import { getClassByCourseSemester, getUserClasses } from '$lib/server/db/class';
		import { getCourseByCode } from '$lib/server/db/course';
		import { getSemesterFromAbbr } from '$lib/server/db/semester';
		import type { PageClass } from '$lib/shared/class';
		import type { Class } from '@prisma/client';
		import { error, redirect, type Actions, type ServerLoad } from '@sveltejs/kit';
		import _ from 'lodash';

		@@ -14,18 +16,29 @@ export const load: ServerLoad = async ({ params, locals }) => {

		const { course: courseNumber, semester: semesterAbbr } = params;

		const { classes } = await getUserClasses(user.id);
		console.log(classes);
		const classes = (await getUserClasses(user.id)).map((c) => {
		return {
		id: c.id,
		name: c.name,
		course: {
		code: c.course.code
		},
		semester: {
		name: `${c.semester.year} ${_.capitalize(c.semester.season)}`,
		abbr: `${c.semester.year - 2000}${_.toLower(c.semester.season[0])}`
		}
		} satisfies PageClass;
		});

		let currentClass = null;
		let targetClass = null;
		if (!_.isNil(courseNumber) && !_.isNil(semesterAbbr)) {
		const course = await getCourseByCode(courseNumber);
		const semester = await getSemesterFromAbbr(semesterAbbr);
		console.log(course, semester);
		if (!_.isNil(course) && !_.isNil(semester)) {
		currentClass = await getClassByCourseSemester(course, semester);
		targetClass = await getClassByCourseSemester(course, semester);
		}
		if (_.isNil(currentClass)) {
		if (_.isNil(targetClass)) {
		error(404, {
		message: 'Not found'
		});
		@@ -33,13 +46,17 @@ export const load: ServerLoad = async ({ params, locals }) => {
		}

		// TODO: show information for forbbiden users
		if (!_.isNil(currentClass)) {
		if (_.findIndex(classes, (c) => c.id == currentClass.id) == -1) {
		let currentClass = null;
		if (!_.isNil(targetClass)) {
		const idx = _.findIndex(classes, (c) => c.id == targetClass.id);
		if (idx == -1) {
		error(403, {
		message: 'You should not be here'
		});
		}
		currentClass = classes[idx];
		}

		return {
		user,
		classes,

src/routes/(with-class)/+layout.svelte

+1 −17

Original line number	Diff line number	Diff line
		@@ -7,23 +7,7 @@

		export let data: PageData;

		const { user } = data;

		export let classes = data.classes.map((c) => {
		return {
		id: c.id,
		name: c.name,
		semester: ''
		};
		});

		export let currentClass = _.isNil(data.currentClass)
		? null
		: {
		id: data.currentClass.id,
		name: data.currentClass.name,
		semester: ''
		};
		const { user, currentClass, classes } = data;
		</script>

		<div class="hidden flex-col md:flex">

Admin message