From 86fa6a67fe3bf84bfd2147e2427b29091b4278af Mon Sep 17 00:00:00 2001
From: Knee Cola <kneecola@duck.com>
Date: Mon, 17 Nov 2025 20:06:13 +0100
Subject: [PATCH] Add info box to account form explaining barcode usage
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Added informational alert at the top of the account form to explain
that profile data (name, address, IBAN) will be used to generate 2D
barcodes for tenant bill payments. The alert uses a horizontal layout
on all screen sizes for consistent UX.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 app/ui/AccountForm.tsx | 6 ++++++
 messages/en.json       | 1 +
 messages/hr.json       | 1 +
 3 files changed, 8 insertions(+)

diff --git a/app/ui/AccountForm.tsx b/app/ui/AccountForm.tsx
index 280226f..03c17d3 100644
--- a/app/ui/AccountForm.tsx
+++ b/app/ui/AccountForm.tsx
@@ -25,6 +25,12 @@ const FormFields: FC<FormFieldsProps> = ({ profile, errors, message }) => {
 
     return (
         <>
+            <div className="alert max-w-md flex flex-row items-start">
+                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" className="stroke-current shrink-0 w-6 h-6">
+                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+                </svg>
+                <span className="text-left">{t("info-box-message")}</span>
+            </div>
             <div className="form-control w-full">
                 <label className="label">
                     <span className="label-text">{t("first-name-label")}</span>
diff --git a/messages/en.json b/messages/en.json
index fca9fc4..2b4351c 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -138,6 +138,7 @@
   },
   "account-form": {
     "title": "Profile Information",
+    "info-box-message": "This information will be used to generate a 2D barcode displayed in the bill view, allowing tenants to scan it and refund the money you have spent on paying utility bills in their name.",
     "first-name-label": "First Name",
     "first-name-placeholder": "Enter your first name",
     "last-name-label": "Last Name",
diff --git a/messages/hr.json b/messages/hr.json
index 23f407a..9181354 100644
--- a/messages/hr.json
+++ b/messages/hr.json
@@ -137,6 +137,7 @@
   },
   "account-form": {
     "title": "Podaci o profilu",
+    "info-box-message": "Ovi podaci će se koristiti za generiranje 2D barkoda koji će biti prikazan u pregledu računa, omogućujući podstanarima da ga skeniraju i vrate novac koji ste potrošili na plaćanje režija u njihovo ime.",
     "first-name-label": "Ime",
     "first-name-placeholder": "Unesite svoje ime",
     "last-name-label": "Prezime",