Add fake submissions

web/prisma/schema.prisma

@@ -29,6 +29,9 @@ enum SubmissionState {
 
 model Submission {
   id             Int             @id @default(autoincrement())
+  createdAt      DateTime        @default(now())
   state          SubmissionState
+  expectedOutput String
+  actualOutput   String
   message        String?
 }

web/src/routes/admin/diff/+page.server.ts

@@ -1,7 +0,0 @@
-import type { PageServerLoad } from './$types';
-import * as Diff from 'diff';
-
-export const load = (async () => {
-	let diff = Diff.createTwoFilesPatch('data', 'data', 'abc', 'abd');
-	return { diff: diff };
-}) satisfies PageServerLoad;

web/src/routes/admin/diff/[submissionId]/+page.server.ts

@@ -0,0 +1,23 @@
+import { z } from 'zod';
+import type { PageServerLoad } from './$types';
+import * as Diff from 'diff';
+import { error } from '@sveltejs/kit';
+import { db } from '$lib/server/prisma';
+
+export const load = (async ({ params }) => {
+	const submissionId = parseInt(params.submissionId);
+	if (isNaN(submissionId)) {
+		throw error(400, 'Invalid request');
+	}
+	const submission = await db.submission.findUnique({ where: { id: submissionId } });
+	if (!submission) {
+		throw error(400, 'Invalid submission');
+	}
+	let diff = Diff.createTwoFilesPatch(
+		'expected',
+		'actual',
+		submission.expectedOutput,
+		submission.actualOutput
+	);
+	return { diff: diff };
+}) satisfies PageServerLoad;

web/src/routes/admin/diff/[submissionId]/+page.svelte

@@ -2,9 +2,10 @@
 	import { Diff2HtmlUI } from 'diff2html/lib/ui/js/diff2html-ui-base';
 	import 'diff2html/bundles/css/diff2html.min.css';
 	import { onMount } from 'svelte';
-	import type { PageData } from './$types';
 	import type { DiffPostData } from './+server';
 	import { goto } from '$app/navigation';
+	import type { PageData } from './$types';
+	import { page } from '$app/stores';
 
 	export let data: PageData;
 
@@ -34,22 +35,28 @@
 
 	async function onSubmitClick() {
 		if (incorrectBtn.checked) {
-			let data: DiffPostData = { correct: false, message: messageText.value };
-			await fetch('/admin/diff', { method: 'POST', body: JSON.stringify(data) });
+			let postData: DiffPostData = {
+				correct: false,
+				message: messageText.value
+			};
+			await fetch($page.url, { method: 'POST', body: JSON.stringify(postData) });
 			goto('/admin/reviews');
 		} else if (correctBtn.checked) {
-			let data: DiffPostData = { correct: true, message: messageText.value };
-			await fetch('/admin/diff', { method: 'POST', body: JSON.stringify(data) });
+			let postData: DiffPostData = {
+				correct: true,
+				message: messageText.value
+			};
+			await fetch($page.url, { method: 'POST', body: JSON.stringify(postData) });
 			goto('/admin/reviews');
 		}
 	}
 </script>
 
 <svelte:head>
-	<title>Diff Test</title>
+	<title>Diff</title>
 </svelte:head>
 
-<h1 class="mb-4">Diff Test</h1>
+<h1 class="mb-4">Diff</h1>
 
 <a href="/admin/reviews" class="btn btn-outline-primary">Back</a>
 <div class="mt-3" id="diff" />

web/src/routes/admin/diff/[submissionId]/+server.ts

@@ -1,6 +1,7 @@
 import { error, json } from '@sveltejs/kit';
 import type { RequestHandler } from './$types';
 import { z } from 'zod';
+import { db } from '$lib/server/prisma';
 
 const diffPostData = z.object({
 	correct: z.boolean(),
@@ -8,12 +9,15 @@ const diffPostData = z.object({
 });
 export type DiffPostData = z.infer<typeof diffPostData>;
 
-export const POST = (async ({ request }) => {
+export const POST = (async ({ request, params }) => {
+	const submissionId = parseInt(params.submissionId);
+	if (isNaN(submissionId)) {
+		throw error(400, 'Invalid submission');
+	}
 	const req = diffPostData.safeParse(await request.json());
 	if (!req.success) {
 		throw error(400, 'Invalid data format');
 	}
-	console.log(req.data.correct);
-	console.log(req.data.message);
+	await db.submission.delete({ where: { id: submissionId } });
 	return json({ success: true });
 }) satisfies RequestHandler;

web/src/routes/admin/reviews/+page.server.ts

@@ -1,6 +1,32 @@
-import type { PageServerLoad } from './$types';
+import { db } from '$lib/server/prisma';
+import { SubmissionState } from '@prisma/client';
+import type { Actions, PageServerLoad } from './$types';
 
 export const load = (async () => {
-	let reviewList = ['Team A', 'Team B', 'Team C', 'Team D', 'Team E'];
-	return { reviewList: reviewList };
+	const query = await db.submission.findMany({ where: { state: SubmissionState.InReview } });
+	query.sort((a, b) => {
+		return a.createdAt.valueOf() - b.createdAt.valueOf();
+	});
+	return { reviewList: query };
 }) satisfies PageServerLoad;
+
+export const actions = {
+	submission: async ({ request }) => {
+		const data = await request.formData();
+		const expected = data.get('expected');
+		const actual = data.get('actual');
+		if (!expected || !actual) {
+			return { success: false };
+		}
+		if (expected.toString() === actual.toString()) {
+			return { success: true };
+		}
+		await db.submission.create({
+			data: {
+				state: SubmissionState.InReview,
+				expectedOutput: expected.toString(),
+				actualOutput: actual.toString()
+			}
+		});
+	}
+} satisfies Actions;

web/src/routes/admin/reviews/+page.svelte

@@ -1,15 +1,47 @@
 <script lang="ts">
-	import type { PageData } from './$types';
+	import { enhance } from '$app/forms';
+	import type { ActionData, PageData } from './$types';
 
 	export let data: PageData;
+	export let form: ActionData;
 </script>
 
+<svelte:head>
+	<title>Reviews</title>
+</svelte:head>
+
 <h1 class="mb-4">Reviews</h1>
 
-<a href="/logout" class="mb-2 btn btn-outline-primary">Logout</a>
+<a href="/logout" class="mb-2 btn btn-outline-primary" data-sveltekit-preload-data="off">Logout</a>
 
 <ul class="list-group">
+	{#if data.reviewList.length === 0}
+		<div class="alert alert-success">No Submission to Review!</div>
+	{/if}
 	{#each data.reviewList as review}
-		<a href="/admin/diff" class="list-group-item list-group-item-action">{review}</a>
+		<a href={'/admin/diff/' + review.id.toString()} class="list-group-item list-group-item-action"
+			>{review.createdAt.toLocaleDateString() + ' ' + review.createdAt.toLocaleTimeString()}</a
+		>
 	{/each}
 </ul>
+
+<hr />
+<h2>For Testing Purposes - Create Fake Submission</h2>
+{#if form && !form.success}
+	<div class="alert alert-danger">Invalid Submission</div>
+{/if}
+<form method="POST" action="?/submission" use:enhance>
+	<div class="row">
+		<div class="col-6">
+			<h5>Expected output (real data)</h5>
+			<textarea name="expected" class="form-control" />
+		</div>
+		<div class="col-6">
+			<h5>Actual output (like from student output)</h5>
+			<textarea name="actual" class="form-control" />
+		</div>
+	</div>
+	<div class="row justify-content-end">
+		<button type="submit" class="mt-3 col-1 btn btn-secondary">Submit</button>
+	</div>
+</form>