fix

client/src/components/dashboard/DashboardCustomersList.js

@@ -299,7 +299,14 @@ const DashboardCustomersList = ({ additionalButtons, showBreadcrumb = false, tit
   }
 
   const table = <div className="list row mb-4">
-    <div className="col-md-12" style={{ overflow: 'auto'}}>
+    <div
+      className="col-md-12"
+      style={{
+        overflow: 'auto',
+        minHeight: isAllCustomersPage ? 'calc(100vh - 360px)' : undefined,
+        paddingBottom: isAllCustomersPage ? '24px' : undefined
+      }}
+    >
       <table className="personnel-info-table"> 
         <thead>
           <tr>

client/src/components/trans-routes/RouteView.js

@@ -27,6 +27,7 @@ const RouteView = () => {
   const [routeStatusValue, setRouteStatusValue] = useState('');
   const [isSavingRouteStatus, setIsSavingRouteStatus] = useState(false);
   const [latestRouteForStatus, setLatestRouteForStatus] = useState(undefined);
+  const [customerMetaById, setCustomerMetaById] = useState(new Map());
   const paramsQuery = new URLSearchParams(window.location.search);
   const scheduleDate = paramsQuery.get('dateSchedule');
 
@@ -41,7 +42,22 @@ const RouteView = () => {
     { value: ROUTE_STATUS.SIGN_OFF, label: 'Signed Off' },
     { value: ROUTE_STATUS.UNEXPECTED_ABSENT, label: 'Unexpected Absent' },
   ];
-  const routeForStatusView = latestRouteForStatus || currentRoute;
+  const getRouteWithLatestCustomerMeta = (route) => {
+    if (!route || !Array.isArray(route?.route_customer_list) || customerMetaById.size === 0) {
+      return route;
+    }
+    return Object.assign({}, route, {
+      route_customer_list: route.route_customer_list.map((customerInRoute) => {
+        const customerMeta = customerMetaById.get(customerInRoute?.customer_id);
+        if (!customerMeta) return customerInRoute;
+        return Object.assign({}, customerInRoute, {
+          customer_program_type: customerMeta.program_type || '',
+          customer_pay_source: customerMeta.pay_source || ''
+        });
+      })
+    });
+  };
+  const routeForStatusView = getRouteWithLatestCustomerMeta(latestRouteForStatus || currentRoute);
   const closeModal = () => {
     setShowVehicleDetails(false);
   }
@@ -144,6 +160,23 @@ const RouteView = () => {
       });
   }, [currentRoute?.driver, currentDriver?.id]);
 
+  useEffect(() => {
+    CustomerService.getAllCustomers()
+      .then((res) => {
+        const nextMap = new Map();
+        (res?.data || []).forEach((customer) => {
+          nextMap.set(customer?.id, {
+            program_type: customer?.program_type || '',
+            pay_source: customer?.pay_source || ''
+          });
+        });
+        setCustomerMetaById(nextMap);
+      })
+      .catch(() => {
+        setCustomerMetaById(new Map());
+      });
+  }, []);
+
   useEffect(() => {
     const dateArr = moment(currentRoute?.schedule_date)?.format('MM/DD/YYYY')?.split('/') || [];