Fix: specific item api & customer api

client/src/containers/Customers/Customer.js

@@ -17,6 +17,7 @@ function Customer({
   formik,
   //#withCustomersActions
   requestFetchCustomers,
+  requestFetchCustomer,
 }) {
   const { id } = useParams();
   const history = useHistory();
@@ -26,11 +27,12 @@ function Customer({
     requestFetchCustomers({}),
   );
   // Handle fetch customer details.
-  const fetchCustomer= useQuery(['customer', id], () =>
-    requestFetchCustomers(),
-    { enabled: !!id },
+  const fetchCustomer = useQuery(
+    ['customer', id],
+    (key, customerId) => requestFetchCustomer(customerId),
+    { enabled: id && id },
   );
-
+  
   const handleFormSubmit = useCallback(
     (payload) => {
       payload.redirect && history.push('/customers');

client/src/containers/Customers/withCustomersActions.js

@@ -1,20 +1,21 @@
 import { connect } from 'react-redux';
 import {
   fetchCustomers,
+  fetchCustomer,
   submitCustomer,
   editCustomer,
   deleteCustomer,
-  deleteBulkCustomers
+  deleteBulkCustomers,
 } from 'store/customers/customers.actions';
 import t from 'store/types';
 
 export const mapDispatchToProps = (dispatch) => ({
   requestFetchCustomers: (query) => dispatch(fetchCustomers({ query })),
   requestDeleteCustomer: (id) => dispatch(deleteCustomer({ id })),
-  requestDeleteBulkCustomers:(ids)=>dispatch(deleteBulkCustomers({ids})),
+  requestDeleteBulkCustomers: (ids) => dispatch(deleteBulkCustomers({ ids })),
   requestSubmitCustomer: (form) => dispatch(submitCustomer({ form })),
   requestEditCustomer: (id, form) => dispatch(editCustomer({ id, form })),
-
+  requestFetchCustomer: (id) => dispatch(fetchCustomer({ id })),
   addCustomersTableQueries: (queries) =>
     dispatch({
       type: t.CUSTOMERS_TABLE_QUERIES_ADD,

client/src/store/customers/customers.actions.js

@@ -1,3 +1,4 @@
+import { resolve } from 'p-progress';
 import ApiService from 'services/ApiService';
 import t from 'store/types';
 
@@ -52,10 +53,9 @@ export const fetchCustomers = ({ query }) => {
       ApiService.get(`customers`, { params: { ...pageQuery, ...query } })
         .then((response) => {
           dispatch({
-            type: t.CUSTOMER_SET,
+            type: t.CUSTOMERS_ITEMS_SET,
             customers: response.data.customers,
           });
-
           dispatch({
             type: t.CUSTOMERS_PAGE_SET,
             customers: response.data.customers,
@@ -74,6 +74,26 @@ export const fetchCustomers = ({ query }) => {
     });
 };
 
+export const fetchCustomer = ({ id }) => {
+  return (dispatch) =>
+    new Promise((resolve, reject) => {
+      ApiService.get(`customers/${id}`)
+        .then((response) => {
+          dispatch({
+            type: t.CUSTOMER_SET,
+            payload: {
+              id,
+              customer: response.data.contact,
+            },
+          });
+          resolve(response);
+        })
+        .catch((error) => {
+          reject(error);
+        });
+    });
+};
+
 export const deleteCustomer = ({ id }) => {
   return (dispatch) =>
     new Promise((resolve, reject) => {

client/src/store/customers/customers.reducer.js

@@ -11,7 +11,7 @@ const initialState = {
 };
 
 const customersReducer = createReducer(initialState, {
-  [t.CUSTOMER_SET]: (state, action) => {
+  [t.CUSTOMERS_ITEMS_SET]: (state, action) => {
     const _customers = {};
 
     action.customers.forEach((customer) => {
@@ -51,6 +51,10 @@ const customersReducer = createReducer(initialState, {
     });
     state.items = items;
   },
+  [t.CUSTOMER_SET]: (state, action) => {
+    const { id, customer } = action.payload;
+    state.items[id] = { ...customer };
+  },
 });
 
 export default createTableQueryReducers('customers', customersReducer);

client/src/store/items/items.actions.js

@@ -55,8 +55,12 @@ export const fetchItem = ({ id }) => {
         .then((response) => {
           dispatch({
             type: t.ITEM_SET,
-            item: response.data.item,
+            payload: {
+              id,
+              item: response.data.item,
+            },
           });
+          resolve(response);
         })
         .catch((error) => {
           reject(error);

client/src/store/items/items.reducer.js

@@ -27,6 +27,11 @@ const itemsReducer = createReducer(initialState, {
     };
   },
 
+  [t.ITEM_SET]: (state, action) => {
+    const { id, item } = action.payload;
+    state.items[id] = { ...item };
+  },
+
   [t.ITEMS_PAGE_SET]: (state, action) => {
     const { items, customViewId, paginationMeta } = action;
 
@@ -42,10 +47,10 @@ const itemsReducer = createReducer(initialState, {
         state.itemsRelation[item.id] = [];
       }
       const filteredRelation = state.itemsRelation[item.id].filter(
-        (relation) => (
+        (relation) =>
           relation.viewId === viewId &&
-          relation.pageNumber === paginationMeta.page
-      ));
+          relation.pageNumber === paginationMeta.page,
+      );
 
       filteredRelation.push({
         viewId,

client/src/store/items/items.types.js

@@ -1,7 +1,6 @@
-
-
 export default {
   ITEMS_SET: 'ITEMS_SET',
+  ITEM_SET: 'ITEM_SET',
   ITEMS_PAGE_SET: 'ITEMS_PAGE_SET',
   ITEM_DELETE: 'ITEM_DELETE',
   ITEM_BULK_ACTION_ADD: 'ITEM_BULK_ACTION_ADD',
@@ -12,6 +11,5 @@ export default {
 
   ITEMS_TABLE_LOADING: 'ITEMS_TABLE_LOADING',
   ITEMS_SET_CURRENT_VIEW: 'ITEMS_SET_CURRENT_VIEW',
-  ITEMS_BULK_DELETE:'ITEMS_BULK_DELETE'
-
+  ITEMS_BULK_DELETE: 'ITEMS_BULK_DELETE',
 };