knee-cola/evidencija-rezija
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add "none" option for proof of payment type

Browse Source 
Enhanced the proof of payment attachment feature with the following improvements:

- Renamed field from `proofOfPaymentAttachmentType` to `proofOfPaymentType` for consistency
- Added "none" option allowing users to disable proof of payment attachments
- Changed default value from "combined" to "none" for better UX
- Repositioned section in form after payment instructions (more logical flow)
- Added conditional warning when "combined" is selected without payment method
- Updated translations with emojis and improved tooltips for all options
- Backend validation and database operations updated to support new field structure

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Knee Cola
2025-12-07 11:19:51 +01:00
parent 2483b7bca5
commit dd4c92be77
5 changed files with 75 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/lib/actions/locationActions.ts
View File

@@ -35,6 +35,7 @@ const FormSchema = (t:IntlTemplateFn) => z.object({
_id: z.string(),
locationName: z.coerce.string().min(1, t("location-name-required")),
tenantPaymentMethod: z.enum(["none", "iban", "revolut"]).optional().nullable(),
proofOfPaymentType: z.enum(["none", "combined", "per-bill"]).optional().nullable(),
tenantName: z.string().max(30).optional().nullable(),
tenantStreet: z.string().max(27).optional().nullable(),
tenantTown: z.string().max(27).optional().nullable(),
@@ -112,6 +113,7 @@ export const updateOrAddLocation = withUser(async (user:AuthenticatedUser, locat
const validatedFields = FormSchema(t).safeParse({
locationName: formData.get('locationName'),
tenantPaymentMethod: formData.get('tenantPaymentMethod') as "none" | "iban" | "revolut" | undefined,
proofOfPaymentType: formData.get('proofOfPaymentType') as "none" | "combined" | "per-bill" | undefined,
tenantName: formData.get('tenantName') || null,
tenantStreet: formData.get('tenantStreet') || null,
tenantTown: formData.get('tenantTown') || null,
@@ -136,6 +138,7 @@ export const updateOrAddLocation = withUser(async (user:AuthenticatedUser, locat
const {
locationName,
tenantPaymentMethod,
proofOfPaymentType,
tenantName,
tenantStreet,
tenantTown,
@@ -178,6 +181,7 @@ export const updateOrAddLocation = withUser(async (user:AuthenticatedUser, locat
$set: {
name: locationName,
tenantPaymentMethod: tenantPaymentMethod || "none",
proofOfPaymentType: proofOfPaymentType || "none",
tenantName: tenantName || null,
tenantStreet: tenantStreet || null,
tenantTown: tenantTown || null,
@@ -208,6 +212,7 @@ export const updateOrAddLocation = withUser(async (user:AuthenticatedUser, locat
$set: {
name: locationName,
tenantPaymentMethod: tenantPaymentMethod || "none",
proofOfPaymentType: proofOfPaymentType || "none",
tenantName: tenantName || null,
tenantStreet: tenantStreet || null,
tenantTown: tenantTown || null,
@@ -231,6 +236,7 @@ export const updateOrAddLocation = withUser(async (user:AuthenticatedUser, locat
$set: {
name: locationName,
tenantPaymentMethod: tenantPaymentMethod || "none",
proofOfPaymentType: proofOfPaymentType || "none",
tenantName: tenantName || null,
tenantStreet: tenantStreet || null,
tenantTown: tenantTown || null,
@@ -253,6 +259,7 @@ export const updateOrAddLocation = withUser(async (user:AuthenticatedUser, locat
name: locationName,
notes: null,
tenantPaymentMethod: tenantPaymentMethod || "none",
proofOfPaymentType: proofOfPaymentType || "none",
tenantName: tenantName || null,
tenantStreet: tenantStreet || null,
tenantTown: tenantTown || null,
@@ -327,6 +334,7 @@ export const updateOrAddLocation = withUser(async (user:AuthenticatedUser, locat
name: locationName,
notes: null,
tenantPaymentMethod: tenantPaymentMethod || "none",
proofOfPaymentType: proofOfPaymentType || "none",
tenantName: tenantName || null,
tenantStreet: tenantStreet || null,
tenantTown: tenantTown || null,

2
app/lib/db-types.ts
View File

@@ -56,7 +56,7 @@ export interface BillingLocation {
tenantPaymentMethod?: "none" | "iban" | "revolut" | null;
/** (optional) type of proof of payment attachment */
proofOfPaymentAttachmentType: "combined" | "per-bill";
proofOfPaymentType: "none" | "combined" | "per-bill";
/** (optional) tenant name */
tenantName?: string | null;

70
app/ui/LocationEditForm.tsx
View File

@@ -42,7 +42,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
tenantTown: location?.tenantTown ?? "",
tenantEmail: location?.tenantEmail ?? "",
tenantPaymentMethod: location?.tenantPaymentMethod ?? "none",
proofOfPaymentAttachmentType: location?.proofOfPaymentAttachmentType ?? "combined",
proofOfPaymentType: location?.proofOfPaymentType ?? "none",
autoBillFwd: location?.autoBillFwd ?? false,
billFwdStrategy: location?.billFwdStrategy ?? "when-payed",
rentDueNotification: location?.rentDueNotification ?? false,
@@ -88,33 +88,6 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
</fieldset>
</fieldset>
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold uppercase text-base">{t("proof-of-payment-attachment-type--legend")}</legend>
<InfoBox>{t("proof-of-payment-attachment-type--info")}</InfoBox>
<fieldset className="fieldset mt-2 p-2">
<select
value={formValues.proofOfPaymentAttachmentType}
className="select input-bordered w-full"
name="proofOfPaymentAttachmentType"
onChange={(e) => handleInputChange("proofOfPaymentAttachmentType", e.target.value)}
>
<option value="combined">{t("proof-of-payment-attachment-type--option--combined")}</option>
<option value="per-bill">{t("proof-of-payment-attachment-type--option--per-bill")}</option>
</select>
<p className="mt-4 ml-4 text-sm">
{formValues.proofOfPaymentAttachmentType === "combined" ?
t("proof-of-payment-attachment-type--option--combined--tooltip") :
t("proof-of-payment-attachment-type--option--per-bill--tooltip")
}
</p>
</fieldset>
</fieldset>
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold uppercase text-base">{t("tenant-payment-instructions-legend")}</legend>
@@ -246,6 +219,47 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
</>
}
</fieldset>
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold uppercase text-base">{t("proof-of-payment-attachment-type--legend")}</legend>
<InfoBox>{t("proof-of-payment-attachment-type--info")}</InfoBox>
<fieldset className="fieldset mt-2 p-2">
<legend className="fieldset-legend">{t("proof-of-payment-attachment-type--option--label")}</legend>
<select
value={formValues.proofOfPaymentType}
className="select input-bordered w-full"
name="proofOfPaymentType"
onChange={(e) => handleInputChange("proofOfPaymentType", e.target.value)}
>
<option value="none">{t("proof-of-payment-attachment-type--option--none")}</option>
<option value="combined">{t("proof-of-payment-attachment-type--option--combined")}</option>
<option value="per-bill">{t("proof-of-payment-attachment-type--option--per-bill")}</option>
</select>
{
formValues.tenantPaymentMethod === "none" && formValues.proofOfPaymentType === "combined" ?
<p className="mt-4 ml-4 text-sm w-[17rem] sm:w-[28rem] text-yellow-600">
{
t.rich("proof-of-payment-attachment-type--option--combined--hint",
{
strong: (children: React.ReactNode) => <strong>{children}</strong>
}
)
}
</p> :
<p className="mt-4 ml-4 text-sm w-[17rem] sm:w-[28rem] italic text-gray-500">
{
formValues.proofOfPaymentType === "combined" ?
t("proof-of-payment-attachment-type--option--combined--tooltip") :
t("proof-of-payment-attachment-type--option--per-bill--tooltip")
}
</p>
}
</fieldset>
</fieldset>
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold uppercase text-base">{t("auto-utility-bill-forwarding-legend")}</legend>
<InfoBox>{t("auto-utility-bill-forwarding-info")}</InfoBox>

22
messages/en.json
View File

@@ -151,24 +151,26 @@
"notes-placeholder": "notes",
"proof-of-payment-attachment-type--legend": "Proof of Payment",
"proof-of-payment-attachment-type--info": "Here you can choose how the tenant can provide proof of payment for utilities.",
"proof-of-payment-attachment-type--option--combined": "a single proof for all bills",
"proof-of-payment-attachment-type--option--combined--tooltip": "The tenant provides one proof of payment along with the monthly statement",
"proof-of-payment-attachment-type--option--per-bill": "separate proof for each bill",
"proof-of-payment-attachment-type--option--per-bill--tooltip": "The tenant provides proof of payment separately for each bill",
"proof-of-payment-attachment-type--info": "Here you can choose how the tenant can provide proof of payment for utilities. Select the option that best matches the payment arrangement you have agreed upon.",
"proof-of-payment-attachment-type--option--label": "Tenant provides ...",
"proof-of-payment-attachment-type--option--none": "⛔ attaching proof of payment disabled",
"proof-of-payment-attachment-type--option--none--tooltip": "The selected option means that the tenant will not be able to upload proof of payment attachments",
"proof-of-payment-attachment-type--option--combined": "📦 a single proof of payment for all bills",
"proof-of-payment-attachment-type--option--combined--tooltip": "The selected option is useful if you pay all utilities on behalf of the tenant, and the tenant reimburses you for this cost",
"proof-of-payment-attachment-type--option--combined--hint": "💡 with the selected option you might also want to activate <strong>payment instructions</strong> - see above",
"proof-of-payment-attachment-type--option--per-bill": "✂️ separate proof of payment for each bill",
"proof-of-payment-attachment-type--option--per-bill--tooltip": "The selected option is useful if the tenant pays utilities directly to individual service providers",
"tenant-payment-instructions-legend": "PAYMENT INSTRUCTIONS",
"tenant-payment-instructions-code-info": "When the tenant opens the link to the statement for the given month, the application can show payment instructions for utility costs to your IBAN, as well as a 2D code they can scan.",
"tenant-payment-instructions-method--legend": "Show payment instructions to tenant:",
"tenant-payment-instructions-method--none": "do not show payment instructions",
"tenant-payment-instructions-method--iban": "payment via IBAN",
"tenant-payment-instructions-method--none": "⛔ do not show payment instructions",
"tenant-payment-instructions-method--iban": "🏛️ payment via IBAN",
"tenant-payment-instructions-method--iban-disabled": "payment via IBAN - disabled in app settings",
"tenant-payment-instructions-method--revolut": "payment via Revolut",
"tenant-payment-instructions-method--revolut": "🅡 payment via Revolut",
"tenant-payment-instructions-method--revolut-disabled": "payment via Revolut - disabled in app settings",
"iban-payment--tenant-name-label": "Tenant First and Last Name",
"iban-payment--tenant-name-placeholder": "enter tenant's first and last name",
"iban-payment--tenant-street-label": "Tenant Street and House Number",

20
messages/hr.json
View File

@@ -150,20 +150,24 @@
"notes-placeholder": "bilješke",
"proof-of-payment-attachment-type--legend": "Potvrda o uplati",
"proof-of-payment-attachment-type--info": "Ovdje možete odabrati na koji način na koji podstanar može priložiti potvrdu o uplati režija.",
"proof-of-payment-attachment-type--option--combined": "jedinstvenu potvrdu za sve račune",
"proof-of-payment-attachment-type--option--combined--tooltip": "Podstanar uz mjesečni obračun prilaže jedinstvenu potvrdu o uplati",
"proof-of-payment-attachment-type--option--per-bill": "zasebna potvrda za svaki račun",
"proof-of-payment-attachment-type--option--per-bill--tooltip": "Podstanar potvrdu o uplati prilaže zasebno za svaki račun",
"proof-of-payment-attachment-type--info": "Ovdje možete odabrati na koji način na koji podstanar može priložiti potvrdu o uplati režija. Izaberite način koji najbolje odgovara načinu na koji ste dogovorili plaćanje režija.",
"proof-of-payment-attachment-type--option--label": "Podstanar prilaže ...",
"proof-of-payment-attachment-type--option--none": "⛔ prilaganje potvrde onemogućeno",
"proof-of-payment-attachment-type--option--none--tooltip": "Odabrana opcija znači da podstanar neće moći priložiti potvrdu o uplati",
"proof-of-payment-attachment-type--option--combined": "📦 jedinstvena potvrda za sve račune",
"proof-of-payment-attachment-type--option--combined--tooltip": "Odabrana opcija je korisna ako vi plaćate sve režije u ime podstanara, a podstanar vam taj trošak refundira",
"proof-of-payment-attachment-type--option--combined--hint": "💡 za odabranu opciju dobro je uključiti i <strong>prikaz uputa za uplatu</strong> - vidi gore",
"proof-of-payment-attachment-type--option--per-bill": "✂️ zasebna potvrda za svaki račun",
"proof-of-payment-attachment-type--option--per-bill--tooltip": "Odabrana opcija je korisna ako podstanar plaća režije izravno pojedinačnim davateljima usluga",
"tenant-payment-instructions-legend": "Upute za uplatu",
"tenant-payment-instructions-code-info": "Kada podstanar otvori poveznicu na obračun za zadani mjesec aplikacija mu može prikazati upute za uplatu troškova režija na vaš IBAN ili Revolut.",
"tenant-payment-instructions-method--legend": "Podstanaru prikaži upute za uplatu:",
"tenant-payment-instructions-method--none": "ne prikazuj upute za uplatu",
"tenant-payment-instructions-method--iban": "uplata na IBAN",
"tenant-payment-instructions-method--none": "⛔ ne prikazuj upute za uplatu",
"tenant-payment-instructions-method--iban": "🏛️ uplata na IBAN",
"tenant-payment-instructions-method--iban-disabled": "uplata na IBAN - onemogućeno u app postavkama",
"tenant-payment-instructions-method--revolut": "uplata na Revolut",
"tenant-payment-instructions-method--revolut": "🅡 uplata na Revolut",
"tenant-payment-instructions-method--revolut-disabled": "uplata na Revolut - onemogućeno u app postavkama",
"tenant-payment-instructions-method--disabled-message": "Ova opcija je nedostupna zato što nije omogućena u postavkama aplikacije.",