src/lib/components/Input/Search.svelte

@@ -2,6 +2,7 @@
 	let {
 		id,
 		value = $bindable(),
+		inputValue = $bindable(),
 		suggestionRequired = false,
 		emptyAllowed = false,
 		searchSuggestionFunc = () => Promise.resolve([]),
@@ -12,7 +13,8 @@
 		onsubmit
 	}: {
 		id?: string;
-		value: string;
+		value?: string;
+		inputValue?: string;
 		suggestionRequired?: boolean;
 		emptyAllowed?: boolean;
 		searchSuggestionFunc?: (input: string) => Promise<{ name: string; value: string }[]>;
@@ -23,8 +25,10 @@
 		onsubmit?: (event: Event & { input: string; value: string }) => void;
 	} = $props();
 
-	let elemValue = $state(value);
 	let searchSuggestions: { name: string; value: string }[] = $state([]);
+	$effect(() => {
+		if (!suggestionRequired) value = inputValue;
+	});
 </script>
 
 <div class="relative">
@@ -41,7 +45,6 @@
 		{/if}
 		<input
 			type="search"
-			autocomplete="off"
 			class="input input-bordered w-full"
 			class:input-xs={size === 'xs'}
 			class:input-sm={size === 'sm'}
@@ -49,33 +52,33 @@
 			class:input-lg={size === 'lg'}
 			{id}
 			{required}
-			bind:value={elemValue}
-			oninput={async (e: Event & { currentTarget: EventTarget & HTMLInputElement }) => {
-				searchSuggestions = await searchSuggestionFunc(elemValue);
-				const searchSuggestion = searchSuggestions.find((v) => v.name === elemValue);
-				if (searchSuggestion !== undefined) {
-					elemValue = searchSuggestion.name;
-					value = searchSuggestion.value;
-					searchSuggestions = [];
-					(e.currentTarget || e.target).setCustomValidity('');
-					onsubmit?.(Object.assign(e, { input: elemValue, value: value }));
-				} else if (elemValue === '' && emptyAllowed) {
-					onsubmit?.(Object.assign(e, { input: '', value: '' }));
-				} else {
-					value = '';
-				}
+			bind:value={inputValue}
+			oninput={(e: Event & { currentTarget: EventTarget & HTMLInputElement }) => {
+				value = '';
+				searchSuggestionFunc(inputValue).then((v) => {
+					searchSuggestions = v;
+					const searchSuggestion = v.find((v) => v.name === inputValue);
+					if (searchSuggestion !== undefined) {
+						inputValue = searchSuggestion.name;
+						value = searchSuggestion.value;
+						searchSuggestions = [];
+						e.currentTarget.setCustomValidity('');
+						onsubmit?.(Object.assign(e, { input: inputValue, value: value }));
+					} else if (inputValue === '' && emptyAllowed) {
+						onsubmit?.(Object.assign(e, { input: '', value: '' }));
+					}
+				});
 			}}
 			oninvalid={(e: Event & { currentTarget: EventTarget & HTMLInputElement }) => {
 				if (invalidMessage) e.currentTarget.setCustomValidity(invalidMessage);
 			}}
-			onfocus={() => searchSuggestionFunc(elemValue).then((v) => (searchSuggestions = v))}
 			pattern={suggestionRequired
-				? `${value ? elemValue : 'a^' + (emptyAllowed ? '|$^' : '')}`
+				? `${value ? inputValue : 'a^' + (emptyAllowed ? '|$^' : '')}`
 				: null}
 		/>
 	</div>
 
-	{#if elemValue && searchSuggestions.length !== 0}
+	{#if inputValue && searchSuggestions.length !== 0}
 		<ul class="absolute bg-base-200 w-full z-20 menu menu-sm rounded-box">
 			{#each searchSuggestions as searchSuggestion}
 				<li class="w-full text-left">
@@ -83,10 +86,10 @@
 						class="block w-full overflow-hidden text-ellipsis whitespace-nowrap"
 						title="{searchSuggestion.name} ({searchSuggestion.value})"
 						onclick={(e) => {
-							elemValue = searchSuggestion.name;
+							inputValue = searchSuggestion.name;
 							value = searchSuggestion.value;
 							searchSuggestions = [];
-							onsubmit?.(Object.assign(e, { input: elemValue, value: value }));
+							onsubmit?.(Object.assign(e, { input: inputValue, value: value }));
 						}}>{searchSuggestion.name}</button
 					>
 				</li>
@@ -96,7 +99,7 @@
 </div>
 
 <!-- close the search suggestions box when clicking outside -->
-{#if elemValue && searchSuggestions.length !== 0}
+{#if inputValue && searchSuggestions.length !== 0}
 	<button
 		aria-label=" "
 		class="absolute top-0 left-0 z-10 w-full h-full cursor-default"

src/lib/server/webhook.ts

@@ -1,15 +1,11 @@
 export async function webhookUserReported(endpoint: string, uuid: string) {
-	try {
-		await fetch(endpoint, {
-			method: 'POST',
-			headers: {
-				'Content-Type': 'application/json'
-			},
-			body: JSON.stringify({
-				user: uuid
-			})
-		});
-	} catch (e) {
-		throw (e as { message: string }).message;
-	}
+	await fetch(endpoint, {
+		method: 'POST',
+		headers: {
+			'Content-Type': 'application/json'
+		},
+		body: JSON.stringify({
+			user: uuid
+		})
+	});
 }

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

@@ -262,7 +262,7 @@
 					searchSuggestionFunc={usernameSuggestions}
 					invalidMessage="Es können nur registrierte Spieler reportet werden"
 					label="Reporteter User"
-					value={activeReport.reported?.username || ''}
+					inputValue={activeReport.reported?.username || ''}
 					onsubmit={(e) =>
 						(activeReport.reported = {
 							...activeReport.reported,

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

@@ -153,12 +153,8 @@ export const PATCH = (async ({ request, cookies }) => {
 
 	if (webhookTriggerUsers.length > 0 && data.status == 'reviewed' && env.REPORTED_WEBHOOK) {
 		for (const webhookTriggerUser of webhookTriggerUsers) {
-			try {
-				// no `await` to avoid blocking
-				webhookUserReported(env.REPORTED_WEBHOOK, webhookTriggerUser);
-			} catch (e) {
-				console.error(`failed to send reported webhook: ${e}`);
-			}
+			// no `await` to avoid blocking
+			webhookUserReported(env.REPORTED_WEBHOOK, webhookTriggerUser);
 		}
 	}
 

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

@@ -21,7 +21,7 @@
 			<ReportDraft
 				reason={data.reason}
 				reporterName={data.reporter.name}
-				reportedName={data.reported.name ?? null}
+				reportedName={data.reported.name ?? undefined}
 				users={data.users ?? []}
 				onsubmit={() => (completed = true)}
 			/>