Merge branch 'feat/server-side-sorting-purchasing-expense' into 'development'

[FEAT/FE] Server-Side Sorting Purchasing & Expense

See merge request mbugroup/lti-web-client!477

src/components/Table.tsx

@@ -173,6 +173,7 @@ const Table = <TData extends object>({
   const tableOptions: TableOptions<TData> = {
     columns,
     data: isLoading ? (DUMMY_SKELETON_DATA as TData[]) : data, // Type assertion
+    defaultColumn: { sortDescFirst: false },
     getCoreRowModel: getCoreRowModel(),
     getSortedRowModel: getSortedRowModel(),
     getPaginationRowModel: getPaginationRowModel(),

src/components/modal/ConfirmationModalWithNotes.tsx

@@ -69,6 +69,7 @@ const ConfirmationModalWithNotes: React.FC<ConfirmationModalWithNotesProps> = ({
       secondaryButton={
         secondaryButton
           ? {
+              ...secondaryButton,
               text: secondaryButton?.text ?? 'Tidak',
               onClick: (e) => {
                 if (secondaryButton && secondaryButton?.onClick) {

src/components/pages/marketing/MarketingTable.tsx

@@ -297,6 +297,8 @@ const MarketingTable = () => {
 
   const [isLoadingExportingToExcel, setIsLoadingExportingToExcel] =
     useState(false);
+  const [isApproveLoading, setIsApproveLoading] = useState(false);
+  const [isDeliveryLoading, setIsDeliveryLoading] = useState(false);
 
   const filterResetHandler = () => {
     updateFilter('product_ids', '', true);
@@ -452,6 +454,9 @@ const MarketingTable = () => {
       return;
     }
 
+    setIsApproveLoading(true);
+
+    try {
       const approveMarketingRes: BaseApiResponse<unknown> | undefined =
         approveAction === 'APPROVED'
           ? await MarketingApi.bulkApprovals(
@@ -460,7 +465,11 @@ const MarketingTable = () => {
               '',
               notes || `APPROVED marketing ${idsToProcess.join(', ')}`
             )
-        : await SalesOrderApi.bulkApprovals(idsToProcess, approveAction, notes);
+          : await SalesOrderApi.bulkApprovals(
+              idsToProcess,
+              approveAction,
+              notes
+            );
 
       if (isResponseSuccess(approveMarketingRes)) {
         confirmationModal.closeModal();
@@ -469,6 +478,9 @@ const MarketingTable = () => {
       }
 
       refreshMarketing();
+    } finally {
+      setIsApproveLoading(false);
+    }
   };
 
   const bulkDeliveryDateChangeHandler: ChangeEventHandler<HTMLInputElement> = (
@@ -530,13 +542,21 @@ const MarketingTable = () => {
   };
 
   const confirmationModalDeliveryClickHandler = async (notes: string) => {
-    const res = await SalesOrderApi.delivery(selectedItem?.id as number, notes);
+    setIsDeliveryLoading(true);
+    try {
+      const res = await SalesOrderApi.delivery(
+        selectedItem?.id as number,
+        notes
+      );
       deliveryModal.closeModal();
       toast.success(res?.message as string);
       refreshMarketing?.();
       router.push(
         `/marketing/detail/delivery-orders/edit?id=${selectedItem?.id}`
       );
+    } finally {
+      setIsDeliveryLoading(false);
+    }
   };
 
   const getRowCanSelect = useCallback(
@@ -1020,11 +1040,13 @@ const MarketingTable = () => {
         text={`Apakah anda yakin ingin ${approveAction == 'APPROVED' ? 'approve' : 'reject'} data penjualan tahap ${selectedApprovalStep ?? '-'} (${idsToProcess.length} data)?`}
         secondaryButton={{
           text: 'Tidak',
+          isLoading: isApproveLoading,
           onClick: confirmationModal.closeModal,
         }}
         primaryButton={{
           text: 'Ya',
           color: approveAction === 'APPROVED' ? 'success' : 'error',
+          isLoading: isApproveLoading,
           onClick: approveMarketingHandler,
         }}
       />
@@ -1048,10 +1070,12 @@ const MarketingTable = () => {
         text={`Apakah anda yakin ingin deliver penjualan ${selectedItem?.so_number}?`}
         secondaryButton={{
           text: 'Tidak',
+          isLoading: isDeliveryLoading,
         }}
         primaryButton={{
           text: 'Ya',
           color: 'success',
+          isLoading: isDeliveryLoading,
           onClick: confirmationModalDeliveryClickHandler,
         }}
       />
@@ -1111,6 +1135,7 @@ const MarketingTable = () => {
             <Button
               variant='outline'
               color='none'
+              disabled={isSubmittingBulkDelivery}
               onClick={() => {
                 bulkDeliveryModal.closeModal();
                 setBulkDeliveryDate('');
@@ -1123,6 +1148,7 @@ const MarketingTable = () => {
             <Button
               color='success'
               isLoading={isSubmittingBulkDelivery}
+              disabled={isSubmittingBulkDelivery}
               onClick={() =>
                 submitBulkDeliveryApprovalHandler(
                   idsToProcess,

src/components/pages/purchase/PurchaseTable.tsx

@@ -266,8 +266,8 @@ const PurchaseTable = () => {
   // ===== TABLE COLUMNS DEFINITION =====
   const purchaseColumns: ColumnDef<Purchase>[] = [
     {
+      accessorKey: 'po_number',
       header: 'No. PR/PO',
-      enableSorting: false,
       cell: (props) => {
         const { pr_number, po_number } = props.row.original;
         return po_number ? po_number : pr_number;