get class (e0c60e1d) · Commits · sustech-lms / web

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

+40 −59

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 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";
		import { Input } from "$lib/components/ui/input";
		import { Label } from "$lib/components/ui/label";
		import * as Popover from "$lib/components/ui/popover";
		import * as Select from "$lib/components/ui/select";
		import { tick } from "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';
		import { Input } from '$lib/components/ui/input';
		import { Label } from '$lib/components/ui/label';
		import * as Popover from '$lib/components/ui/popover';
		import * as Select from '$lib/components/ui/select';
		import { tick } from 'svelte';
		import type { Name } from 'drizzle-orm';
		import _ from 'lodash';

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

		const groups = [
		{
		label: "Personal Account",
		classes: [
		{
		label: "Alicia Koch",
		value: "personal",
		},
		],
		},
		{
		label: "Classes",
		classes: [
		{
		label: "Acme Inc.",
		value: "acme-inc",
		},
		{
		label: "Monsters Inc.",
		value: "monsters",
		},
		],
		},
		];

		type Class = (typeof groups)[number]["classes"][number];
		type Class = {
		id: number;
		name: string;
		semester: string;
		}
		export let classes: Class[];

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

		let open = false;
		let showClassDialog = false;

		let selectedClass: Class = groups[0].classes[0];
		let selectedClass: Class = classes?.[0]

		function closeAndRefocusTrigger(triggerId: string) {
		open = false;
		@@ -65,17 +50,17 @@
		role="combobox"
		aria-expanded={open}
		aria-label="Select a class"
		class={cn("w-[200px] justify-between", className)}
		class={cn('w-[200px] justify-between', className)}
		>
		<Avatar.Root class="mr-2 h-5 w-5">
		<Avatar.Image
		src="https://avatar.vercel.sh/${selectedClass.value}.png"
		alt={selectedClass.label}
		src="https://avatar.vercel.sh/${selectedClass.id}.png"
		alt={selectedClass.name}
		class="grayscale"
		/>
		<Avatar.Fallback>SC</Avatar.Fallback>
		</Avatar.Root>
		{selectedClass.label}
		{selectedClass.name}
		<CaretSort class="ml-auto h-4 w-4 shrink-0 opacity-50" />
		</Button>
		</Popover.Trigger>
		@@ -84,30 +69,30 @@
		<Command.Input placeholder="Search Class..." />
		<Command.List>
		<Command.Empty>No class found.</Command.Empty>
		{#each groups as group}
		<Command.Group heading={group.label}>
		{#each group.classes as c}
		{#each _.entries(groupedClasses) as [semester, classes]}
		<Command.Group heading={semester}>
		{#each classes as c}
		<Command.Item
		onSelect={() => {
		selectedClass = c;
		closeAndRefocusTrigger(ids.trigger);
		}}
		value={c.label}
		value={c.name}
		class="text-sm"
		>
		<Avatar.Root class="mr-2 h-5 w-5">
		<Avatar.Image
		src="https://avatar.vercel.sh/${c.value}.png"
		alt={c.label}
		src="https://avatar.vercel.sh/${c.id}.png"
		alt={c.name}
		class="grayscale"
		/>
		<Avatar.Fallback>SC</Avatar.Fallback>
		</Avatar.Root>
		{c.label}
		{c.name}
		<Check
		class={cn(
		"ml-auto h-4 w-4",
		selectedClass.value !== c.value && "text-transparent"
		'ml-auto h-4 w-4',
		selectedClass.id !== c.id && 'text-transparent'
		)}
		/>
		</Command.Item>
		@@ -135,9 +120,7 @@
		<Dialog.Content>
		<Dialog.Header>
		<Dialog.Title>Create class</Dialog.Title>
		<Dialog.Description>
		Add a new class to manage products and customers.
		</Dialog.Description>
		<Dialog.Description>Add a new class to manage products and customers.</Dialog.Description>
		</Dialog.Header>
		<div>
		<div class="space-y-4 py-2 pb-4">
		@@ -153,9 +136,7 @@
		</Select.Trigger>
		<Select.Content>
		<Select.Item value="free">
		<span class="font-medium">Free </span>-<span
		class="text-muted-foreground"
		>
		<span class="font-medium">Free </span>-<span class="text-muted-foreground">
		Trial for two weeks
		</span>
		</Select.Item>

src/lib/components/dashboard/main-nav.svelte

+4 −4

Original line number	Diff line number	Diff line
		<script lang="ts">
		import { cn } from "$lib/utils";
		import { cn } from '$lib/utils';

		let className: string \| undefined \| null = undefined;
		export { className as class };
		export { className };
		</script>

		<nav class={cn("flex items-center space-x-4 lg:space-x-6", className)}>
		<!-- <nav class={cn("flex items-center space-x-4 lg:space-x-6", className)}>
		<a href="/examples/dashboard" class="text-sm font-medium transition-colors hover:text-primary">
		Overview
		</a>
		@@ -28,4 +28,4 @@
		>
		Settings
		</a>
		</nav>
		No newline at end of file
		</nav> -->

src/lib/components/md-editor.svelte

+4 −1

Original line number	Diff line number	Diff line
		<script>
		<script lang="ts">
		import { Editor, rootCtx, defaultValueCtx } from '@milkdown/core';
		import { commonmark } from '@milkdown/preset-commonmark';
		import { gfm } from '@milkdown/preset-gfm';
		import { math } from '@milkdown/plugin-math';
		import { nord } from '@milkdown/theme-nord';
		import 'katex/dist/katex.min.css';

		export let defaultValue = '';

		@@ -15,6 +17,7 @@
		.config(nord)
		.use(commonmark)
		.use(gfm)
		.use(math)
		.create();
		}
		</script>

src/lib/db/class.server.ts

0 → 100644

+57 −0

Original line number	Diff line number	Diff line
		import { eq } from 'drizzle-orm';
		import { db } from './db.server';
		import { classUserRelation } from '$lib/drizzle/schema';

		export async function getUserClasses(userId: number) {
		const classesOnUsers = await db.query.classUserRelation.findMany({
		where: eq(classUserRelation.userId, userId),
		with: {
		class: true
		}
		});

		return {
		classes: classesOnUsers.map((c) => c.class)
		};
		}

		// export async function getClass(userId: number, classId: number) {
		// const userClass = await db.classesOnUsers.findFirst({
		// where: {
		// userId,
		// classId
		// },
		// include: {
		// class: true
		// }
		// });

		// if (!userClass) {
		// return null;
		// }
		// return userClass;
		// }

		// export async function getAssignments(userId: number, classId: number) {
		// const userClass = await db.classesOnUsers.findFirst({
		// where: {
		// userId,
		// classId
		// },
		// include: {
		// class: true
		// }
		// });

		// if (!userClass) {
		// return null;
		// }

		// const assignments = await db.assignment.findMany({
		// where: {
		// classId
		// }
		// });

		// return assignments;
		// }

src/lib/drizzle/schema.ts

+18 −0

Original line number	Diff line number	Diff line
		@@ -610,3 +610,21 @@ export const credentialRelations = relations(oauth2Credential, ({ one }) => ({
		references: [user.id]
		})
		}));


		export const usersRelations = relations(user, ({ many }) => ({
		userToCls: many(classUserRelation)
		}));
		export const clsRelations = relations(cls, ({ many }) => ({
		userToCls: many(classUserRelation)
		}));
		export const userToClsRelations = relations(classUserRelation, ({ one }) => ({
		class: one(cls, {
		fields: [classUserRelation.classId],
		references: [cls.id]
		}),
		user: one(user, {
		fields: [classUserRelation.classId],
		references: [user.id]
		})
		}));
		No newline at end of file

Admin message