feat: Implement Invoice editor to create or modify invoices

apps/web/src/features/finance/invoices/InvoiceList.tsx

@@ -22,7 +22,7 @@ import { dataConnect } from "@/features/auth/firebase";
 import DashboardLayout from "@/features/layouts/DashboardLayout";
 import type { RootState } from "@/store/store";
 import { format, isWithinInterval, parseISO } from "date-fns";
-import { FileText, Plus, Search } from "lucide-react";
+import { FileText, Plus, Search, SquarePen } from "lucide-react";
 import { useMemo, useState } from "react";
 import { useSelector } from "react-redux";
 import { useNavigate } from "react-router-dom";
@@ -274,7 +274,7 @@ export default function InvoiceList() {
                               navigate(`/invoices/${invoice.id}/edit`);
                             }}
                           >
-                            <FileText className="h-4 w-4" />
+                            <SquarePen className="h-4 w-4" />
                           </Button>
                         </TableCell>
                       </TableRow>

apps/web/src/routes.tsx

@@ -26,7 +26,7 @@ import StaffAvailability from './features/operations/availability/StaffAvailabil
 import TaskBoard from './features/operations/tasks/TaskBoard';
 import InvoiceList from './features/finance/invoices/InvoiceList';
 import InvoiceDetail from './features/finance/invoices/InvoiceDetail';
-
+import InvoiceEditor from './features/finance/invoices/InvoiceEditor';
 
 /**
  * AppRoutes Component
@@ -118,7 +118,9 @@ const AppRoutes: React.FC = () => {
             {/* Finance Routes */}
           <Route path="/invoices" element={<InvoiceList />} />
           <Route path="/invoices/:id" element={<InvoiceDetail />} />
-
+          <Route path="/invoices/:id/edit" element={<InvoiceEditor />} />
+          <Route path="/invoices/new" element={<InvoiceEditor />} />
+          
         </Route>
         <Route path="*" element={<Navigate to="/login" replace />} />
       </Routes>