diff --git a/app/ui/BillEditForm.tsx b/app/ui/BillEditForm.tsx index 912e10c..ab68d3e 100644 --- a/app/ui/BillEditForm.tsx +++ b/app/ui/BillEditForm.tsx @@ -1,6 +1,6 @@ "use client"; -import { DocumentIcon, TrashIcon } from "@heroicons/react/24/outline"; +import { DocumentIcon, TicketIcon, TrashIcon } from "@heroicons/react/24/outline"; import { Bill, BilledTo, BillingLocation } from "../lib/db-types"; import React, { FC, useEffect } from "react"; import { useFormState } from "react-dom"; @@ -31,9 +31,9 @@ export const BillEditForm: FC = ({ location, bill }) => { const t = useTranslations("bill-edit-form"); const locale = useLocale(); - const { _id: billID, name, paid, billedTo = BilledTo.Tenant, attachment, notes, payedAmount: initialPayedAmount } = bill ?? { _id: undefined, name: "", paid: false, notes: "" }; + const { _id: billID, name, paid, billedTo = BilledTo.Tenant, attachment, notes, payedAmount: initialPayedAmount, proofOfPayment } = bill ?? { _id: undefined, name: "", paid: false, notes: "" }; - const { yearMonth: { year: billYear, month: billMonth }, _id: locationID } = location; + const { yearMonth: { year: billYear, month: billMonth }, _id: locationID, proofOfPaymentType } = location; const initialState = { message: null, errors: {} }; @@ -228,7 +228,7 @@ export const BillEditForm: FC = ({ location, bill }) => { ))} -
+
{t("billed-to-info")} {t("billed-to-legend")}
+ { + // IF proof of payment type is "per-bill" and proof of payment was uploaded + proofOfPaymentType === "per-bill" && proofOfPayment?.uploadedAt ? +
+ {t("upload-proof-of-payment-legend")} + { + // IF file name is available, show link to download + // ELSE it's not available that means that the uploaded file was purged by housekeeping + // -> don't show anything + proofOfPayment.fileName ? ( +
+ + + {decodeURIComponent(proofOfPayment.fileName)} + +
+ ) : null + } +
: null + } + {/* Show toggle only when adding a new bill (not editing) */} {!bill && (
@@ -259,6 +284,7 @@ export const BillEditForm: FC = ({ location, bill }) => {

}
+ );