Refactor YearOverview component to improve gift status tracking, update statistics display with detailed breakdowns for planned, decided, bought, and wrapped gifts, and adjust budget calculations for better financial overview.

src/components/molecules/GiftCard/index.tsx

@@ -1,12 +1,10 @@
 'use client';
 import { FC, useState } from 'react';
 import { formatCurrency } from '@/helpers/formatCurrency';
-import { formatStatus } from '@/helpers/formatStatus';
 import { GiftModal } from '../GiftModal';
 import { useGlobalStore } from '@/app/store/global';
 import { DB } from '@/lib/db';
 import { useRouter } from 'next/navigation';
-import { Button } from '@/components/atoms/Button';
 import { Badge } from '@/components/atoms/Badge';
 import Link from 'next/link';
 import { Heading } from '@/components/atoms/Heading';

src/components/organisms/YearOverview/index.tsx

@@ -22,28 +22,42 @@ export const YearOverview: FC<Props> = async ({ year }) => {
     }),
   );
 
+  const planned = gifts.filter((gift) => gift.status === 'planned');
+  const decided = gifts.filter((gift) => gift.status === 'decided');
+  const bought = gifts.filter((gift) => gift.status === 'bought');
+  const wrapped = gifts.filter((gift) => gift.status === 'wrapped');
+
   const totalCost = gifts.reduce((acc, gift) => acc + gift.cost, 0);
-  const averageCost = totalCost / gifts.length;
+  const totalCostPlanned =
+    planned.reduce((acc, gift) => acc + gift.cost, 0) + decided.reduce((acc, gift) => acc + gift.cost, 0);
+  const totalCostBought = bought.reduce((acc, gift) => acc + gift.cost, 0);
+
+  const remainingBudget = data.budgetLimit - totalCostBought;
 
   return (
     <div className='mb-6 md:mb-8'>
       <Heading size='large'>Podsumowanie roku {data.year}</Heading>
       <div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4'>
-        <StatsCard title='Planowane prezenty' value={gifts.length} />
+        <StatsCard title='Ilość prezentów' value={gifts.length} />
+        <StatsCard title='Planowane prezenty' value={planned.length} />
+        <StatsCard title='Do kupienia' value={decided.length} />
+        <StatsCard title='Kupione' value={bought.length} />
+
         <StatsCard
-          title='Łączny koszt'
+          title='Budżet'
-          value={formatCurrency(totalCost)}
+          value={formatCurrency(remainingBudget)}
-          description={`Średnio: ${formatCurrency(averageCost)}`}
+          description={`Ustawiony limit: ${formatCurrency(data.budgetLimit)}`}
+        />
+        <StatsCard title='Łączny koszt' value={formatCurrency(totalCostBought)} description={`Poniesione koszty`} />
+        <StatsCard
+          title='Koszt prezentów'
+          value={formatCurrency(totalCostPlanned)}
+          description={`Prezenty do kupienia`}
         />
         <StatsCard
-          title='Status: Do kupienia'
+          title='Bufor'
-          value={gifts.filter((gift) => gift.status === 'decided').length}
+          value={formatCurrency(remainingBudget - totalCostPlanned)}
-          description='Prezenty do kupienia'
+          description={`Pozostałe pieniądze (budżet - poniesione koszty - koszt prezentów)`}
-        />
-        <StatsCard
-          title='Status: Kupione'
-          value={gifts.filter((gift) => gift.status === 'bought').length}
-          description='Prezenty które zostały już kupione'
         />
       </div>
     </div>