Added untested changes for exporting all receivables BOD-240

client/src/components/accounting-receivables-table/accounting-receivables-table.component.jsx

@@ -6,9 +6,12 @@ import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { alphaSort } from "../../utils/sorters";
 import JobExportButton from "../jobs-close-export-button/jobs-close-export-button.component";
 import { logImEXEvent } from "../../firebase/firebase.utils";
+import { JobsExportAllButton } from "../jobs-export-all-button/jobs-export-all-button.component";
 
 export default function AccountingReceivablesTableComponent({ loading, jobs }) {
   const { t } = useTranslation();
+  const [selectedJobs, setSelectedJobs] = useState([]);
+  const [transInProgress, setTransInProgress] = useState(false);
 
   const [state, setState] = useState({
     sortedInfo: {},
@@ -178,8 +181,15 @@ export default function AccountingReceivablesTableComponent({ loading, jobs }) {
         loading={loading}
         title={() => {
           return (
-            <div>
-              <Input
+            <div className="imex-table-header">
+              <JobsExportAllButton
+                jobIds={selectedJobs}
+                disabled={transInProgress || selectedJobs.length === 0}
+                loadingCallback={setTransInProgress}
+                completedCallback={setSelectedJobs}
+              />
+              <Input.Search
+                className="imex-table-header__search"
                 value={state.search}
                 onChange={handleSearch}
                 placeholder={t("general.labels.search")}
@@ -189,11 +199,23 @@ export default function AccountingReceivablesTableComponent({ loading, jobs }) {
           );
         }}
         dataSource={dataSource}
-        size='small'
+        size="small"
         pagination={{ position: "top" }}
         columns={columns}
-        rowKey='id'
+        rowKey="id"
         onChange={handleTableChange}
+        rowSelection={{
+          onSelectAll: (selected, selectedRows) =>
+            setSelectedJobs(selectedRows.map((i) => i.id)),
+          onSelect: (record, selected, selectedRows, nativeEvent) => {
+            setSelectedJobs(selectedRows.map((i) => i.id));
+          },
+          getCheckboxProps: (record) => ({
+            disabled: record.exported,
+          }),
+          selectedRowKeys: selectedJobs,
+          type: "checkbox",
+        }}
       />
     </div>
   );