refactor(FE): Refactor sales data fetching and component structure

src/components/pages/closing/table/SalesClosingTable.tsx

@@ -5,6 +5,7 @@ import { ColumnDef } from '@tanstack/react-table';
 import Table from '@/components/Table';
 import Card from '@/components/Card';
 import { formatCurrency, formatNumber, formatDate } from '@/lib/helper';
+import { isResponseSuccess } from '@/lib/api-helper';
 import {
   BaseClosingSales,
   BaseSales,
@@ -13,20 +14,46 @@ import {
 import { Product } from '@/types/api/master-data/product';
 import { Customer } from '@/types/api/master-data/customer';
 import { Kandang } from '@/types/api/master-data/kandang';
+import { ClosingApi } from '@/services/api/closing';
+import { useSearchParams } from 'next/navigation';
+import useSWR from 'swr';
 
 interface SalesClosingTableProps {
-  type?: 'detail';
-  initialValues?: BaseClosingSales;
+  projectFlockId: number;
 }
 
-const SalesClosingTable = ({ initialValues }: SalesClosingTableProps) => {
+const SalesClosingTable = ({
+  projectFlockId,
+}: SalesClosingTableProps) => {
+  const searchParams = useSearchParams();
+  const kandangId = searchParams.get('kandangId');
+
+  const { data: sales, isLoading } = useSWR(
+    kandangId
+      ? `/closing/sales/${projectFlockId}/${kandangId}`
+      : `/closing/sales/${projectFlockId}`,
+    () =>
+      kandangId
+        ? ClosingApi.getPenjualanByKandang(
+            projectFlockId,
+            Number(kandangId)
+          )
+        : ClosingApi.getPenjualan(projectFlockId)
+  );
+
   const salesData: BaseSales[] = useMemo(() => {
-    return initialValues?.sales || [];
-  }, [initialValues]);
+    if (isResponseSuccess(sales)) {
+      return sales.data.sales || [];
+    }
+    return [];
+  }, [sales]);
 
   const summary: ClosingSalesSummary | undefined = useMemo(() => {
-    return initialValues?.summary;
-  }, [initialValues]);
+    if (isResponseSuccess(sales)) {
+      return sales.data.summary;
+    }
+    return undefined;
+  }, [sales]);
 
   const totals = useMemo(() => {
     if (salesData.length === 0) {
@@ -306,6 +333,7 @@ const SalesClosingTable = ({ initialValues }: SalesClosingTableProps) => {
             <Table
               data={salesData}
               columns={salesColumns}
+              isLoading={isLoading}
               renderFooter={salesData.length > 0}
               className={{
                 tableWrapperClassName: 'overflow-x-auto',