Merge branch 'feat/marketing-table-order' into 'development'

[FEAT/FE] Marketing Table Order

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

CLAUDE.md

@@ -192,12 +192,14 @@ Data tables use TanStack Table's `SortingState` wired to `useTableFilter` so tha
 
 4. **SWR key** — SWR uses `getTableFilterToQueryString()` as its key, so any filter change (including sort) automatically re-fetches with the new query params. TanStack Table's built-in client sorting is effectively disabled; the server does the sorting.
 
-**Pass `sorting` / `setSorting` to `<Table>`:**
+**Pass `sorting`, `setSorting`, and `manualSorting` to `<Table>`:**
 
 ```tsx
-<Table sorting={sorting} setSorting={setSorting} ... />
+<Table sorting={sorting} setSorting={handleSortingChange} manualSorting={true} ... />
 ```
 
+`manualSorting={true}` is required — without it TanStack Table still applies its own client-side sort pass on top of the server-sorted data, producing incorrect order.
+
 **Reference implementation:** `MarketingTable` in [src/components/pages/marketing/MarketingTable.tsx](src/components/pages/marketing/MarketingTable.tsx).
 
 ## Server-side file export pattern

src/components/pages/expense/ExpenseRequestContent.tsx

@@ -548,21 +548,15 @@ const ExpenseRequestContent = ({
                           <ul className='list-disc'>
                             {initialValues?.documents.map(
                               (requestDocument, requestDocumentIdx) => {
-                                const path = requestDocument.path.startsWith(
-                                  '/'
-                                )
-                                  ? requestDocument.path.slice(1)
-                                  : requestDocument.path;
-                                const documentUrl = `${S3_PUBLIC_BASE_URL}/${path}`;
                                 return (
                                   <li key={requestDocumentIdx}>
                                     <Link
-                                      href={documentUrl}
+                                      href={requestDocument.path}
                                       target='_blank'
                                       rel='noopener noreferrer'
                                       className='text-blue-500 underline'
                                     >
-                                      {requestDocument.path}{' '}
+                                      {requestDocument.name}{' '}
                                       <Icon
                                         icon='cuida:open-in-new-tab-outline'
                                         width={12}

src/components/pages/marketing/MarketingTable.tsx

@@ -883,6 +883,8 @@ const MarketingTable = () => {
                 'customer_name',
                 'project_flock_name',
                 'project_flock_kandang_name',
+                'sort_by',
+                'order_by',
               ]}
               onClick={() => {
                 filterModal.openModal();
@@ -975,6 +977,7 @@ const MarketingTable = () => {
               page={isResponseSuccess(marketing) ? marketing?.meta?.page : 1}
               sorting={sorting}
               setSorting={handleSortingChange}
+              manualSorting
               totalItems={
                 isResponseSuccess(marketing)
                   ? marketing?.meta?.total_results

src/types/api/expense.d.ts

@@ -10,6 +10,7 @@ export type BaseExpense = {
   category: 'BOP' | 'NON-BOP';
   documents?: {
     id: number;
+    name: string;
     path: string;
   }[];
   realization_docs?: {