feat(warehouseTransfer): add crud warehouse transfer.

src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferForm.js

@@ -53,8 +53,8 @@ function WarehouseTransferForm({
   // Form initial values.
   const initialValues = React.useMemo(
     () => ({
-      ...(!isEmpty(null)
-        ? { ...transformToEditForm(null) }
+      ...(!isEmpty(warehouseTransfer)
+        ? { ...transformToEditForm(warehouseTransfer) }
         : {
             ...defaultWarehouseTransfer,
             entries: orderingLinesIndexes(defaultWarehouseTransfer.entries),

src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormPage.js

@@ -1,6 +1,7 @@
 import React from 'react';
+import { useParams } from 'react-router-dom';
 
-import '../../../style/pages/WarehouseTransfers/PageForm.scss'
+import '../../../style/pages/WarehouseTransfers/PageForm.scss';
 import WarehouseTransferForm from './WarehouseTransferForm';
 import { WarehouseTransferFormProvider } from './WarehouseTransferFormProvider';
 
@@ -8,8 +9,10 @@ import { WarehouseTransferFormProvider } from './WarehouseTransferFormProvider';
  * WarehouseTransfer form page.
  */
 export default function WarehouseTransferFormPage() {
+  const { id } = useParams();
+  const idAsInteger = parseInt(id, 10);
   return (
-    <WarehouseTransferFormProvider warehouseTransferId={null}>
+    <WarehouseTransferFormProvider warehouseTransferId={idAsInteger}>
       <WarehouseTransferForm />
     </WarehouseTransferFormProvider>
   );

src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormProvider.js

@@ -3,6 +3,7 @@ import DashboardInsider from 'components/Dashboard/DashboardInsider';
 import {
   useItems,
   useWarehouses,
+  useWarehouseTransfer,
   useCreateWarehouseTransfer,
   useEditWarehouseTransfer,
 } from 'hooks/query';
@@ -24,6 +25,12 @@ function WarehouseTransferFormProvider({ warehouseTransferId, ...props }) {
     stringified_filter_roles: ITEMS_FILTER_ROLES_QUERY,
   });
 
+  // Handle fetch warehouse transfer detail.
+  const { data: warehouseTransfer, isLoading: isWarehouseTransferLoading } =
+    useWarehouseTransfer(warehouseTransferId, {
+      enabled: !!warehouseTransferId,
+    });
+
   // Fetch warehouses list.
   const {
     data: warehouses,
@@ -47,7 +54,7 @@ function WarehouseTransferFormProvider({ warehouseTransferId, ...props }) {
   const provider = {
     items,
     warehouses,
-    warehouseTransfer: [],
+    warehouseTransfer,
 
     isItemsFetching,
     isWarehouesFetching,
@@ -58,9 +65,12 @@ function WarehouseTransferFormProvider({ warehouseTransferId, ...props }) {
     createWarehouseTransferMutate,
     editWarehouseTransferMutate,
   };
+
   return (
     <DashboardInsider
-      loading={isItemsLoading || isWarehouesLoading}
+      loading={
+        isItemsLoading || isWarehouesLoading || isWarehouseTransferLoading
+      }
       name={'warehouse-transfer-form'}
     >
       <WarehouseFormContext.Provider value={provider} {...props} />