From e9ae2b1189caf334804531d55c98b18e7fab185c Mon Sep 17 00:00:00 2001 From: Knee Cola Date: Tue, 18 Nov 2025 11:16:16 +0100 Subject: [PATCH] Refactor UI components and convert controls to select elements MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Extract InfoBox component for reusable alert boxes - Update AccountForm to use InfoBox component - Add InfoBox with explanatory text to tenant sections in LocationEditForm - Convert billFwdStrategy from radio buttons to select element - Convert updateScope from radio buttons to select element - Update localization strings for improved clarity - Fix updateScope defaultValue to use "current" instead of billFwdStrategy 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- app/ui/AccountForm.tsx | 8 +--- app/ui/InfoBox.tsx | 9 +++++ app/ui/LocationEditForm.tsx | 76 ++++++++++++------------------------- messages/en.json | 6 ++- messages/hr.json | 6 ++- 5 files changed, 43 insertions(+), 62 deletions(-) create mode 100644 app/ui/InfoBox.tsx diff --git a/app/ui/AccountForm.tsx b/app/ui/AccountForm.tsx index d86ad0e..c1b58a1 100644 --- a/app/ui/AccountForm.tsx +++ b/app/ui/AccountForm.tsx @@ -8,6 +8,7 @@ import { useLocale, useTranslations } from "next-intl"; import Link from "next/link"; import AccountCircleIcon from "@mui/icons-material/AccountCircle"; import { formatIban } from "../lib/formatStrings"; +import { InfoBox } from "./InfoBox"; export type AccountFormProps = { profile: UserProfile | null; @@ -42,12 +43,7 @@ const FormFields: FC = ({ profile, errors, message }) => { return ( <> -
- - - - {t("info-box-message")} -
+ {t("info-box-message")}
) : ( -
-
- {t("update-scope")} -
-
- - - -
-
+
+ {t("update-scope")} + +
)}
diff --git a/messages/en.json b/messages/en.json index 03319ed..9c5b321 100644 --- a/messages/en.json +++ b/messages/en.json @@ -125,24 +125,26 @@ "location-name-placeholder": "Realestate name", "notes-placeholder": "Notes", "tenant-2d-code-legend": "TENANT 2D CODE", + "tenant-2d-code-info": "2D barcode allows the tenant to quickly and easily pay the amount they owe you for paid utility bills to your IBAN. The barcode will be displayed when the tenant opens the link to the statement for the given month.", "tenant-2d-code-toggle-label": "generate 2d code", "tenant-first-name-label": "Tenant First Name", "tenant-first-name-placeholder": "Enter tenant's first name", "tenant-last-name-label": "Tenant Last Name", "tenant-last-name-placeholder": "Enter tenant's last name", "auto-utility-bill-forwarding-legend": "AUTOMATIC UTILITY BILL FORWARDING", + "auto-utility-bill-forwarding-info": "This option enables automatic forwarding of utility bills to the tenant via email according to the selected forwarding strategy.", "auto-utility-bill-forwarding-toggle-label": "forward utility bills", "tenant-email-label": "Tenant Email", "tenant-email-placeholder": "Enter tenant's email", "utility-bill-forwarding-strategy-label": "Forward utility bills when ...", - "utility-bill-forwarding-when-payed": "all bills are marked as paid", + "utility-bill-forwarding-when-payed": "all items are marked as paid", "utility-bill-forwarding-when-attached": "a bill (PDF) is attached to all items", "warning-missing-tenant-names": "Warning: Tenant first and last name are missing. The 2D barcode will not be displayed to the tenant when they open the shared link until both fields are filled in.", "save-button": "Save", "cancel-button": "Cancel", "delete-tooltip": "Delete realestate", "add-to-subsequent-months": "Add to all subsequent months", - "update-scope": "Update scope:", + "update-scope": "Which records do you want to update?", "update-current-month": "current month only", "update-subsequent-months": "current and all future months", "update-all-months": "all months", diff --git a/messages/hr.json b/messages/hr.json index 60e8960..e730d01 100644 --- a/messages/hr.json +++ b/messages/hr.json @@ -124,24 +124,26 @@ "location-name-placeholder": "Ime nekretnine", "notes-placeholder": "Bilješke", "tenant-2d-code-legend": "2D BARKOD ZA PODSTANARA", + "tenant-2d-code-info": "2D barkod omogućuje podstanaru da brzo i jednostavno na vaš IBAN uplati iznos koji vam duguje za plaćene režije. Barkod će biti prikazan kada podstanar otvori poveznicu na obračun za zadani mjesec.", "tenant-2d-code-toggle-label": "generiraj 2D barkod", "tenant-first-name-label": "Ime podstanara", "tenant-first-name-placeholder": "Unesite ime podstanara", "tenant-last-name-label": "Prezime podstanara", "tenant-last-name-placeholder": "Unesite prezime podstanara", "auto-utility-bill-forwarding-legend": "AUTOMATSKO PROSLJEĐIVANJE REŽIJA", + "auto-utility-bill-forwarding-info": "Ova opcija omogućuje automatsko prosljeđivanje režija podstanaru putem emaila u skladu s odabranom strategijom.", "auto-utility-bill-forwarding-toggle-label": "proslijedi režije automatski", "tenant-email-label": "Email podstanara", "tenant-email-placeholder": "Unesite email podstanara", "utility-bill-forwarding-strategy-label": "Režije proslijedi kada...", - "utility-bill-forwarding-when-payed": "sve režije označim kao plaćene", + "utility-bill-forwarding-when-payed": "sve stavke označim kao plaćene", "utility-bill-forwarding-when-attached": "za sve stavke priložim račun (PDF)", "warning-missing-tenant-names": "Upozorenje: Ime i prezime podstanara nedostaju. 2D barkod neće biti prikazan podstanaru kada otvori podijeljenu poveznicu dok oba polja ne budu popunjena.", "save-button": "Spremi", "cancel-button": "Odbaci", "delete-tooltip": "Brisanje nekretnine", "add-to-subsequent-months": "Dodaj u sve mjesece koji slijede", - "update-scope": "Opseg ažuriranja:", + "update-scope": "Koje zapise želite ažurirati?", "update-current-month": "samo trenutni mjesec", "update-subsequent-months": "trenutni i svi budući mjeseci", "update-all-months": "svi mjeseci",