Fix(homepage):fixed the redirect issue of expanse page

Author: shadil-rayyan

src/app/expanse/montly/page.tsx src/app/expense/montly/page.tsxsrc/app/expanse/montly/page.tsx renamed to src/app/expense/montly/page.tsx

@@ -61,7 +61,7 @@ export default function ExpenseDetailsPage() {
     const data = {
       ...formData,
       amount: parseFloat(formData.amount),
-      date: formData.date ? formData.date : today, // always a string
+      date: formData.date || today, // <-- ensures date is always a string
     };
     if (editId !== null) {
       await updateExpense(editId, data);

src/app/expanse/page.tsx src/app/expense/page.tsxsrc/app/expanse/page.tsx renamed to src/app/expense/page.tsx

@@ -22,7 +22,7 @@ const BottomNavBar = () => {
       href: "/attendance",
       label: "Attendance",
     },
-    { name: "finance", icon: Money, href: "/finance", label: "Finance" },
+    { name: "finance", icon: Money, href: "/expense", label: "Finance" },
   ];
 
 

src/components/bottomNavbar.tsx

@@ -24,7 +24,7 @@ function getDatesAroundToday(range = 15): DateItem[] {
     const d = new Date(today.getTime()); 
     d.setDate(d.getDate() + i); 
 
-    const iso = d.toISOString().split('T')[0]; 
+    const iso = d.toISOString().split('T')[0] || '';
 
     dates.push({
       date: d.getDate(),

src/components/expense/DateSelector.tsx

@@ -1,27 +1,37 @@
-'use client';
+"use client";
 type ExpenseFormProps = {
-  onClose: () => void;
-  onChange: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
-  onSubmit: (e: React.FormEvent<HTMLFormElement>) => void;
   formData: {
     title: string;
     category: string;
     description: string;
     amount: string | number;
-    date: string;
+    date: string; // must be string, not string | undefined
   };
+  onChange: (
+    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
+  ) => void;
+  onSubmit: (e: React.FormEvent) => void;
+  onClose: () => void;
 };
 
-export default function ExpenseForm({ onClose, onChange, onSubmit, formData }: ExpenseFormProps) {
+export default function ExpenseForm({
+  onClose,
+  onChange,
+  onSubmit,
+  formData,
+}: ExpenseFormProps) {
   return (
     <div className="antialiased flex flex-col items-center">
       <div className="bg-white p-6 rounded-lg shadow-xl w-full max-w-3xl relative mx-auto">
-        <h2 className="text-xl font-bold text-left mb-6 text-black">Add Your Expenses</h2>
+        <h2 className="text-xl font-bold text-left mb-6 text-black">
+          Add Your Expenses
+        </h2>
         <form onSubmit={onSubmit} className="space-y-4">
-          
           {/* Title */}
           <div>
-            <label className="block mb-1 text-sm font-medium text-black">Title</label>
+            <label className="block mb-1 text-sm font-medium text-black">
+              Title
+            </label>
             <input
               type="text"
               name="title"
@@ -35,7 +45,9 @@ export default function ExpenseForm({ onClose, onChange, onSubmit, formData }: E
 
           {/* Category */}
           <div>
-            <label className="block mb-1 text-sm font-medium text-black">Category</label>
+            <label className="block mb-1 text-sm font-medium text-black">
+              Category
+            </label>
             <input
               type="text"
               name="category"
@@ -49,7 +61,9 @@ export default function ExpenseForm({ onClose, onChange, onSubmit, formData }: E
 
           {/* Description */}
           <div>
-            <label className="block mb-1 text-sm font-medium text-black">Description</label>
+            <label className="block mb-1 text-sm font-medium text-black">
+              Description
+            </label>
             <textarea
               name="description"
               placeholder="Description"
@@ -61,7 +75,9 @@ export default function ExpenseForm({ onClose, onChange, onSubmit, formData }: E
 
           {/* Amount */}
           <div>
-            <label className="block mb-1 text-sm font-medium text-black">Amount</label>
+            <label className="block mb-1 text-sm font-medium text-black">
+              Amount
+            </label>
             <input
               type="number"
               name="amount"
@@ -75,7 +91,9 @@ export default function ExpenseForm({ onClose, onChange, onSubmit, formData }: E
 
           {/* Date Picker */}
           <div>
-            <label className="block mb-1 text-sm font-medium text-black">Date</label>
+            <label className="block mb-1 text-sm font-medium text-black">
+              Date
+            </label>
             <input
               type="date"
               name="date"

src/components/expense/expenseForm.tsx

@@ -1,16 +1,18 @@
-import { openDB } from 'idb';
-import { Expense } from './types';
+import { openDB } from "idb";
 
-const DB_NAME = 'ExpenseDB';
-const STORE_NAME = 'expenses';
+const DB_NAME = "ExpenseDB";
+const STORE_NAME = "expenses";
 
 export async function getDB() {
   return openDB(DB_NAME, 1, {
     upgrade(db) {
       if (!db.objectStoreNames.contains(STORE_NAME)) {
-        db.createObjectStore(STORE_NAME, { keyPath: 'id', autoIncrement: true });
+        db.createObjectStore(STORE_NAME, {
+          keyPath: "id",
+          autoIncrement: true,
+        });
       }
-    }
+    },
   });
 }
 
@@ -23,9 +25,12 @@ export async function addExpense(expense: Expense): Promise<void> {
   const db = await getDB();
   await db.add(STORE_NAME, expense);
 }
- export async function updateExpense(id: number, updatedData: Partial<Expense>): Promise<void> {
+export async function updateExpense(
+  id: number,
+  updatedData: Partial<Expense>
+): Promise<void> {
   const db = await getDB();
-  const tx = db.transaction(STORE_NAME, 'readwrite');
+  const tx = db.transaction(STORE_NAME, "readwrite");
   const store = tx.objectStore(STORE_NAME);
   const existing = await store.get(id);
 
@@ -37,7 +42,16 @@ export async function addExpense(expense: Expense): Promise<void> {
 
 export async function deleteExpense(id: number): Promise<void> {
   const db = await getDB();
-  const tx = db.transaction(STORE_NAME, 'readwrite');
+  const tx = db.transaction(STORE_NAME, "readwrite");
   await tx.objectStore(STORE_NAME).delete(id);
   await tx.done;
-}
+}
+
+export type Expense = {
+  id?: number;
+  title: string;
+  category: string;
+  description: string;
+  amount: number;
+  date: string; // must be string
+};