formatted all

src/app/page.tsx

@@ -22,7 +22,9 @@ export default function App() {
 	const [data, setData] = useState<Budgetable[]>([]);
 	const [isEditing, setIsEditing] = useState(false);
 	const [newRow, setNewRow] = useState<Budgetable>(DEFAULT_NEW_ROW);
-  const [recentlyUpdatedRowId, setRecentlyUpdatedRowId] = useState<string | null>(null);
+	const [recentlyUpdatedRowId, setRecentlyUpdatedRowId] = useState<
+		string | null
+	>(null);
 
 	const fetchData = useCallback(async () => {
 		try {
@@ -40,7 +42,8 @@ export default function App() {
 		fetchData();
 	}, [fetchData]);
 
-  const handleSave = useCallback(async (updatedRow: Budgetable, originalRow: Budgetable) => {
+	const handleSave = useCallback(
+		async (updatedRow: Budgetable, originalRow: Budgetable) => {
 			if (areRowsEqual(updatedRow, originalRow)) return;
 
 			try {
@@ -52,7 +55,9 @@ export default function App() {
 				if (!res.ok) throw new Error("Failed to update row");
 
 				const updatedData = await res.json();
-      setData((prev) => prev.map((row) => (row.id === updatedRow.id ? updatedData : row)));
+				setData((prev) =>
+					prev.map((row) => (row.id === updatedRow.id ? updatedData : row)),
+				);
 
 				setRecentlyUpdatedRowId(updatedRow.id);
 				setTimeout(() => setRecentlyUpdatedRowId(null), 500);
@@ -61,7 +66,9 @@ export default function App() {
 				toast.error("Error updating row. Please try again.");
 				console.error(err);
 			}
-  }, []);
+		},
+		[],
+	);
 
 	const handleAddRow = useCallback(async () => {
 		if (!newRow.title || newRow.price <= 0) {
@@ -100,11 +107,17 @@ export default function App() {
 		}
 	}, []);
 
-  const toggleStatus = useCallback(async (row: Budgetable) => {
+	const toggleStatus = useCallback(
+		async (row: Budgetable) => {
 			const updatedStatus = row.status === "Paid" ? "Unpaid" : "Paid";
-    const updatedRow: Budgetable = { ...row, status: updatedStatus as "Paid" | "Unpaid" };
+			const updatedRow: Budgetable = {
+				...row,
+				status: updatedStatus as "Paid" | "Unpaid",
+			};
 			await handleSave(updatedRow, row);
-  }, [handleSave]);
+		},
+		[handleSave],
+	);
 
 	const total = data.reduce(
 		(sum, item) => sum + (item.status === "Unpaid" ? item.price : 0),

src/app/pocketbase/[id]/route.ts

@@ -1,9 +1,17 @@
 import pb from "@/lib/pocketbase";
 import { ResponseHelper } from "@/lib/helper";
 import { RESPONSE } from "@/lib/const";
-import { Budgetable } from "@/lib/utils";
+import type { Budgetable } from "@/lib/utils";
 
-const { INTERNAL_SERVER_ERROR, MISSING_ID, FAILED_TO_DELETE_DATA, FAILED_TO_UPDATE_DATA, INVALID_DATA, SUCCESS, CREATED } = RESPONSE;
+const {
+	INTERNAL_SERVER_ERROR,
+	MISSING_ID,
+	FAILED_TO_DELETE_DATA,
+	FAILED_TO_UPDATE_DATA,
+	INVALID_DATA,
+	SUCCESS,
+	CREATED,
+} = RESPONSE;
 const { EMAIL, PASSWORD, COLLECTION = "budgetable" } = process.env;
 
 async function authenticateSuperuser(): Promise<void> {
@@ -17,7 +25,7 @@ async function authenticateSuperuser(): Promise<void> {
 
 export async function GET(
 	_req: Request,
-  context: { params: Promise<{ id: string }> }
+	context: { params: Promise<{ id: string }> },
 ): Promise<Response> {
 	try {
 		await authenticateSuperuser();
@@ -27,7 +35,9 @@ export async function GET(
 			return ResponseHelper.error(MISSING_ID);
 		}
 
-    const record: Budgetable = await pb.collection<Budgetable>(COLLECTION).getOne(id);
+		const record: Budgetable = await pb
+			.collection<Budgetable>(COLLECTION)
+			.getOne(id);
 		return ResponseHelper.success<Budgetable>(record, CREATED.STATUS);
 	} catch (error) {
 		console.error("Error fetching data:", error);
@@ -37,7 +47,7 @@ export async function GET(
 
 export async function DELETE(
 	_req: Request,
-  context: { params: Promise<{ id: string }> }
+	context: { params: Promise<{ id: string }> },
 ): Promise<Response> {
 	try {
 		await authenticateSuperuser();
@@ -57,7 +67,7 @@ export async function DELETE(
 
 export async function PUT(
 	req: Request,
-  context: { params: Promise<{ id: string }> }
+	context: { params: Promise<{ id: string }> },
 ): Promise<Response> {
 	try {
 		await authenticateSuperuser();

src/app/pocketbase/route.ts

@@ -1,7 +1,7 @@
 import pb from "@/lib/pocketbase";
 import { ResponseHelper } from "@/lib/helper";
 import { RESPONSE } from "@/lib/const";
-import { Budgetable } from "@/lib/utils";
+import type { Budgetable } from "@/lib/utils";
 
 const { INTERNAL_SERVER_ERROR } = RESPONSE;
 const { EMAIL, PASSWORD, COLLECTION = "budgetable" } = process.env;

src/components/header.tsx

@@ -18,7 +18,7 @@ const Header = ({ isEditing, setIsEditing }: AppHeaderProps) => (
 			</Link>
 		</h1>
 		<Button variant="ghost" onClick={() => setIsEditing(!isEditing)} size="lg">
-			<span className='text-lg'>{isEditing ? "Lock" : "Unlock"} Editing</span>
+			<span className="text-lg">{isEditing ? "Lock" : "Unlock"} Editing</span>
 		</Button>
 	</div>
 );

src/lib/const.ts

@@ -1,29 +1,41 @@
 type ResponseConstant = {
 	STATUS: number;
 	MESSAGE: string;
-  };
+};
 
-  type ResponseMap = {
+type ResponseMap = {
 	[key: string]: ResponseConstant;
-  };
+};
 
-  export enum HttpStatus {
+export enum HttpStatus {
 	OK = 200,
 	CREATED = 201,
 	BAD_REQUEST = 400,
 	INTERNAL_SERVER_ERROR = 500,
-  }
+}
 
-  function createResponse(status: number, message: string): ResponseConstant {
+function createResponse(status: number, message: string): ResponseConstant {
 	return { STATUS: status, MESSAGE: message };
-  }
+}
 
-  export const RESPONSE: ResponseMap = {
-	INTERNAL_SERVER_ERROR: createResponse(HttpStatus.INTERNAL_SERVER_ERROR, "Internal server error."),
+export const RESPONSE: ResponseMap = {
+	INTERNAL_SERVER_ERROR: createResponse(
+		HttpStatus.INTERNAL_SERVER_ERROR,
+		"Internal server error.",
+	),
 	MISSING_ID: createResponse(HttpStatus.BAD_REQUEST, "Missing ID in request."),
-	FAILED_TO_DELETE_DATA: createResponse(HttpStatus.INTERNAL_SERVER_ERROR, "Failed to delete data."),
-	FAILED_TO_UPDATE_DATA: createResponse(HttpStatus.INTERNAL_SERVER_ERROR, "Failed to update data."),
-	INVALID_DATA: createResponse(HttpStatus.BAD_REQUEST, "Invalid data provided."),
+	FAILED_TO_DELETE_DATA: createResponse(
+		HttpStatus.INTERNAL_SERVER_ERROR,
+		"Failed to delete data.",
+	),
+	FAILED_TO_UPDATE_DATA: createResponse(
+		HttpStatus.INTERNAL_SERVER_ERROR,
+		"Failed to update data.",
+	),
+	INVALID_DATA: createResponse(
+		HttpStatus.BAD_REQUEST,
+		"Invalid data provided.",
+	),
 	SUCCESS: createResponse(HttpStatus.OK, "Operation completed successfully."),
 	CREATED: createResponse(HttpStatus.CREATED, "Resource created successfully."),
-  };
+};

src/lib/helper.ts

@@ -30,11 +30,11 @@ export class ResponseHelper<T = unknown> {
 
 	static error(
 		constant: (typeof RESPONSE)[keyof typeof RESPONSE],
-    details?: unknown
+		details?: unknown,
 	): Response {
 		return new ResponseHelper<ErrorResponse>(
 			{ error: { message: constant.MESSAGE, details } },
-      { status: constant.STATUS }
+			{ status: constant.STATUS },
 		).toResponse();
 	}