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

form action redirects user to tjhe appropriate year

Browse Source
This commit is contained in:
Nikola Derežić
2024-01-17 15:47:55 +01:00
parent 119d64344f
commit 0eb11e7d02
18 changed files with 158 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
app/ui/BillEditForm.tsx
View File

@@ -4,37 +4,38 @@ import { DocumentIcon, TrashIcon } from "@heroicons/react/24/outline";
import { Bill } from "../lib/db-types";
import React, { FC } from "react";
import { useFormState } from "react-dom";
import { gotoHome, updateOrAddBill } from "../lib/actions/billActions";
import { updateOrAddBill } from "../lib/actions/billActions";
import Link from "next/link";
import { gotoHome } from "../lib/actions/navigationActions";
// 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
const updateOrAddBillMiddleware = (locationId: string, billId:string|undefined, prevState:any, formData: FormData) => {
const updateOrAddBillMiddleware = (locationId: string, billId:string|undefined, billYear:number|undefined, prevState:any, formData: FormData) => {
// URL encode the file name of the attachment so it is correctly sent to the server
const billAttachment = formData.get('billAttachment') as File;
formData.set('billAttachment', billAttachment, encodeURIComponent(billAttachment.name));
return updateOrAddBill(locationId, billId, prevState, formData);
return updateOrAddBill(locationId, billId, billYear, prevState, formData);
}
export interface BillEditFormProps {
locationID: string,
bill?: Bill
bill?: Bill,
billYear?: number
}
export const BillEditForm:FC<BillEditFormProps> = ({ locationID, bill }) => {
export const BillEditForm:FC<BillEditFormProps> = ({ locationID, bill, billYear }) => {
const { _id: billID, name, paid, attachment, notes, payedAmount } = bill ?? { _id:undefined, name:"", paid:false, notes:"" };
const initialState = { message: null, errors: {} };
const handleAction = updateOrAddBillMiddleware.bind(null, locationID, billID);
const handleAction = updateOrAddBillMiddleware.bind(null, locationID, billID, billYear);
const [ state, dispatch ] = useFormState(handleAction, initialState);
const [ isPaid, setIsPaid ] = React.useState<boolean>(paid);
// redirect to the main page
const handleCancel = () => {
console.log('handleCancel');
gotoHome();
gotoHome(billYear ? `/?year=${billYear}` : undefined);
};
const billPaid_handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {