refactor(forklifts): more refactoring to improve during production

app/src/internal/forklifts/routes/invoices/addInvoice.ts

@@ -28,6 +28,7 @@ router.post("/", async (req: Request, res: Response) => {
 		companyId: req.body.companyId,
 		invoiceNumber: req.body.invoiceNumber,
 		invoiceDate: req.body.invoiceDate,
+		comment: req.body.comment,
 		uploadedBy: req.body.uploadedBy,
 		totalAmount: req.body.totalAmount,
 	});

app/src/pkg/db/schema/forkliftLeasesInvoice.ts

@@ -1,4 +1,4 @@
-import { numeric, pgTable, serial, uuid } from "drizzle-orm/pg-core";
+import { numeric, pgTable, serial, text, uuid } from "drizzle-orm/pg-core";
 import { createInsertSchema } from "drizzle-zod";
 import { forklifts } from "./forklifts.js";
 import { leaseInvoices } from "./leaseInvoices.js";

app/src/pkg/db/schema/leaseInvoices.ts

@@ -17,6 +17,7 @@ export const leaseInvoices = pgTable("lease_invoices", {
 	invoiceNumber: text("invoice_number").unique().notNull(),
 	invoiceDate: date("invoice_date").notNull(),
 	totalAmount: numeric("total_amount"),
+	comment: text("comment"),
 	add_date: timestamp("add_date"),
 	uploadedBy: text("uploaded_by"),
 });

frontend/src/lib/formStuff/components/TextArea.tsx

@@ -0,0 +1,28 @@
+import { Textarea } from "@/components/ui/textarea";
+import { Label } from "../../../components/ui/label";
+import { useFieldContext } from "..";
+import { FieldErrors } from "./FieldErrors";
+
+type InputFieldProps = {
+	label: string;
+	placeHolder: string;
+	required: boolean;
+};
+export const TextArea = ({ label, placeHolder, required }: InputFieldProps) => {
+	const field = useFieldContext<any>();
+
+	return (
+		<div className="grid gap-3 w-64">
+			<Label htmlFor={field.name}>{label}</Label>
+			<Textarea
+				id={field.name}
+				value={field.state.value}
+				onChange={(e) => field.handleChange(e.target.value)}
+				placeholder={placeHolder}
+				onBlur={field.handleBlur}
+				required={required}
+			/>
+			<FieldErrors meta={field.state.meta} />
+		</div>
+	);
+};

frontend/src/lib/formStuff/index.tsx

@@ -5,6 +5,7 @@ import { InputField } from "./components/InputField";
 import { InputPasswordField } from "./components/InputPasswordField";
 import { SelectField } from "./components/SelectField";
 import { SubmitButton } from "./components/SubmitButton";
+import { TextArea } from "./components/TextArea";
 
 export const { fieldContext, useFieldContext, formContext, useFormContext } =
 	createFormHookContexts();
@@ -16,6 +17,7 @@ export const { useAppForm } = createFormHook({
 		SelectField,
 		CheckboxField,
 		DateField,
+		TextArea,
 	},
 	formComponents: { SubmitButton },
 	fieldContext,

frontend/src/routes/_app/_forklifts/-components/NewForklift.tsx

@@ -10,6 +10,7 @@ import {
 	DialogTitle,
 } from "@/components/ui/dialog";
 import { getServers } from "@/lib/querys/admin/getServers";
+import { getForklifts } from "@/lib/querys/forklifts/getForklifts";
 import { getLeases } from "@/lib/querys/forklifts/getLeases";
 import { useAppForm } from "../../../../lib/formStuff";
 
@@ -52,6 +53,7 @@ const pfc: any = [
 export default function NewForklift({ setOpenDialog }: { setOpenDialog: any }) {
 	//const search = useSearch({ from: "/_app/(auth)/login" });
 	const { data: s, isLoading: es } = useQuery(getServers());
+	const { refetch: refetchLifts } = useQuery(getForklifts());
 	const {
 		data: leases,
 		isLoading: leaseError,
@@ -91,6 +93,7 @@ export default function NewForklift({ setOpenDialog }: { setOpenDialog: any }) {
 				form.reset();
 				setOpenDialog(false);
 				refetch();
+				refetchLifts();
 				toast.success(`${value.serialNumber} was just created `);
 			} catch (error) {
 				// @ts-ignore

frontend/src/routes/_app/_forklifts/-components/NewInvoice.tsx

@@ -34,6 +34,7 @@ export default function NewInvoice({
 			invoiceNumber: "",
 			invoiceDate: "",
 			totalAmount: "",
+			comment: "",
 			forklifts: [{ forklift_id: "", serialNumber: "", amount: "" }],
 		},
 		onSubmit: async ({ value }) => {
@@ -198,6 +199,16 @@ export default function NewInvoice({
 						<field.DateField label="Invoice Date" required={true} />
 					)}
 				/>
+				<form.AppField
+					name="comment"
+					children={(field) => (
+						<field.TextArea
+							label="Comment"
+							placeHolder="Enter your comment if needed."
+							required={false}
+						/>
+					)}
+				/>
 
 				<hr className="mt-2 mb-2" />
 				{/* Dynamic forklift section */}

frontend/src/routes/_app/_forklifts/forklifts/invoices.tsx

@@ -11,6 +11,7 @@ type Invoices = {
 	id: string;
 	invoiceNumber: string;
 	invoiceDate: Date;
+	comment: string;
 	totalAmount: string;
 	add_date: Date;
 };
@@ -83,6 +84,26 @@ function RouteComponent() {
 				return <span>{format(date, "MM/dd/yyyy")}</span>;
 			},
 		}),
+		columnHelper.accessor("comment", {
+			header: ({ column }) => {
+				return (
+					<Button
+						variant="ghost"
+						onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
+					>
+						<span className="flex flex-row gap-2">Invoice Date</span>
+						{column.getIsSorted() === "asc" ? (
+							<ArrowUp className="ml-2 h-4 w-4" />
+						) : (
+							<ArrowDown className="ml-2 h-4 w-4" />
+						)}
+					</Button>
+				);
+			},
+			cell: ({ getValue }) => {
+				return <span>{getValue()}</span>;
+			},
+		}),
 		// columnHelper.accessor("add_date", {
 		// 	header: ({ column }) => {
 		// 		return (