Datenbank aufgefüllt und Einträge angepasst (bei 'Wie')

app/page.tsx

@@ -7,6 +7,7 @@ import { AusgabenEntry } from '@/types/ausgaben';
 import packageJson from '@/package.json';
 
 export default function Home() {
+  const [activeTab, setActiveTab] = useState(0); // 0 = Haushalt, 1 = Privat
   const [entries, setEntries] = useState<AusgabenEntry[]>([]);
   const [isLoading, setIsLoading] = useState(true);
   const [selectedEntry, setSelectedEntry] = useState<AusgabenEntry | null>(null);
@@ -15,12 +16,13 @@ export default function Home() {
 
   useEffect(() => {
     fetchRecentEntries();
-  }, []);
+    setSelectedEntry(null); // Clear selected entry when switching tabs
+  }, [activeTab]);
 
   const fetchRecentEntries = async () => {
     setIsLoading(true);
     try {
-      const response = await fetch('/api/ausgaben?limit=10', {
+      const response = await fetch(`/api/ausgaben?limit=10&typ=${activeTab}`, {
         cache: 'no-store',
         headers: {
           'Cache-Control': 'no-cache',
@@ -58,9 +60,33 @@ export default function Home() {
       <main className="max-w-7xl mx-auto border-2 border-black rounded-lg p-6 bg-[#FFFFDD]">
         <h1 className="text-3xl font-bold text-center mb-6">Ausgaben - Log</h1>
         
+        {/* Tab Navigation */}
+        <div className="flex gap-2 mb-6">
+          <button
+            onClick={() => setActiveTab(0)}
+            className={`flex-1 py-3 px-6 rounded-lg font-semibold transition-colors ${
+              activeTab === 0
+                ? 'bg-[#85B7D7] text-black'
+                : 'bg-gray-200 text-gray-700 hover:bg-gray-300'
+            }`}
+          >
+            Haushalt
+          </button>
+          <button
+            onClick={() => setActiveTab(1)}
+            className={`flex-1 py-3 px-6 rounded-lg font-semibold transition-colors ${
+              activeTab === 1
+                ? 'bg-[#85B7D7] text-black'
+                : 'bg-gray-200 text-gray-700 hover:bg-gray-300'
+            }`}
+          >
+            Privat
+          </button>
+        </div>
+
         <div>
           <h2 className="text-xl font-semibold mb-4">Eingabe</h2>
-          <AusgabenForm onSuccess={handleSuccess} selectedEntry={selectedEntry} />
+          <AusgabenForm onSuccess={handleSuccess} selectedEntry={selectedEntry} typ={activeTab} />
           
           <div className="mt-6 bg-white border border-black rounded-lg shadow-md p-6">
             <h3 className="text-xl font-semibold mb-4">Letzte 10 Einträge</h3>