add feedback endpoint (#28) and some other stuff

src/lib/components/Input/Input.svelte

@@ -11,6 +11,7 @@
 	export let required = false;
 	export let disabled = false;
 	export let readonly = false;
+	export let checked = false;
 	export let size: 'xs' | 'sm' | 'md' | 'lg' = 'md';
 	export let pickyWidth = true;
 	export let containerClass = '';
@@ -85,6 +86,7 @@
 					{name}
 					{type}
 					{value}
+					{checked}
 					{placeholder}
 					{required}
 					{disabled}

src/lib/permissions.ts

@@ -1,12 +1,9 @@
 export class Permissions {
-	static readonly AdminRead = 2;
-	static readonly AdminWrite = 4;
-	static readonly UserRead = 8;
-	static readonly UserWrite = 16;
-	static readonly ReportRead = 32;
-	static readonly ReportWrite = 64;
-	static readonly SettingsRead = 128;
-	static readonly SettingsWrite = 256;
+	static readonly Admin = 2 << 0;
+	static readonly Users = 2 << 1;
+	static readonly Reports = 2 << 2;
+	static readonly Feedback = 2 << 3;
+	static readonly Settings = 2 << 4;
 
 	readonly value: number;
 
@@ -30,40 +27,29 @@ export class Permissions {
 
 	static allPermissions(): number[] {
 		return [
-			Permissions.AdminRead,
-			Permissions.AdminWrite,
-			Permissions.UserRead,
-			Permissions.UserWrite,
-			Permissions.ReportRead,
-			Permissions.ReportWrite,
-			Permissions.SettingsRead,
-			Permissions.SettingsWrite
+			Permissions.Admin,
+			Permissions.Users,
+			Permissions.Reports,
+			Permissions.Feedback,
+			Permissions.Settings
 		];
 	}
 
-	adminRead(): boolean {
-		return (this.value & Permissions.AdminRead) != 0;
+	admin(): boolean {
+		return (this.value & Permissions.Admin) != 0;
 	}
-	adminWrite(): boolean {
-		return (this.value & Permissions.AdminWrite) != 0;
+
+	users(): boolean {
+		return (this.value & Permissions.Users) != 0;
 	}
-	userRead(): boolean {
-		return (this.value & Permissions.UserRead) != 0;
+	reports(): boolean {
+		return (this.value & Permissions.Reports) != 0;
 	}
-	userWrite(): boolean {
-		return (this.value & Permissions.UserWrite) != 0;
+	feedback(): boolean {
+		return (this.value & Permissions.Reports) != 0;
 	}
-	reportRead(): boolean {
-		return (this.value & Permissions.ReportRead) != 0;
-	}
-	reportWrite(): boolean {
-		return (this.value & Permissions.ReportWrite) != 0;
-	}
-	settingsRead(): boolean {
-		return (this.value & Permissions.SettingsRead) != 0;
-	}
-	settingsWrite(): boolean {
-		return (this.value & Permissions.SettingsWrite) != 0;
+	settings(): boolean {
+		return (this.value & Permissions.Reports) != 0;
 	}
 
 	asArray(): number[] {

src/lib/server/database.ts

@@ -1,4 +1,4 @@
-import { DataTypes } from 'sequelize';
+import { DataTypes, Op } from 'sequelize';
 import { env } from '$env/dynamic/private';
 import { building, dev } from '$app/environment';
 import * as bcrypt from 'bcrypt';
@@ -97,6 +97,23 @@ export class StrikePunishment extends Model {
 	declare punishment_in_seconds: number;
 }
 
+@Table({ modelName: 'feedback', underscored: true })
+export class Feedback extends Model {
+	@Column({ type: DataTypes.STRING, allowNull: false, unique: true })
+	@Index
+	declare url_hash: string;
+	@Column({ type: DataTypes.STRING, allowNull: false })
+	declare event: string;
+	@Column({ type: DataTypes.STRING })
+	declare content: string;
+	@Column({ type: DataTypes.INTEGER })
+	@ForeignKey(() => User)
+	declare user_id: number;
+
+	@BelongsTo(() => User, 'user_id')
+	declare user: User;
+}
+
 @Table({ modelName: 'admin', underscored: true })
 export class Admin extends Model {
 	@Column({ type: DataTypes.STRING, allowNull: false, unique: true })
@@ -148,5 +165,5 @@ export class Settings extends Model {
 export const sequelize = new Sequelize(building ? 'sqlite::memory:' : env.DATABASE_URI, {
 	// only log sql queries in dev mode
 	logging: dev ? console.log : false,
-	models: [User, Report, StrikeReason, StrikePunishment, Admin, Settings]
+	models: [User, Report, StrikeReason, StrikePunishment, Feedback, Admin, Settings]
 });

src/lib/stores.ts

@@ -13,4 +13,5 @@ export const errorMessage: Writable<string | null> = (() => {
 	};
 })();
 export const reportCount: Writable<number> = writable(0);
+export const feedbackCount: Writable<number> = writable(0);
 export const adminCount: Writable<number> = writable(0);

src/routes/admin/+layout.server.ts

@@ -1,8 +1,9 @@
 import type { LayoutServerLoad } from './$types';
-import { Admin, Report, User } from '$lib/server/database';
+import { Admin, Feedback, Report, User } from '$lib/server/database';
 import { getSession } from '$lib/server/session';
 import { redirect } from '@sveltejs/kit';
 import { env } from '$env/dynamic/public';
+import { Op } from 'sequelize';
 
 export const load: LayoutServerLoad = async ({ route, cookies }) => {
 	const session = getSession(cookies);
@@ -11,12 +12,15 @@ export const load: LayoutServerLoad = async ({ route, cookies }) => {
 		throw redirect(302, `${env.PUBLIC_BASE_PATH}/admin/login`);
 
 	return {
-		userCount: session?.permissions.userRead() ? await User.count() : null,
-		reportCount: session?.permissions.reportRead()
+		userCount: session?.permissions.users() ? await User.count() : null,
+		reportCount: session?.permissions.reports()
 			? await Report.count({ where: { draft: false, status: ['none', 'review'] } })
 			: null,
-		adminCount: session?.permissions.adminRead() ? await Admin.count() : null,
-		settingsRead: session?.permissions.settingsRead(),
+		feedbackCount: session?.permissions.feedback()
+			? await Feedback.count({ where: { content: { [Op.not]: null } } })
+			: null,
+		adminCount: session?.permissions.admin() ? await Admin.count() : null,
+		settingsRead: session?.permissions.settings(),
 		self: session
 			? JSON.parse(JSON.stringify(await Admin.findOne({ where: { id: session.userId } })))
 			: null

src/routes/admin/+layout.svelte

@@ -1,11 +1,18 @@
 <script lang="ts">
 	import { page } from '$app/stores';
 	import { env } from '$env/dynamic/public';
-	import { ArrowLeftOnRectangle, Cog6Tooth, Flag, UserGroup, Users } from 'svelte-heros-v2';
+	import {
+		ArrowLeftOnRectangle,
+		Cog6Tooth,
+		Flag,
+		UserGroup,
+		Users,
+		BookOpen
+	} from 'svelte-heros-v2';
 	import { buttonTriggeredRequest } from '$lib/components/utils';
 	import { goto } from '$app/navigation';
 	import type { LayoutData } from './$types';
-	import { adminCount, errorMessage, reportCount } from '$lib/stores';
+	import { adminCount, errorMessage, reportCount, feedbackCount } from '$lib/stores';
 	import ErrorToast from '$lib/components/Toast/ErrorToast.svelte';
 
 	async function logout() {
@@ -21,6 +28,7 @@
 
 	export let data: LayoutData;
 	if (data.reportCount) $reportCount = data.reportCount;
+	if (data.feedbackCount) $feedbackCount = data.feedbackCount;
 	if (data.adminCount) $adminCount = data.adminCount;
 
 	let tabs = [
@@ -38,6 +46,13 @@
 			badge: $reportCount,
 			enabled: data.reportCount != null
 		},
+		{
+			path: `${env.PUBLIC_BASE_PATH}/admin/feedback`,
+			icon: BookOpen,
+			name: 'Feedback',
+			badge: $feedbackCount,
+			enabled: data.feedbackCount != null
+		},
 		{
 			path: `${env.PUBLIC_BASE_PATH}/admin/admin`,
 			icon: Users,

src/routes/admin/+page.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { PageData } from './$types';
 	import { env } from '$env/dynamic/public';
-	import { Cog6Tooth, Flag, UserGroup, Users } from 'svelte-heros-v2';
+	import { BookOpen, Cog6Tooth, Flag, UserGroup, Users } from 'svelte-heros-v2';
 
 	export let data: PageData;
 
@@ -18,6 +18,12 @@
 			name: 'Reports',
 			enabled: data.reportCount != null
 		},
+		{
+			path: `${env.PUBLIC_BASE_PATH}/admin/feedback`,
+			icon: BookOpen,
+			name: 'Feedback',
+			enabled: data.feedbackCount != null
+		},
 		{
 			path: `${env.PUBLIC_BASE_PATH}/admin/admin`,
 			icon: Users,
@@ -38,11 +44,11 @@
 		{#if tab.enabled}
 			<div class="flex flex-col gap-4 justify-center items-center">
 				<a
-					class="h-64 w-64 border flex justify-center items-center rounded-xl duration-100 hover:bg-base-200"
+					class="h-48 w-48 border flex justify-center items-center rounded-xl duration-100 hover:bg-base-200"
 					href={tab.path}
 					title={tab.name}
 				>
-					<svelte:component this={tab.icon} width="5rem" height="5rem" />
+					<svelte:component this={tab.icon} width="10rem" height="10rem" />
 				</a>
 				<span>{tab.name}</span>
 			</div>

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

@@ -10,7 +10,7 @@ export const load: PageServerLoad = async ({ parent, cookies }) => {
 	if (adminCount == null) throw redirect(302, `${env.PUBLIC_BASE_PATH}/admin`);
 
 	let admins: (typeof Admin.prototype)[] = [];
-	if (getSession(cookies, { permissions: [Permissions.AdminRead] }) != null) {
+	if (getSession(cookies, { permissions: [Permissions.Admin] }) != null) {
 		admins = await Admin.findAll({ raw: true, attributes: { exclude: ['password'] } });
 	}
 

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

@@ -12,14 +12,11 @@
 	import { adminCount } from '$lib/stores';
 
 	let allPermissionBadges = {
-		'Admin Read': Permissions.AdminRead,
-		'Admin Write': Permissions.AdminWrite,
-		'User Read': Permissions.UserRead,
-		'User Write': Permissions.UserWrite,
-		'Report Read': Permissions.ReportRead,
-		'Report Write': Permissions.ReportWrite,
-		'Settings Read': Permissions.SettingsRead,
-		'Settings Write': Permissions.SettingsWrite
+		Admin: Permissions.Admin,
+		Users: Permissions.Users,
+		Reports: Permissions.Reports,
+		Feedback: Permissions.Feedback,
+		Settings: Permissions.Settings
 	};
 
 	let newAdminUsername: string;
@@ -113,20 +110,13 @@
 		{#each data.admins as admin, i}
 			<tr>
 				<td>{i + 1}</td>
-				<td
-					><Input
-						type="text"
-						bind:value={admin.username}
-						disabled={!permissions.adminWrite() || !admin.edit}
-						size="sm"
-					/></td
-				>
+				<td><Input type="text" bind:value={admin.username} disabled={!admin.edit} size="sm" /></td>
 				<td
 					><Input
 						type="password"
 						bind:value={admin.password}
 						placeholder="Neues Passwort..."
-						disabled={!permissions.adminWrite() || !admin.edit}
+						disabled={!admin.edit}
 						size="sm"
 					/></td
 				>
@@ -134,16 +124,15 @@
 					><Badges
 						bind:value={admin.permissions}
 						available={allPermissionBadges}
-						disabled={!permissions.adminWrite() || !admin.edit}
+						disabled={!admin.edit}
 					/></td
 				>
 				<td>
 					<div>
 						{#if admin.edit}
-							<span class="w-min" class:cursor-not-allowed={!permissions.adminWrite()}>
+							<span class="w-min" class:cursor-not-allowed={!permissions.admin()}>
 								<button
 									class="btn btn-sm btn-square"
-									disabled={!permissions.adminWrite()}
 									on:click={async (e) => {
 										await buttonTriggeredRequest(
 											e,
@@ -161,10 +150,9 @@
 									<Check size="18" />
 								</button>
 							</span>
-							<span class="w-min" class:cursor-not-allowed={!permissions.adminWrite()}>
+							<span class="w-min" class:cursor-not-allowed={!permissions.admin()}>
 								<button
 									class="btn btn-sm btn-square"
-									disabled={!permissions.adminWrite()}
 									on:click={() => {
 										admin.edit = false;
 										admin = admin.before;
@@ -174,10 +162,9 @@
 								</button>
 							</span>
 						{:else}
-							<span class="w-min" class:cursor-not-allowed={!permissions.adminWrite()}>
+							<span class="w-min" class:cursor-not-allowed={!permissions.admin()}>
 								<button
 									class="btn btn-sm btn-square"
-									disabled={!permissions.adminWrite()}
 									on:click={() => {
 										admin.edit = true;
 										admin.before = structuredClone(admin);
@@ -186,10 +173,9 @@
 									<PencilSquare size="18" />
 								</button>
 							</span>
-							<span class="w-min" class:cursor-not-allowed={!permissions.adminWrite()}>
+							<span class="w-min" class:cursor-not-allowed={!permissions.admin()}>
 								<button
 									class="btn btn-sm btn-square"
-									disabled={!permissions.adminWrite()}
 									on:click={(e) => buttonTriggeredRequest(e, deleteAdmin(admin.id))}
 								>
 									<Trash size="18" />
@@ -204,23 +190,12 @@
 			<td>{data.admins.length + 1}</td>
 			<td><Input type="text" bind:value={newAdminUsername} size="sm" /></td>
 			<td><Input type="password" bind:value={newAdminPassword} size="sm" /></td>
-			<td
-				><Badges
-					bind:value={newAdminPermissions}
-					available={allPermissionBadges}
-					disabled={!permissions.adminWrite()}
-				/></td
-			>
+			<td><Badges bind:value={newAdminPermissions} available={allPermissionBadges} /></td>
 			<td>
-				<span
-					class="w-min"
-					class:cursor-not-allowed={!permissions.adminWrite() ||
-						!newAdminUsername ||
-						!newAdminPassword}
-				>
+				<span class="w-min" class:cursor-not-allowed={!newAdminUsername || !newAdminPassword}>
 					<button
 						class="btn btn-sm btn-square"
-						disabled={!permissions.adminWrite() || !newAdminUsername || !newAdminPassword}
+						disabled={!newAdminUsername || !newAdminPassword}
 						on:click={async (e) => {
 							await buttonTriggeredRequest(
 								e,

src/routes/admin/admin/+server.ts

@@ -5,7 +5,7 @@ import { Admin } from '$lib/server/database';
 import { AdminDeleteSchema, AdminEditSchema, AdminListSchema } from './schema';
 
 export const POST = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.AdminWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Admin] }) == null) {
 		return new Response(null, { status: 401 });
 	}
 
@@ -29,7 +29,7 @@ export const POST = (async ({ request, cookies }) => {
 }) satisfies RequestHandler;
 
 export const PATCH = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.AdminWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Admin] }) == null) {
 		return new Response(null, { status: 401 });
 	}
 
@@ -51,7 +51,7 @@ export const PATCH = (async ({ request, cookies }) => {
 }) satisfies RequestHandler;
 
 export const DELETE = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.AdminWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Admin] }) == null) {
 		return new Response(null, { status: 401 });
 	}
 

src/routes/admin/feedback/+page.svelte

@@ -0,0 +1,180 @@
+<script lang="ts">
+	import type { Feedback } from '$lib/server/database';
+	import { browser } from '$app/environment';
+	import { env } from '$env/dynamic/public';
+	import { fly } from 'svelte/transition';
+	import HeaderBar from './HeaderBar.svelte';
+	import PaginationTableBody from '$lib/components/PaginationTable/PaginationTableBody.svelte';
+	import { MagnifyingGlass, Share } from 'svelte-heros-v2';
+	import { goto } from '$app/navigation';
+	import Input from '$lib/components/Input/Input.svelte';
+	import Textarea from '$lib/components/Input/Textarea.svelte';
+	import { onDestroy, onMount } from 'svelte';
+
+	let feedback: (typeof Feedback.prototype.dataValues)[] = [];
+	let feedbackPerRequest = 25;
+	let feedbackFilter = { event: null, content: null, username: null };
+	let activeFeedback: typeof Feedback.prototype.dataValues | null = null;
+
+	async function fetchFeedback(extendedFilter?: {
+		limit?: number;
+		from?: number;
+		hash?: string;
+	}): Promise<Feedback[]> {
+		if (!browser) return [];
+
+		const response = await fetch(`${env.PUBLIC_BASE_PATH}/admin/feedback`, {
+			method: 'POST',
+			body: JSON.stringify({
+				...feedbackFilter,
+				limit: extendedFilter?.limit ?? feedbackPerRequest,
+				from: extendedFilter?.from ?? feedback.length
+			})
+		});
+		return await response.json();
+	}
+
+	async function openHashReport() {
+		if (!window.location.hash) return;
+
+		const requestedHash = window.location.hash.substring(1);
+		let f = feedback.find((r) => r.url_hash === requestedHash);
+		if (!f) {
+			const hashFeedback = (await fetchFeedback({ hash: requestedHash }))[0];
+			if (hashFeedback) {
+				feedback = [hashFeedback, ...feedback];
+				f = feedback;
+			} else {
+				await goto(window.location.href.split('#')[0], { replaceState: true });
+				return;
+			}
+		}
+
+		activeFeedback = feedback;
+	}
+
+	onMount(async () => {
+		if (browser) window.addEventListener('hashchange', openHashReport);
+	});
+	onDestroy(() => {
+		if (browser) window.removeEventListener('hashchange', openHashReport);
+	});
+
+	$: if (feedbackFilter) fetchFeedback({ from: 0 }).then((r) => (feedback = r));
+</script>
+
+<div class="h-full flex flex-row">
+	<div class="w-full flex flex-col overflow-hidden">
+		<HeaderBar bind:feedbackFilter />
+		<hr class="divider my-1 mx-8 border-none" />
+		<table class="table table-fixed h-fit">
+			<thead>
+				<tr>
+					<th>Event</th>
+					<th>Nutzer</th>
+					<th>Datum</th>
+					<th>Inhalt</th>
+				</tr>
+			</thead>
+			<PaginationTableBody
+				onUpdate={async () =>
+					await fetchFeedback().then((res) => (feedback = [...feedback, ...res]))}
+			>
+				{#each feedback as feedback}
+					<tr
+						class="hover [&>*]:text-sm cursor-pointer"
+						class:bg-base-200={activeFeedback?.url_hash === feedback.url_hash}
+						on:click={() => {
+							goto(`${window.location.href.split('#')[0]}#${feedback.url_hash}`, {
+								replaceState: true
+							});
+							activeFeedback = feedback;
+						}}
+					>
+						<td title={feedback.event}>{feedback.event}</td>
+						<td class="flex">
+							{feedback.user?.username || ''}
+							{#if feedback.user}
+								<button
+									class="pl-1"
+									title="Nach Ersteller filtern"
+									on:click|stopPropagation={() =>
+										(feedbackFilter.username = feedback.user?.username)}
+								>
+									<MagnifyingGlass size="14" />
+								</button>
+							{/if}
+						</td>
+						<td
+							>{new Intl.DateTimeFormat('de-DE', {
+								year: 'numeric',
+								month: '2-digit',
+								day: '2-digit',
+								hour: '2-digit',
+								minute: '2-digit'
+							}).format(new Date(feedback.updatedAt))} Uhr</td
+						>
+						<td>{feedback.content}...</td>
+					</tr>
+				{/each}
+			</PaginationTableBody>
+		</table>
+	</div>
+	{#if activeFeedback}
+		<div
+			class="relative flex flex-col w-2/5 h-[calc(100vh-3rem)] bg-base-200/50 px-4 py-6 overflow-scroll"
+			transition:fly={{ x: 200, duration: 200 }}
+		>
+			<div class="absolute right-2 top-2 flex justify-center">
+				<form class="dropdown dropdown-end">
+					<!-- svelte-ignore a11y-no-noninteractive-tabindex a11y-label-has-associated-control -->
+					<label tabindex="0" class="btn btn-sm btn-circle btn-ghost text-center">
+						<Share size="1rem" />
+					</label>
+					<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
+					<ul
+						tabindex="0"
+						class="dropdown-content z-[1] menu p-2 shadow bg-base-100 rounded-box w-max"
+					>
+						<li>
+							<button
+								on:click={() => {
+									navigator.clipboard.writeText(
+										`${window.location.protocol}//${window.location.host}${env.PUBLIC_BASE_PATH}/admin/reports#${activeFeedback.url_hash}`
+									);
+								}}
+							>
+								Internen Link kopieren
+							</button>
+							<button
+								on:click={() =>
+									navigator.clipboard.writeText(
+										`${window.location.protocol}//${window.location.host}${env.PUBLIC_BASE_PATH}/report/${activeFeedback.url_hash}`
+									)}>Öffentlichen Link kopieren</button
+							>
+						</li>
+					</ul>
+				</form>
+				<button
+					class="btn btn-sm btn-circle btn-ghost"
+					on:click={() => {
+						activeFeedback = null;
+						goto(window.location.href.split('#')[0], { replaceState: true });
+					}}>✕</button
+				>
+			</div>
+			<h3 class="font-roboto font-semibold text-2xl mb-2">Feedback</h3>
+			<div class="w-full">
+				<Input
+					readonly={true}
+					size="sm"
+					value={activeFeedback.user?.username || ''}
+					pickyWidth={false}
+				>
+					<span slot="label">Nutzer</span>
+				</Input>
+				<Textarea readonly={true} rows={4} label="Feedback" value={activeFeedback.content} />
+			</div>
+		</div>
+	{/if}
+</div>

src/routes/admin/feedback/+server.ts

@@ -0,0 +1,50 @@
+import type { RequestHandler } from '@sveltejs/kit';
+import { getSession } from '$lib/server/session';
+import { Permissions } from '$lib/permissions';
+import { FeedbackListSchema } from './schema';
+import { Feedback, sequelize, User } from '$lib/server/database';
+import { type Attributes, Op } from 'sequelize';
+
+export const POST = (async ({ request, cookies }) => {
+	if (getSession(cookies, { permissions: [Permissions.Feedback] }) == null) {
+		return new Response(null, {
+			status: 401
+		});
+	}
+
+	const parseResult = await FeedbackListSchema.safeParseAsync(await request.json());
+	if (!parseResult.success) {
+		return new Response(null, {
+			status: 400
+		});
+	}
+	const data = parseResult.data;
+
+	let feedbackFindOptions: Attributes<Feedback> = {};
+	if (data.event) Object.assign(feedbackFindOptions, { event: { [Op.like]: `%${data.event}%` } });
+	// prettier-ignore
+	if (data.content) Object.assign(feedbackFindOptions, { content: { [Op.like]: `%${data.content}%` } });
+	if (data.username)
+		Object.assign(feedbackFindOptions, {
+			user_id: await User.findAll({
+				attributes: ['id'],
+				where: { username: { [Op.like]: `%${data.username}%` } }
+			}).then((users) => users.map((user) => user.id))
+		});
+	if (data.hash) Object.assign(feedbackFindOptions, { url_hash: data.hash, from: 0, limit: 1 });
+
+	let feedback = await Feedback.findAll({
+		where: feedbackFindOptions,
+		// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+		// @ts-ignore
+		attributes: {
+			exclude: ['content'],
+			include: [[sequelize.literal('SUBSTR(content, 0, 50)'), 'content']]
+		},
+		include: { model: User, as: 'user' },
+		offset: data.from || 0,
+		limit: data.limit || 100
+	});
+
+	return new Response(JSON.stringify(feedback));
+}) satisfies RequestHandler;

src/routes/admin/feedback/HeaderBar.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+	import Input from '$lib/components/Input/Input.svelte';
+
+	export let feedbackFilter: { [k: string]: any } = {
+		event: null,
+		content: null,
+		username: null
+	};
+</script>
+
+<form class="flex flex-row justify-center space-x-4 mx-4 my-2">
+	<Input size="sm" placeholder="Alle" bind:value={feedbackFilter.username}>
+		<span slot="label">Nutzer</span>
+	</Input>
+	<Input size="sm" placeholder="Alle" bind:value={feedbackFilter.event}>
+		<span slot="label">Event</span>
+	</Input>
+	<Input size="sm" placeholder="Alle" bind:value={feedbackFilter.content}>
+		<span slot="label">Inhalt</span>
+	</Input>
+</form>

src/routes/admin/feedback/schema.ts

@@ -0,0 +1,13 @@
+import { z } from 'zod';
+
+export const FeedbackListSchema = z.object({
+	limit: z.number().nullish(),
+	from: z.number().nullish(),
+
+	event: z.string().nullish(),
+	content: z.string().nullish(),
+
+	hash: z.string().nullish(),
+
+	username: z.string().nullish()
+});

src/routes/admin/reports/+server.ts

@@ -10,7 +10,7 @@ import { webhookUserReported } from '$lib/server/webhook';
 import { ReportAddSchema, ReportEditSchema, ReportListSchema } from './schema';
 
 export const POST = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.ReportRead] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Reports] }) == null) {
 		return new Response(null, {
 			status: 401
 		});
@@ -18,7 +18,6 @@ export const POST = (async ({ request, cookies }) => {
 
 	const parseResult = await ReportListSchema.safeParseAsync(await request.json());
 	if (!parseResult.success) {
-		console.log(parseResult.error);
 		return new Response(null, {
 			status: 400
 		});
@@ -89,7 +88,7 @@ export const POST = (async ({ request, cookies }) => {
 }) satisfies RequestHandler;
 
 export const PATCH = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.ReportWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Reports] }) == null) {
 		return new Response(null, {
 			status: 401
 		});
@@ -163,7 +162,7 @@ export const PATCH = (async ({ request, cookies }) => {
 }) satisfies RequestHandler;
 
 export const PUT = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.ReportWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Reports] }) == null) {
 		return new Response(null, {
 			status: 401
 		});

src/routes/admin/settings/+page.server.ts

@@ -6,7 +6,7 @@ import { env } from '$env/dynamic/public';
 import { Settings } from '$lib/server/database';
 
 export const load: PageServerLoad = async ({ parent, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.SettingsRead] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Settings] }) == null) {
 		throw redirect(302, `${env.PUBLIC_BASE_PATH}/admin`);
 	}
 

src/routes/admin/settings/+server.ts

@@ -5,7 +5,7 @@ import { Permissions } from '$lib/permissions';
 import { Settings } from '$lib/server/database';
 
 export const POST = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.SettingsWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Settings] }) == null) {
 		return new Response(null, {
 			status: 401
 		});

src/routes/admin/users/+page.server.ts

@@ -11,6 +11,6 @@ export const load: PageServerLoad = async ({ parent, cookies }) => {
 
 	return {
 		count:
-			getSession(cookies, { permissions: [Permissions.UserRead] }) != null ? await User.count() : 0
+			getSession(cookies, { permissions: [Permissions.Users] }) != null ? await User.count() : 0
 	};
 };

src/routes/admin/users/+server.ts

@@ -7,7 +7,7 @@ import { ApiError, getJavaUuid, getNoAuthUuid, UserNotFoundError } from '$lib/se
 import { UserAddSchema, UserDeleteSchema, UserEditSchema, UserListSchema } from './schema';
 
 export const POST = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.UserRead] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Users] }) == null) {
 		return new Response(null, {
 			status: 401
 		});
@@ -51,7 +51,7 @@ export const POST = (async ({ request, cookies }) => {
 }) satisfies RequestHandler;
 
 export const PATCH = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.UserWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Users] }) == null) {
 		return new Response(null, {
 			status: 401
 		});
@@ -83,7 +83,7 @@ export const PATCH = (async ({ request, cookies }) => {
 }) satisfies RequestHandler;
 
 export const PUT = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.UserWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Users] }) == null) {
 		return new Response(null, {
 			status: 401
 		});
@@ -152,7 +152,7 @@ export const PUT = (async ({ request, cookies }) => {
 }) satisfies RequestHandler;
 
 export const DELETE = (async ({ request, cookies }) => {
-	if (getSession(cookies, { permissions: [Permissions.UserWrite] }) == null) {
+	if (getSession(cookies, { permissions: [Permissions.Users] }) == null) {
 		return new Response(null, {
 			status: 401
 		});

src/routes/api/feedback/+server.ts

@@ -0,0 +1,50 @@
+import type { RequestHandler } from '@sveltejs/kit';
+import { env } from '$env/dynamic/private';
+import { FeedbackAddSchema } from './schema';
+import { Feedback, User } from '$lib/server/database';
+import crypto from 'crypto';
+import type { CreationAttributes } from 'sequelize';
+import { env as public_env } from '$env/dynamic/public';
+
+export const POST = (async ({ request, url }) => {
+	if (env.REPORT_SECRET && url.searchParams.get('secret') !== env.REPORT_SECRET)
+		return new Response(null, { status: 401 });
+
+	const parseResult = await FeedbackAddSchema.safeParseAsync(await request.json());
+	if (!parseResult.success) {
+		return new Response(null, { status: 400 });
+	}
+	const data = parseResult.data;
+
+	const feedback = {} as { [k: string]: CreationAttributes<Feedback> };
+	for (const user of await User.findAll({
+		where: { uuid: data.users },
+		attributes: ['id', 'uuid']
+	})) {
+		feedback[user.uuid] = {
+			url_hash: crypto.randomBytes(18).toString('hex'),
+			event: data.event,
+			draft: true,
+			user_id: user.id
+		};
+	}
+
+	await Feedback.bulkCreate(Object.values(feedback));
+
+	console.log(Object.entries(feedback));
+
+	return new Response(
+		JSON.stringify(
+			Object.entries(feedback).reduce(
+				(curr, [k, v]) => {
+					curr[k] = `${url.protocol}//${url.host}${public_env.PUBLIC_BASE_PATH || ''}/feedback/${
+						v.url_hash
+					}`;
+					return curr;
+				},
+				{} as { [k: string]: string }
+			)
+		),
+		{ status: 201 }
+	);
+}) satisfies RequestHandler;

src/routes/api/feedback/schema.ts

@@ -0,0 +1,6 @@
+import { z } from 'zod';
+
+export const FeedbackAddSchema = z.object({
+	event: z.string(),
+	users: z.array(z.string())
+});

src/routes/api/report/+server.ts

@@ -5,7 +5,7 @@ import { env as public_env } from '$env/dynamic/public';
 import { env } from '$env/dynamic/private';
 import { ReportAddSchema } from './schema';
 
-export const GET = async ({ url }) => {
+export const GET = (async ({ url }) => {
 	if (env.REPORT_SECRET && url.searchParams.get('secret') !== env.REPORT_SECRET)
 		return new Response(null, { status: 401 });
 
@@ -52,7 +52,7 @@ export const GET = async ({ url }) => {
 	};
 
 	return new Response(JSON.stringify(reports), { status: 200 });
-};
+}) satisfies RequestHandler;
 
 export const POST = (async ({ request, url }) => {
 	if (env.REPORT_SECRET && url.searchParams.get('secret') !== env.REPORT_SECRET)

src/routes/feedback/+page.ts

@@ -0,0 +1,7 @@
+import type { PageLoad } from './$types';
+import { redirect } from '@sveltejs/kit';
+import { env } from '$env/dynamic/public';
+
+export const load: PageLoad = async () => {
+	throw redirect(302, `${env.PUBLIC_BASE_PATH}/`);
+};

src/routes/feedback/[...url_hash]/+layout.svelte

@@ -0,0 +1,3 @@
+<div class="flex justify-center items-center w-full min-h-screen h-full">
+	<slot />
+</div>

src/routes/feedback/[...url_hash]/+page.server.ts

@@ -0,0 +1,18 @@
+import type { PageServerLoad } from './$types';
+import { Feedback } from '$lib/server/database';
+import { redirect } from '@sveltejs/kit';
+import { env } from '$env/dynamic/public';
+
+export const load: PageServerLoad = async ({ params }) => {
+	const feedback = await Feedback.findOne({
+		where: { url_hash: params.url_hash }
+	});
+
+	if (!feedback) throw redirect(302, `${env.PUBLIC_BASE_PATH}/`);
+
+	return {
+		draft: feedback.content === null,
+		event: feedback.event,
+		anonymous: feedback.user_id === null
+	};
+};

src/routes/feedback/[...url_hash]/+page.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+	import { fly } from 'svelte/transition';
+	import type { PageData } from './$types';
+	import FeedbackDraft from './FeedbackDraft.svelte';
+	import FeedbackSent from './FeedbackSent.svelte';
+
+	export let data: PageData;
+</script>
+
+<svelte:head>
+	<title>Feedback</title>
+	<!-- just in case... -->
+	<meta name="robots" content="noindex" />
+</svelte:head>
+
+<div class="absolute top-12 grid card w-11/12 xl:w-2/3 2xl:w-1/2 p-6 shadow-lg">
+	{#if data.draft}
+		<div class="col-[1] row-[1]" transition:fly={{ x: -200, duration: 300 }}>
+			<FeedbackDraft
+				event={data.event}
+				anonymous={data.anonymous}
+				on:submit={() => (data.draft = false)}
+			/>
+		</div>
+	{:else}
+		<div class="col-[1] row-[1]" transition:fly={{ x: 200, duration: 300 }}>
+			<FeedbackSent />
+		</div>
+	{/if}
+</div>

src/routes/feedback/[...url_hash]/+server.ts

@@ -0,0 +1,24 @@
+import type { RequestHandler } from '@sveltejs/kit';
+import { Feedback } from '$lib/server/database';
+import { FeedbackSubmitSchema } from './schema';
+
+export const POST = (async ({ request, params }) => {
+	const feedback = await Feedback.findOne({ where: { url_hash: params.url_hash } });
+
+	if (feedback == null) return new Response(null, { status: 400 });
+
+	const parseResult = await FeedbackSubmitSchema.safeParseAsync(await request.json());
+	if (!parseResult.success) {
+		return new Response(null, { status: 400 });
+	}
+	const data = parseResult.data;
+
+	feedback.content = data.content;
+	// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+	// @ts-ignore
+	if (data.anonymous) feedback.user_id = null;
+
+	await feedback.save();
+
+	return new Response(null, { status: 200 });
+}) satisfies RequestHandler;

src/routes/feedback/[...url_hash]/FeedbackDraft.svelte

@@ -0,0 +1,78 @@
+<script lang="ts">
+	import Input from '$lib/components/Input/Input.svelte';
+	import Textarea from '$lib/components/Input/Textarea.svelte';
+	import { createEventDispatcher } from 'svelte';
+	import { env } from '$env/dynamic/public';
+	import { page } from '$app/stores';
+
+	export let event: string;
+	export let anonymous: boolean;
+
+	const dispatch = createEventDispatcher();
+
+	let content = '';
+	let sendAnonymous = true;
+
+	let submitModal: HTMLDialogElement;
+
+	async function submitFeedback() {
+		await fetch(`${env.PUBLIC_BASE_PATH}/feedback/${$page.params.url_hash}`, {
+			method: 'POST',
+			body: JSON.stringify({
+				content: content,
+				anonymous: sendAnonymous
+			})
+		});
+	}
+</script>
+
+<div>
+	<h2 class="text-3xl text-center">Feedback</h2>
+	<form on:submit|preventDefault={() => submitModal.show()}>
+		<div class="space-y-4 my-4">
+			<Input size="sm" pickyWidth={false} disabled value={event}>
+				<span slot="label">Event</span>
+			</Input>
+			<Textarea required={true} rows={4} label="Feedback" bind:value={content} />
+			<div>
+				<Input type="submit" disabled={content === ''} value="Feedback senden" />
+			</div>
+		</div>
+	</form>
+</div>
+
+<dialog class="modal" bind:this={submitModal}>
+	<form method="dialog" class="modal-box">
+		<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
+		<div>
+			<h3 class="font-roboto font-medium text-xl">Feedback abschicken?</h3>
+			<div class="my-4">
+				<p>Nach dem Abschicken des Feedbacks lässt es sich nicht mehr bearbeiten.</p>
+				{#if !anonymous}
+					<div class="flex items-center gap-2 mt-2">
+						<Input type="checkbox" id="anonymous" size="xs" checked />
+						<label
+							for="anonymous"
+							title="Dein Spielername wird nach dem Abschicken nicht mit dem Feedback zusammen gespeichert"
+							>Anonym senden</label
+						>
+					</div>
+				{/if}
+			</div>
+			<div class="flex flex-row space-x-1">
+				<Input
+					type="submit"
+					value="Abschicken"
+					on:click={async () => {
+						await submitFeedback();
+						dispatch('submit');
+					}}
+				/>
+				<Input type="submit" value="Abbrechen" />
+			</div>
+		</div>
+	</form>
+	<form method="dialog" class="modal-backdrop bg-[rgba(0,0,0,.3)]">
+		<button>close</button>
+	</form>
+</dialog>

src/routes/feedback/[...url_hash]/FeedbackSent.svelte

@@ -0,0 +1,4 @@
+<div>
+	<h2 class="text-2xl text-center">Feedback abgeschickt</h2>
+	<p class="mt-4">Das Feedback wurde abgeschickt.</p>
+</div>

src/routes/feedback/[...url_hash]/schema.ts

@@ -0,0 +1,6 @@
+import { z } from 'zod';
+
+export const FeedbackSubmitSchema = z.object({
+	content: z.string(),
+	anonymous: z.boolean()
+});