From 92bf933c105f58297b69a444e837c538b74175da Mon Sep 17 00:00:00 2001
From: sam <sam@vulpine.solutions>
Date: Mon, 24 Feb 2025 17:13:46 +0100
Subject: [PATCH] feat(frontend): link custom preferences in profile editor

---
 Foxnouns.Frontend/src/lib/components/Error.svelte         | 2 ++
 .../lib/components/editor/CustomPreferencesNotice.svelte  | 8 ++++++++
 Foxnouns.Frontend/src/lib/i18n/locales/en.json            | 7 +++++--
 .../src/routes/settings/members/[id]/fields/+page.svelte  | 5 +++++
 .../settings/members/[id]/names-pronouns/+page.svelte     | 2 ++
 .../src/routes/settings/profile/fields/+page.svelte       | 5 +++++
 .../routes/settings/profile/names-pronouns/+page.svelte   | 2 ++
 7 files changed, 29 insertions(+), 2 deletions(-)
 create mode 100644 Foxnouns.Frontend/src/lib/components/editor/CustomPreferencesNotice.svelte

diff --git a/Foxnouns.Frontend/src/lib/components/Error.svelte b/Foxnouns.Frontend/src/lib/components/Error.svelte
index 7817dfa..c9e2c0e 100644
--- a/Foxnouns.Frontend/src/lib/components/Error.svelte
+++ b/Foxnouns.Frontend/src/lib/components/Error.svelte
@@ -12,6 +12,8 @@
 	<svelte:element this={headerElem ?? "h4"}>
 		{#if error.code === ErrorCode.BadRequest}
 			{$t("error.bad-request-header")}
+		{:else if error.status === 404}
+			{$t("error.not-found-header")}
 		{:else}
 			{$t("error.generic-header")}
 		{/if}
diff --git a/Foxnouns.Frontend/src/lib/components/editor/CustomPreferencesNotice.svelte b/Foxnouns.Frontend/src/lib/components/editor/CustomPreferencesNotice.svelte
new file mode 100644
index 0000000..319c1da
--- /dev/null
+++ b/Foxnouns.Frontend/src/lib/components/editor/CustomPreferencesNotice.svelte
@@ -0,0 +1,8 @@
+<script lang="ts">
+	import { t } from "$lib/i18n";
+</script>
+
+<div class="alert alert-secondary">
+	{$t("editor.custom-preference-notice")}
+	<a href="/settings/pref" class="alert-link">{$t("editor.custom-preference-notice-link")}</a>
+</div>
diff --git a/Foxnouns.Frontend/src/lib/i18n/locales/en.json b/Foxnouns.Frontend/src/lib/i18n/locales/en.json
index 0c2f958..1c15a83 100644
--- a/Foxnouns.Frontend/src/lib/i18n/locales/en.json
+++ b/Foxnouns.Frontend/src/lib/i18n/locales/en.json
@@ -121,7 +121,8 @@
 		"500-description": "Something went wrong on the server. Please try again later.",
 		"unknown-status-description": "Something went wrong, but we're not sure what. Please try again.",
 		"error-id": "If you report this error to the developers, please give them this ID:",
-		"page-not-found": "No page exists at this URL."
+		"page-not-found": "No page exists at this URL.",
+		"not-found-header": "That page could not be found"
 	},
 	"settings": {
 		"general-information-tab": "General information",
@@ -288,7 +289,9 @@
 		"custom-preference-size-small": "Small",
 		"custom-preference-size": "Text size",
 		"custom-preference-muted": "Show as muted text",
-		"custom-preference-favourite": "Treat like favourite"
+		"custom-preference-favourite": "Treat like favourite",
+		"custom-preference-notice": "Want to edit your custom preferences?",
+		"custom-preference-notice-link": "Go to settings"
 	},
 	"cancel": "Cancel",
 	"report": {
diff --git a/Foxnouns.Frontend/src/routes/settings/members/[id]/fields/+page.svelte b/Foxnouns.Frontend/src/routes/settings/members/[id]/fields/+page.svelte
index 491a45f..470f4f9 100644
--- a/Foxnouns.Frontend/src/routes/settings/members/[id]/fields/+page.svelte
+++ b/Foxnouns.Frontend/src/routes/settings/members/[id]/fields/+page.svelte
@@ -2,7 +2,9 @@
 	import { apiRequest } from "$api";
 	import ApiError, { type RawApiError } from "$api/error";
 	import { mergePreferences, type User } from "$api/models/user";
+	import CustomPreferencesNotice from "$components/editor/CustomPreferencesNotice.svelte";
 	import FieldsEditor from "$components/editor/FieldsEditor.svelte";
+	import NoscriptWarning from "$components/editor/NoscriptWarning.svelte";
 	import log from "$lib/log";
 	import type { PageData } from "./$types";
 
@@ -29,4 +31,7 @@
 	};
 </script>
 
