Refactor: rename account-form to settings-form and update translations

app/lib/actions/userProfileActions.ts

@@ -107,7 +107,7 @@ export const getUserProfile = withUser(async (user: AuthenticatedUser) => {
 export const updateUserProfile = withUser(async (user: AuthenticatedUser, prevState: State, formData: FormData) => {
     noStore();
 
-    const t = await getTranslations("account-form.validation");
+    const t = await getTranslations("settings-form.validation");
 
     const validatedFields = FormSchema(t).safeParse({
         firstName: formData.get('firstName') || undefined,

app/ui/AccountForm.tsx

@@ -6,7 +6,7 @@ import { updateUserProfile } from "../lib/actions/userProfileActions";
 import { useFormState, useFormStatus } from "react-dom";
 import { useLocale, useTranslations } from "next-intl";
 import Link from "next/link";
-import AccountCircleIcon from "@mui/icons-material/AccountCircle";
+import SettingsIcon from "@mui/icons-material/Settings";
 import { formatIban } from "../lib/formatStrings";
 import { InfoBox } from "./InfoBox";
 
@@ -22,7 +22,7 @@ type FormFieldsProps = {
 
 const FormFields: FC<FormFieldsProps> = ({ profile, errors, message }) => {
     const { pending } = useFormStatus();
-    const t = useTranslations("account-form");
+    const t = useTranslations("settings-form");
     const locale = useLocale();
 
     // Track current form values for real-time validation
@@ -194,12 +194,12 @@ const FormFields: FC<FormFieldsProps> = ({ profile, errors, message }) => {
 export const AccountForm: FC<AccountFormProps> = ({ profile }) => {
     const initialState = { message: null, errors: {} };
     const [state, dispatch] = useFormState(updateUserProfile, initialState);
-    const t = useTranslations("account-form");
+    const t = useTranslations("settings-form");
 
     return (
         <div className="card card-compact card-bordered min-w-[20em] max-w-[90em] bg-base-100 shadow-s my-1">
             <div className="card-body">
-                <h2 className="card-title"><AccountCircleIcon className="w-6 h-6" /> {t("title")}</h2>
+                <h2 className="card-title"><SettingsIcon className="w-6 h-6" /> {t("title")}</h2>
                 <form action={dispatch}>
                     <FormFields
                         profile={profile}

app/ui/PageHeader.tsx

@@ -1,7 +1,7 @@
 import Image from "next/image";
 import Link from "next/link";
 import { SelectLanguage } from "./SelectLanguage";
-import AccountCircleIcon from "@mui/icons-material/AccountCircle";
+import Settings from "@mui/icons-material/Settings";
 
 export const PageHeader = () =>
     <div className="navbar bg-base-100 mb-6">
@@ -9,6 +9,6 @@ export const PageHeader = () =>
         <span className="grow">&nbsp;</span>
         <SelectLanguage />
         <Link href="/account/" className="btn btn-ghost btn-circle">
-            <AccountCircleIcon className="w-6 h-6" />
+            <Settings className="w-6 h-6" />
         </Link>
     </div>

messages/en.json

@@ -164,8 +164,8 @@
       "validation-failed": "Validation failed. Please check the form and try again."
     }
   },
-  "account-form": {
+  "settings-form": {
-    "title": "Profile Information",
+    "title": "Settings",
     "info-box-message": "By activating this option, a 2D barcode will be included in the monthly statement sent to the tenant, allowing them to make a direct payment to your bank account.",
     "tenant-2d-code-legend": "TENANT 2D CODE",
     "tenant-2d-code-toggle-label": "include 2D code in monthly statements",

messages/hr.json

@@ -163,8 +163,8 @@
       "validation-failed": "Validacija nije uspjela. Molimo provjerite formu i pokušajte ponovno."
     }
   },
-  "account-form": {
+  "settings-form": {
-    "title": "Podaci o profilu",
+    "title": "Postavke",
     "info-box-message": "Ako uključite ovu opciji na mjesečnom obračunu koji se šalje podstanaru biti će prikazan 2D bar kod, putem kojeg će moći izvršiti izravnu uplatu na vaš bankovni račun.",
     "tenant-2d-code-legend": "2D BARKOD ZA PODSTANARA",
     "tenant-2d-code-toggle-label": "prikazuj 2D barkod u mjesečnom obračunu",