fix(frontend): actually show eslint errors in vscode, fix eslint errors

Foxnouns.Frontend/.vscode/settings.json

@@ -4,5 +4,6 @@
 	"i18n-ally.localesPaths": ["src/lib/i18n", "src/lib/i18n/locales"],
 	"i18n-ally.keystyle": "nested",
 	"explorer.sortOrder": "filesFirst",
-	"explorer.compactFolders": false
+	"explorer.compactFolders": false,
+	"eslint.validate": ["javascript", "javascriptreact", "svelte"]
 }

Foxnouns.Frontend/src/lib/components/GlobalNotice.svelte

@@ -34,6 +34,7 @@
 {#if renderNotice}
 	<div class="alert alert-light" role="alert">
 		<div>
+			<!-- eslint-disable-next-line svelte/no-at-html-tags -->
 			{@html renderedMessage}
 		</div>
 		{#if canDismiss}

Foxnouns.Frontend/src/lib/components/admin/AuditLogEntryCard.svelte

@@ -59,6 +59,7 @@
 	{#if reason}
 		<details>
 			<summary>Reason</summary>
+			<!-- eslint-disable-next-line svelte/no-at-html-tags -->
 			{@html reason}
 		</details>
 	{:else}

Foxnouns.Frontend/src/lib/components/admin/ClosedReportAuditLog.svelte

@@ -29,6 +29,7 @@
 	<h4>Reason</h4>
 	<p>
 		{#if entry.reason}
+			<!-- eslint-disable-next-line svelte/no-at-html-tags -->
 			{@html renderMarkdown(entry.reason)}
 		{:else}
 			<em class="text-secondary">(no reason given)</em>

Foxnouns.Frontend/src/lib/i18n/locales/en.json

@@ -296,7 +296,8 @@
 		"custom-preference-notice": "Want to edit your custom preferences?",
 		"custom-preference-notice-link": "Go to settings",
 		"crop-avatar-header": "Crop avatar",
-		"crop-avatar-button": "Crop"
+		"crop-avatar-button": "Crop",
+		"max-custom-preferences": "You have reached the maximum amount of custom preferences ({{current}}/{{max}}), and cannot add new ones."
 	},
 	"cancel": "Cancel",
 	"report": {

Foxnouns.Frontend/src/routes/admin/reports/[id]/+page.svelte

@@ -56,6 +56,7 @@
 		<h3>Context</h3>
 		<p>
 			{#if report.context}
+				<!-- eslint-disable-next-line svelte/no-at-html-tags -->
 				{@html renderMarkdown(report.context)}
 			{:else}
 				<em>(no context given)</em>

Foxnouns.Frontend/src/routes/page/[page]/+page.svelte

@@ -18,5 +18,6 @@
 </svelte:head>
 
 <div class="container">
+	<!-- eslint-disable-next-line svelte/no-at-html-tags -->
 	{@html md}
 </div>

Foxnouns.Frontend/src/routes/settings/prefs/+page.svelte

@@ -7,6 +7,7 @@
 	import { t } from "$lib/i18n";
 	import log from "$lib/log";
 	import type { PageData } from "./$types";
+	import InfoCircleFill from "svelte-bootstrap-icons/lib/InfoCircleFill.svelte";
 
 	type Props = { data: PageData };
 	let { data }: Props = $props();
@@ -84,8 +85,19 @@
 	{$t("settings.custom-preferences-title")}
 	<div class="btn-group">
 		<button class="btn btn-primary" onclick={() => save()}>{$t("save-changes")}</button>
-		<button class="btn btn-success" onclick={add}>{$t("editor.add-custom-preference")}</button>
+		<button class="btn btn-success" onclick={add} disabled={!canAdd}
+			>{$t("editor.add-custom-preference")}</button
+		>
 	</div>
+	{#if !canAdd}
+		<div>
+			<InfoCircleFill aria-hidden />
+			{$t("editor.max-custom-preferences", {
+				current: customPreferences.length,
+				max: data.meta.limits.custom_preferences,
+			})}
+		</div>
+	{/if}
 </h3>
 
 <FormStatusMarker form={ok} />