Add invoice dialog and enhance Cashflow, Clients, Invoices, and Net Worth pages

- Introduced AddInvoiceDialog component for creating new invoices with client selection and form validation.
- Updated CashflowPage to include dialogs for adding income, expenses, and transactions, improving user interaction.
- Enhanced ClientsPage with a dialog for adding new clients, streamlining client management.
- Improved InvoicesPage with a dialog for creating new invoices, facilitating better invoice management.
- Updated NetWorthPage to include dialogs for adding assets and liabilities, enhancing financial tracking capabilities.

frontend-web/src/pages/NetWorthPage.tsx

@@ -1,10 +1,15 @@
+import {useState} from 'react';
 import {Card, CardContent, CardHeader, CardTitle} from '@/components/ui/card';
 import {Button} from '@/components/ui/button';
 import {useAppSelector} from '@/store';
 import {AreaChart, Area, XAxis, YAxis, Tooltip, ResponsiveContainer} from 'recharts';
 import {format} from 'date-fns';
+import AddAssetDialog from '@/components/dialogs/AddAssetDialog';
+import AddLiabilityDialog from '@/components/dialogs/AddLiabilityDialog';
 
 export default function NetWorthPage() {
+  const [assetDialogOpen, setAssetDialogOpen] = useState(false);
+  const [liabilityDialogOpen, setLiabilityDialogOpen] = useState(false);
   const {assets, liabilities, snapshots} = useAppSelector(state => state.netWorth);
 
   const chartData = snapshots.map(s => ({
@@ -87,7 +92,7 @@ export default function NetWorthPage() {
         <Card className="card-elevated">
           <CardHeader className="flex flex-row items-center justify-between p-3 pb-2">
             <CardTitle className="text-sm font-medium">Assets</CardTitle>
-            <Button variant="ghost" size="sm" className="h-6 px-2 text-xs">+ Add</Button>
+            <Button variant="ghost" size="sm" className="h-6 px-2 text-xs" onClick={() => setAssetDialogOpen(true)}>+ Add</Button>
           </CardHeader>
           <CardContent className="p-3 pt-0">
             <div className="space-y-1.5 max-h-[180px] overflow-y-auto">
@@ -108,7 +113,7 @@ export default function NetWorthPage() {
         <Card className="card-elevated">
           <CardHeader className="flex flex-row items-center justify-between p-3 pb-2">
             <CardTitle className="text-sm font-medium">Liabilities</CardTitle>
-            <Button variant="ghost" size="sm" className="h-6 px-2 text-xs">+ Add</Button>
+            <Button variant="ghost" size="sm" className="h-6 px-2 text-xs" onClick={() => setLiabilityDialogOpen(true)}>+ Add</Button>
           </CardHeader>
           <CardContent className="p-3 pt-0">
             <div className="space-y-1.5 max-h-[180px] overflow-y-auto">
@@ -154,6 +159,9 @@ export default function NetWorthPage() {
           </CardContent>
         </Card>
       </div>
+
+      <AddAssetDialog open={assetDialogOpen} onOpenChange={setAssetDialogOpen} />
+      <AddLiabilityDialog open={liabilityDialogOpen} onOpenChange={setLiabilityDialogOpen} />
     </div>
   );
 }