+<NoscriptWarning />
+<CustomPreferencesNotice />
+
 <FieldsEditor bind:fields {ok} {allPreferences} {update} />
diff --git a/Foxnouns.Frontend/src/routes/settings/members/[id]/names-pronouns/+page.svelte b/Foxnouns.Frontend/src/routes/settings/members/[id]/names-pronouns/+page.svelte
index 19ed7e5..918381d 100644
--- a/Foxnouns.Frontend/src/routes/settings/members/[id]/names-pronouns/+page.svelte
+++ b/Foxnouns.Frontend/src/routes/settings/members/[id]/names-pronouns/+page.svelte
@@ -3,6 +3,7 @@
 	import ApiError, { type RawApiError } from "$api/error";
 	import type { Member } from "$api/models";
 	import { mergePreferences } from "$api/models/user";
+	import CustomPreferencesNotice from "$components/editor/CustomPreferencesNotice.svelte";
 	import FieldEditor from "$components/editor/FieldEditor.svelte";
 	import FormStatusMarker from "$components/editor/FormStatusMarker.svelte";
 	import NoscriptWarning from "$components/editor/NoscriptWarning.svelte";
@@ -40,6 +41,7 @@
 
 <NoscriptWarning />
 <FormStatusMarker form={ok} />
+<CustomPreferencesNotice />
 
 <div>
 	<FieldEditor name={$t("profile.names-header")} bind:entries={names} {allPreferences} />
diff --git a/Foxnouns.Frontend/src/routes/settings/profile/fields/+page.svelte b/Foxnouns.Frontend/src/routes/settings/profile/fields/+page.svelte
index 4c61a58..44b0cf7 100644
--- a/Foxnouns.Frontend/src/routes/settings/profile/fields/+page.svelte
+++ b/Foxnouns.Frontend/src/routes/settings/profile/fields/+page.svelte
@@ -2,7 +2,9 @@
 	import { apiRequest } from "$api";
 	import ApiError, { type RawApiError } from "$api/error";
 	import { mergePreferences, type User } from "$api/models/user";
+	import CustomPreferencesNotice from "$components/editor/CustomPreferencesNotice.svelte";
 	import FieldsEditor from "$components/editor/FieldsEditor.svelte";
+	import NoscriptWarning from "$components/editor/NoscriptWarning.svelte";
 	import log from "$lib/log";
 	import type { PageData } from "./$types";
 
@@ -29,4 +31,7 @@
 	};
 </script>
 
+<NoscriptWarning />
+<CustomPreferencesNotice />
+
 <FieldsEditor bind:fields {ok} {allPreferences} {update} />
diff --git a/Foxnouns.Frontend/src/routes/settings/profile/names-pronouns/+page.svelte b/Foxnouns.Frontend/src/routes/settings/profile/names-pronouns/+page.svelte
index e22c5d5..b787096 100644
--- a/Foxnouns.Frontend/src/routes/settings/profile/names-pronouns/+page.svelte
+++ b/Foxnouns.Frontend/src/routes/settings/profile/names-pronouns/+page.svelte
@@ -2,6 +2,7 @@
 	import { apiRequest } from "$api";
 	import ApiError, { type RawApiError } from "$api/error";
 	import { mergePreferences, type User } from "$api/models/user";
+	import CustomPreferencesNotice from "$components/editor/CustomPreferencesNotice.svelte";
 	import FieldEditor from "$components/editor/FieldEditor.svelte";
 	import FormStatusMarker from "$components/editor/FormStatusMarker.svelte";
 	import NoscriptWarning from "$components/editor/NoscriptWarning.svelte";
@@ -37,6 +38,7 @@
 
 <NoscriptWarning />
 <FormStatusMarker form={ok} />
+<CustomPreferencesNotice />
 
 <div>
 	<FieldEditor name={$t("profile.names-header")} bind:entries={names} {allPreferences} />