enabled i18n for all components
This commit is contained in:
@@ -8,6 +8,7 @@ import { updateOrAddBill } from "../lib/actions/billActions";
|
||||
import Link from "next/link";
|
||||
import { formatYearMonth } from "../lib/format";
|
||||
import { findDecodePdf417 } from "../lib/pdf/barcodeDecoder";
|
||||
import { useTranslations } from "next-intl";
|
||||
|
||||
// Next.js does not encode an utf-8 file name correctly when sending a form with a file attachment
|
||||
// This is a workaround for that
|
||||
@@ -25,6 +26,8 @@ export interface BillEditFormProps {
|
||||
|
||||
export const BillEditForm:FC<BillEditFormProps> = ({ location, bill }) => {
|
||||
|
||||
const t = useTranslations("bill-edit-form");
|
||||
|
||||
const { _id: billID, name, paid, attachment, notes, payedAmount: initialPayedAmount, barcodeImage: initialBarcodeImage } = bill ?? { _id:undefined, name:"", paid:false, notes:"" };
|
||||
|
||||
const { yearMonth:{year: billYear, month: billMonth}, _id: locationID } = location;
|
||||
@@ -69,12 +72,12 @@ export const BillEditForm:FC<BillEditFormProps> = ({ location, bill }) => {
|
||||
{
|
||||
// don't show the delete button if we are adding a new bill
|
||||
bill ?
|
||||
<Link href={`/bill/${locationID}-${billID}/delete/`}>
|
||||
<Link href={`/bill/${locationID}-${billID}/delete/`} data-tip={t("delete-tooltip")}>
|
||||
<TrashIcon className="h-[1em] w-[1em] absolute cursor-pointer text-error bottom-5 right-4 text-2xl" />
|
||||
</Link> : null
|
||||
}
|
||||
|
||||
<input id="billName" name="billName" type="text" placeholder="Bill name" className="input input-bordered w-full" defaultValue={name} required />
|
||||
<input id="billName" name="billName" type="text" placeholder={t("bill-name-placeholder")} className="input input-bordered w-full" defaultValue={name} required />
|
||||
<div id="status-error" aria-live="polite" aria-atomic="true">
|
||||
{state.errors?.billName &&
|
||||
state.errors.billName.map((error: string) => (
|
||||
@@ -107,13 +110,13 @@ export const BillEditForm:FC<BillEditFormProps> = ({ location, bill }) => {
|
||||
<div className="flex">
|
||||
<div className="form-control flex-row">
|
||||
<label className="cursor-pointer label align-middle">
|
||||
<span className="label-text mr-[1em]">Paid</span>
|
||||
<span className="label-text mr-[1em]">{t("paid-checkbox")}</span>
|
||||
<input id="billPaid" name="billPaid" type="checkbox" className="toggle toggle-success" defaultChecked={paid} onChange={billPaid_handleChange} />
|
||||
</label>
|
||||
</div>
|
||||
<div className="form-control grow">
|
||||
<label className="cursor-pointer label grow">
|
||||
<span className="label-text mx-[1em]">Amount</span>
|
||||
<span className="label-text mx-[1em]">{t("payed-amount")}</span>
|
||||
<input type="text" id="payedAmount" name="payedAmount" className="input input-bordered text-right w-[5em] grow" placeholder="0.00" value={payedAmount} onFocus={e => e.target.select()} onChange={payedAmount_handleChange} />
|
||||
</label>
|
||||
</div>
|
||||
@@ -134,11 +137,11 @@ export const BillEditForm:FC<BillEditFormProps> = ({ location, bill }) => {
|
||||
<label className="cursor-pointer label p-2 grow bg-white">
|
||||
<img src={barcodeImage} className="grow sm:max-w-[350px]" alt="2D Barcode" />
|
||||
</label>
|
||||
<p className="text-xs my-1">After scanning the code make sure the information is correct.<br/>We are not liable in case of an incorrect payment.</p>
|
||||
<p className="text-xs my-1">{t.rich('barcode-disclaimer', { br: () => <br /> })}</p>
|
||||
</div> : null
|
||||
}
|
||||
|
||||
<textarea id="billNotes" name="billNotes" className="textarea textarea-bordered my-2 max-w-lg w-full block" placeholder="Note" defaultValue={notes ?? ''}></textarea>
|
||||
<textarea id="billNotes" name="billNotes" className="textarea textarea-bordered my-2 max-w-lg w-full block" placeholder={t("notes-placeholder")} defaultValue={notes ?? ''}></textarea>
|
||||
<div id="status-error" aria-live="polite" aria-atomic="true">
|
||||
{state.errors?.billNotes &&
|
||||
state.errors.billNotes.map((error: string) => (
|
||||
@@ -149,8 +152,8 @@ export const BillEditForm:FC<BillEditFormProps> = ({ location, bill }) => {
|
||||
</div>
|
||||
|
||||
<div className="pt-4">
|
||||
<button type="submit" className="btn btn-primary">Save</button>
|
||||
<Link className="btn btn-neutral ml-3" href={`/?year=${billYear}&month=${billMonth}`}>Cancel</Link>
|
||||
<button type="submit" className="btn btn-primary">{t("save-button")}</button>
|
||||
<Link className="btn btn-neutral ml-3" href={`/?year=${billYear}&month=${billMonth}`}>{t("cancel-button")}</Link>
|
||||
</div>
|
||||
|
||||
<div id="status-error" aria-live="polite" aria-atomic="true">
|
||||
|
||||
Reference in New Issue
Block a user