@djb25/digit-ui-module-vendor 1.0.12 → 1.0.14

package/dist/index.modern.js

@@ -1,7 +1,7 @@
-import { Header, SearchForm, SearchField, Dropdown as Dropdown$2, MobileNumber, CardLabelError, DatePicker as DatePicker$3, SubmitBar, Card, Table, Loader, Toast, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, HomeIcon, PropertyHouse, EmployeeModuleCard, Stepper, FormComposer, TickMark, FormStep, CardLabel, TextInput, LabelFieldPair, UploadFile, CardSubHeader, CardText, RadioOrSelect, ShippingTruck, CheckBox, RadioButtons, CloseSvg, Localities, RemoveableTag, ActionBar, ApplyFilterBar, AddIcon, Menu, Label, LinkLabel, ToggleSwitch, CardSectionHeader, StatusTable, Row, EditIcon, DeleteIcon, Modal, InfoIcon, CardHeader, LinkButton, Banner } from '@djb25/digit-ui-react-components';
-import React, { useEffect, useMemo, useCallback, useState, Fragment } from 'react';
+import React, { useEffect, useMemo, useCallback, useState, Fragment as Fragment$1 } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useParams, useLocation, Switch, Link, useHistory, useRouteMatch, Route, Redirect } from 'react-router-dom';
+import { Header, SearchForm, SearchField, Dropdown as Dropdown$2, MobileNumber, CardLabelError, DatePicker as DatePicker$3, SubmitBar, Card, Table, Loader, Toast, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, HomeIcon, PropertyHouse, EmployeeModuleCard, Stepper, FormComposer, TickMark, FormStep, CardLabel, TextInput, LabelFieldPair, UploadFile, CardSubHeader, CardText, RadioOrSelect, ShippingTruck, CheckBox, RadioButtons, CloseSvg, Localities, RemoveableTag, ActionBar, ApplyFilterBar, AddIcon, Menu, Label, LinkLabel, ToggleSwitch, CardSectionHeader, StatusTable, Row, EditIcon, DeleteIcon, Modal, InfoIcon, CardHeader, LinkButton, Banner } from '@djb25/digit-ui-react-components';
 import { useForm, Controller } from 'react-hook-form';
 import { useQueryClient } from 'react-query';
 
@@ -381,54 +381,59 @@ const EmployeeApp = ({
     }), "Back"),
     onLeftClick: () => window.history.back(),
     breadcrumbs: getDynamicBreadcrumbs()
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "employee-form"
-  }, /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: `${path}/registry/new-vendor`,
-    component: () => /*#__PURE__*/React.createElement(AddVendor, {
-      parentRoute: path
-    })
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
     path: `${path}/search-vendor`,
-    component: () => /*#__PURE__*/React.createElement(SearchVendor, {
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(SearchVendor, Object.assign({}, props, {
       parentRoute: path
-    })
+    })), layouts.normal)
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
     path: `${path}/registry/new-driver`,
-    component: () => /*#__PURE__*/React.createElement(AddDriver, {
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(AddDriver, Object.assign({}, props, {
       parentRoute: path
-    })
+    })), layouts.normal)
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: `${path}/registry/vendor-details/:id`,
-    component: () => /*#__PURE__*/React.createElement(EditVendorDetails, {
+    path: `${path}/registry/new-vehicle`,
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(AddVehicle, Object.assign({}, props, {
       parentRoute: path
-    })
+    })), layouts.normal)
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: `${path}/registry/vehicle-details/:id`,
-    component: () => /*#__PURE__*/React.createElement(VehicleDetails, {
+    path: `${path}/registry/additionaldetails`,
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(VendorCreate, Object.assign({}, props, {
       parentRoute: path
-    })
+    })), layouts.normal)
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: `${path}/registry/new-vehicle`,
-    component: () => /*#__PURE__*/React.createElement(AddVehicle, {
+    path: `${path}/registry/driver-details/:id`,
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(DriverDetails, Object.assign({}, props, {
       parentRoute: path
-    })
+    })), layouts.action)
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: `${path}/registry/additionaldetails`,
-    component: () => /*#__PURE__*/React.createElement(VendorCreate, {
+    path: `${path}/common-search/:id`,
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(SearchApp, Object.assign({}, props, {
       parentRoute: path
-    })
+    })), layouts.normal)
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: `${path}/registry/driver-details`,
-    component: () => /*#__PURE__*/React.createElement(DriverDetails, {
+    path: `${path}/registry/new-vendor`,
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(AddVendor, Object.assign({}, props, {
       parentRoute: path
-    })
+    })), layouts.action)
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
-    path: `${path}/common-search/:id`,
-    component: props => /*#__PURE__*/React.createElement(SearchApp, Object.assign({}, props, {
+    path: `${path}/registry/vendor-details/:id`,
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(EditVendorDetails, Object.assign({}, props, {
       parentRoute: path
-    }))
-  }))))));
+    })), layouts.action)
+  }), /*#__PURE__*/React.createElement(PrivateRoute, {
+    path: `${path}/registry/vehicle-details/:id`,
+    component: renderWithLayout(props => /*#__PURE__*/React.createElement(VehicleDetails, Object.assign({}, props, {
+      parentRoute: path
+    })), layouts.action)
+  })))));
+};
+const renderWithLayout = (Component, layoutClass) => routeProps => /*#__PURE__*/React.createElement("div", {
+  className: layoutClass
+}, /*#__PURE__*/React.createElement(Component, routeProps));
+const layouts = {
+  normal: "employee-form",
+  action: "employee-form employee-form-content-with-action-bar"
 };
 
 const VENDORCard = () => {
@@ -1736,9 +1741,7 @@ const VendorSelectAddress = ({
     });
   }
   if (userType === "employee") {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CardLabel, {
-      className: "card-label-smaller"
-    }, t("MYCITY_CODE_LABEL"), config.isMandatory ? " * " : null), /*#__PURE__*/React.createElement(Dropdown$2, {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("MYCITY_CODE_LABEL"), config.isMandatory ? " * " : null), /*#__PURE__*/React.createElement(Dropdown$2, {
       className: "",
       isMandatory: true,
       selected: (cities === null || cities === void 0 ? void 0 : cities.length) === 1 ? cities[0] : selectedCity,
@@ -1747,9 +1750,7 @@ const VendorSelectAddress = ({
       select: selectCity,
       optionKey: "code",
       t: t
-    }), /*#__PURE__*/React.createElement(CardLabel, {
-      className: "card-label-smaller"
-    }, t("ES_NEW_APPLICATION_LOCATION_MOHALLA"), config.isMandatory ? " * " : null), /*#__PURE__*/React.createElement(Dropdown$2, {
+    })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("ES_NEW_APPLICATION_LOCATION_MOHALLA"), config.isMandatory ? " * " : null), /*#__PURE__*/React.createElement(Dropdown$2, {
       className: "",
       isMandatory: true,
       selected: selectedLocality,
@@ -1757,7 +1758,7 @@ const VendorSelectAddress = ({
       select: selectLocality,
       optionKey: "name",
       t: t
-    }));
+    })));
   }
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormStep, {
     config: config,
@@ -8184,7 +8185,7 @@ const VendorInbox = props => {
   const [vendors, setVendors] = useState([]);
   const [drivers, setDrivers] = useState([]);
   const queryClient = useQueryClient();
-  const [address, setAddress] = useState();
+  const [toast, setToast] = useState(null);
   const {
     data: vendorData,
     isLoading: isVendorLoading,
@@ -8450,12 +8451,51 @@ const VendorInbox = props => {
   }, {
     enabled: (vendorIds === null || vendorIds === void 0 ? void 0 : vendorIds.length) > 0
   });
+  const {
+    data: allFillingPointsData
+  } = Digit.Hooks.wt.useFillPointSearch({
+    tenantId,
+    filters: {
+      limit: 1000
+    }
+  }, {
+    enabled: true
+  });
+  const allFillingPoints = (allFillingPointsData === null || allFillingPointsData === void 0 ? void 0 : allFillingPointsData.fillingPoints) || [];
+  const {
+    mutate: mapFixedFilling
+  } = Digit.Hooks.wt.useVendorFillingMap(tenantId);
+  const onFillingPointSelect = (row, value) => {
+    const payload = {
+      mappings: [{
+        tenantId: tenantId,
+        fillingPointId: (value === null || value === void 0 ? void 0 : value.id) || (value === null || value === void 0 ? void 0 : value.bookingId) || (value === null || value === void 0 ? void 0 : value.fillingPointId),
+        vendorId: row.original.id
+      }]
+    };
+    mapFixedFilling(payload, {
+      onSuccess: () => {
+        setToast({
+          label: t("WT_FIXED_FILLING_MAPPING_SUCCESS")
+        });
+        setTimeout(closeToast, 5000);
+      },
+      onError: err => {
+        var _err$response, _err$response$data, _err$response$data$Er, _err$response$data$Er2;
+        setToast({
+          label: (err === null || err === void 0 ? void 0 : (_err$response = err.response) === null || _err$response === void 0 ? void 0 : (_err$response$data = _err$response.data) === null || _err$response$data === void 0 ? void 0 : (_err$response$data$Er = _err$response$data.Errors) === null || _err$response$data$Er === void 0 ? void 0 : (_err$response$data$Er2 = _err$response$data$Er[0]) === null || _err$response$data$Er2 === void 0 ? void 0 : _err$response$data$Er2.message) || t("WT_FIXED_FILLING_MAPPING_FAIL"),
+          error: true
+        });
+        setTimeout(closeToast, 5000);
+      }
+    });
+  };
   const columns = React.useMemo(() => {
     switch (props.selectedTab) {
       case "VENDOR":
         return [{
           Header: t("ES_VENDOR_INBOX_VENDOR_NAME"),
-          disableSortBy: true,
+          accessor: "name",
           Cell: ({
             row
           }) => {
@@ -8463,7 +8503,7 @@ const VendorInbox = props => {
               className: "link"
             }, /*#__PURE__*/React.createElement(Link, {
               to: "/digit-ui/employee/vendor/registry/vendor-details/" + row.original["id"]
-            }, /*#__PURE__*/React.createElement("div", null, row.original.name, /*#__PURE__*/React.createElement("br", null)))));
+            }, /*#__PURE__*/React.createElement("div", null, row.original.name))));
           }
         }, {
           Header: t("ES_VENDOR_INBOX_DATE_VENDOR_CREATION"),
@@ -8474,13 +8514,52 @@ const VendorInbox = props => {
             var _row$original, _row$original$auditDe, _row$original2, _row$original2$auditD;
             return GetCell((_row$original = row.original) !== null && _row$original !== void 0 && (_row$original$auditDe = _row$original.auditDetails) !== null && _row$original$auditDe !== void 0 && _row$original$auditDe.createdTime ? Digit.DateUtils.ConvertEpochToDate((_row$original2 = row.original) === null || _row$original2 === void 0 ? void 0 : (_row$original2$auditD = _row$original2.auditDetails) === null || _row$original2$auditD === void 0 ? void 0 : _row$original2$auditD.createdTime) : "");
           }
+        }, {
+          Header: t("WT_FILLING_POINT"),
+          accessor: row => {
+            var _row$fillingpointmeta;
+            return (row === null || row === void 0 ? void 0 : row.fillingPointId) || (row === null || row === void 0 ? void 0 : (_row$fillingpointmeta = row.fillingpointmetadata) === null || _row$fillingpointmeta === void 0 ? void 0 : _row$fillingpointmeta.fillingPointId) || (row === null || row === void 0 ? void 0 : row.filling_pt_name) || (row === null || row === void 0 ? void 0 : row.fillingPoint) || "NA";
+          },
+          id: "fillingPoint",
+          Cell: ({
+            row
+          }) => {
+            return /*#__PURE__*/React.createElement(Dropdown$2, {
+              className: "fsm-registry-dropdown",
+              selected: allFillingPoints === null || allFillingPoints === void 0 ? void 0 : allFillingPoints.find(fp => {
+                var _fp$fillingpointmetad, _row$original$filling, _row$original$filling2, _row$original$filling3;
+                const fpId = String(fp.id || fp.bookingId || fp.fillingPointId || fp.uuid || ((_fp$fillingpointmetad = fp.fillingpointmetadata) === null || _fp$fillingpointmetad === void 0 ? void 0 : _fp$fillingpointmetad.fillingPointId));
+                const rowFpId = String(row.original.fillingPointId || ((_row$original$filling = row.original.fillingpointmetadata) === null || _row$original$filling === void 0 ? void 0 : _row$original$filling.fillingPointId) || row.original.filling_pt_name || row.original.fillingPoint || ((_row$original$filling2 = row.original.fillingPointDetail) === null || _row$original$filling2 === void 0 ? void 0 : _row$original$filling2.id) || ((_row$original$filling3 = row.original.fillingPointDetail) === null || _row$original$filling3 === void 0 ? void 0 : _row$original$filling3.bookingId));
+                return fpId === rowFpId && rowFpId !== "undefined" && rowFpId !== "null";
+              }),
+              option: allFillingPoints,
+              select: value => onFillingPointSelect(row, value),
+              style: {
+                textAlign: "left"
+              },
+              optionKey: "fillingPointName",
+              t: t
+            });
+          }
         }, {
           Header: t("ES_VENDOR_INBOX_SERVICE_TYPE"),
-          disableSortBy: true,
+          id: "serviceType",
+          accessor: row => {
+            var _row$dsoDetails, _additionalDetails;
+            let additionalDetails = (_row$dsoDetails = row.dsoDetails) === null || _row$dsoDetails === void 0 ? void 0 : _row$dsoDetails.additionalDetails;
+            if (typeof additionalDetails === "string") {
+              try {
+                additionalDetails = JSON.parse(additionalDetails);
+              } catch (error) {
+                additionalDetails = {};
+              }
+            }
+            return ((_additionalDetails = additionalDetails) === null || _additionalDetails === void 0 ? void 0 : _additionalDetails.serviceType) || "N/A";
+          },
           Cell: ({
             row
           }) => {
-            var _row$original$dsoDeta, _additionalDetails;
+            var _row$original$dsoDeta, _additionalDetails2;
             let additionalDetails = (_row$original$dsoDeta = row.original.dsoDetails) === null || _row$original$dsoDeta === void 0 ? void 0 : _row$original$dsoDeta.additionalDetails;
             if (typeof additionalDetails === "string") {
               try {
@@ -8490,12 +8569,16 @@ const VendorInbox = props => {
                 additionalDetails = {};
               }
             }
-            const serviceType = ((_additionalDetails = additionalDetails) === null || _additionalDetails === void 0 ? void 0 : _additionalDetails.serviceType) || "N/A";
+            const serviceType = ((_additionalDetails2 = additionalDetails) === null || _additionalDetails2 === void 0 ? void 0 : _additionalDetails2.serviceType) || "N/A";
             return /*#__PURE__*/React.createElement("div", null, serviceType);
           }
         }, {
           Header: t("ES_VENDOR_REGISTRY_INBOX_ENABLED"),
-          disableSortBy: true,
+          id: "status",
+          accessor: row => {
+            var _row$dsoDetails2;
+            return ((_row$dsoDetails2 = row.dsoDetails) === null || _row$dsoDetails2 === void 0 ? void 0 : _row$dsoDetails2.status) || "";
+          },
           Cell: ({
             row
           }) => {
@@ -8539,7 +8622,7 @@ const VendorInbox = props => {
       case "VEHICLE":
         return [{
           Header: t("ES_FSM_REGISTRY_INBOX_VEHICLE_NAME"),
-          disableSortBy: true,
+          accessor: "registrationNumber",
           Cell: ({
             row
           }) => {
@@ -8547,7 +8630,7 @@ const VendorInbox = props => {
               className: "link"
             }, /*#__PURE__*/React.createElement(Link, {
               to: "/digit-ui/employee/vendor/registry/vehicle-details/" + row.original["registrationNumber"]
-            }, /*#__PURE__*/React.createElement("div", null, row.original.registrationNumber, /*#__PURE__*/React.createElement("br", null)))));
+            }, /*#__PURE__*/React.createElement("div", null, row.original.registrationNumber))));
           }
         }, {
           Header: t("ES_FSM_REGISTRY_INBOX_DATE_VEHICLE_CREATION"),
@@ -8560,7 +8643,11 @@ const VendorInbox = props => {
           }
         }, {
           Header: t("ES_FSM_REGISTRY_INBOX_VENDOR_NAME"),
-          disableSortBy: true,
+          id: "vendorName",
+          accessor: row => {
+            var _row$vendor;
+            return ((_row$vendor = row.vendor) === null || _row$vendor === void 0 ? void 0 : _row$vendor.name) || "NA";
+          },
           Cell: ({
             row
           }) => {
@@ -8569,11 +8656,23 @@ const VendorInbox = props => {
           }
         }, {
           Header: t("ES_VENDOR_INBOX_SERVICE_TYPE"),
-          disableSortBy: true,
+          id: "serviceType",
+          accessor: row => {
+            var _additionalDetail;
+            let additionalDetail = row.additionalDetails;
+            if (typeof additionalDetail === "string") {
+              try {
+                additionalDetail = JSON.parse(additionalDetail);
+              } catch (error) {
+                additionalDetail = {};
+              }
+            }
+            return ((_additionalDetail = additionalDetail) === null || _additionalDetail === void 0 ? void 0 : _additionalDetail.serviceType) || "N/A";
+          },
           Cell: ({
             row
           }) => {
-            var _additionalDetail;
+            var _additionalDetail2;
             let additionalDetail = row.original.additionalDetails;
             if (typeof additionalDetail === "string") {
               try {
@@ -8583,11 +8682,16 @@ const VendorInbox = props => {
                 additionalDetail = {};
               }
             }
-            const serviceType = ((_additionalDetail = additionalDetail) === null || _additionalDetail === void 0 ? void 0 : _additionalDetail.serviceType) || "N/A";
+            const serviceType = ((_additionalDetail2 = additionalDetail) === null || _additionalDetail2 === void 0 ? void 0 : _additionalDetail2.serviceType) || "N/A";
             return /*#__PURE__*/React.createElement("div", null, serviceType);
           }
         }, {
           Header: t("ES_FSM_REGISTRY_SELECT_DRIVER"),
+          id: "driver",
+          accessor: row => {
+            var _row$driverData, _row$driver;
+            return ((_row$driverData = row.driverData) === null || _row$driverData === void 0 ? void 0 : _row$driverData.name) || ((_row$driver = row.driver) === null || _row$driver === void 0 ? void 0 : _row$driver.name) || "NA";
+          },
           Cell: ({
             row
           }) => {
@@ -8608,7 +8712,8 @@ const VendorInbox = props => {
           }
         }, {
           Header: t("ES_FSM_REGISTRY_INBOX_ENABLED"),
-          disableSortBy: true,
+          id: "status",
+          accessor: row => row.status || "",
           Cell: ({
             row
           }) => {
@@ -8627,7 +8732,11 @@ const VendorInbox = props => {
       case "DRIVER":
         return [{
           Header: t("ES_FSM_REGISTRY_INBOX_USERNAME"),
-          disableSortBy: true,
+          id: "userName",
+          accessor: row => {
+            var _row$owner;
+            return ((_row$owner = row.owner) === null || _row$owner === void 0 ? void 0 : _row$owner.userName) || "NA";
+          },
           Cell: ({
             row
           }) => {
@@ -8636,12 +8745,11 @@ const VendorInbox = props => {
               className: "link"
             }, /*#__PURE__*/React.createElement(Link, {
               to: "/digit-ui/employee/vendor/registry/driver-details/" + row.original["id"]
-            }, /*#__PURE__*/React.createElement("div", null, ((_row$original$owner = row.original.owner) === null || _row$original$owner === void 0 ? void 0 : _row$original$owner.userName) || "NA", /*#__PURE__*/React.createElement("br", null)))));
+            }, /*#__PURE__*/React.createElement("div", null, ((_row$original$owner = row.original.owner) === null || _row$original$owner === void 0 ? void 0 : _row$original$owner.userName) || "NA"))));
           }
         }, {
           Header: t("ES_FSM_REGISTRY_INBOX_DRIVER_NAME"),
-          disableSortBy: true,
-          accessor: "tripDetails",
+          accessor: "name",
           Cell: ({
             row
           }) => {
@@ -8649,7 +8757,7 @@ const VendorInbox = props => {
               className: "link"
             }, /*#__PURE__*/React.createElement(Link, {
               to: "/digit-ui/employee/vendor/registry/driver-details/" + row.original["id"]
-            }, /*#__PURE__*/React.createElement("div", null, row.original.name, /*#__PURE__*/React.createElement("br", null)))));
+            }, /*#__PURE__*/React.createElement("div", null, row.original.name))));
           }
         }, {
           Header: t("ES_FSM_REGISTRY_INBOX_DATE_DRIVER_CREATION"),
@@ -8662,6 +8770,11 @@ const VendorInbox = props => {
           }
         }, {
           Header: t("ES_FSM_REGISTRY_INBOX_VENDOR_NAME"),
+          id: "vendorName",
+          accessor: row => {
+            var _row$vendorData, _row$vendor2;
+            return ((_row$vendorData = row.vendorData) === null || _row$vendorData === void 0 ? void 0 : _row$vendorData.name) || ((_row$vendor2 = row.vendor) === null || _row$vendor2 === void 0 ? void 0 : _row$vendor2.name) || "NA";
+          },
           Cell: ({
             row
           }) => {
@@ -8682,7 +8795,8 @@ const VendorInbox = props => {
           }
         }, {
           Header: t("ES_FSM_REGISTRY_INBOX_ENABLED"),
-          disableSortBy: true,
+          id: "status",
+          accessor: row => row.status || "",
           Cell: ({
             row
           }) => {
@@ -8749,9 +8863,8 @@ const VendorInbox = props => {
       getCellProps: cellInfo => {
         return {
           style: {
-            minWidth: cellInfo.column.Header === t("ES_INBOX_APPLICATION_NO") ? "240px" : "",
-            padding: cellInfo.column.Header === t("ES_FSM_REGISTRY_INBOX_VENDOR_NAME") ? "10px 18px" : "20px 18px",
-            fontSize: "16px"
+            padding: "8px 12px",
+            fontSize: "13.5px"
           }
         };
       },
@@ -9105,7 +9218,7 @@ const SelectServiceType = ({
     return /*#__PURE__*/React.createElement(Loader, null);
   }
   if (userType === "employee") {
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Dropdown$2, {
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CardLabel, null, t(config.label)), /*#__PURE__*/React.createElement(Dropdown$2, {
       className: "payment-form-text-input-correction",
       isMandatory: config.isMandatory,
       selected: serviceTypes,
@@ -9872,24 +9985,26 @@ const VehicleConfig = (t, disabled = false) => {
           title: t("ES_FSM_VEHICLE_FORMAT_TIP")
         },
         error: t("FSM_REGISTRY_INVALID_REGISTRATION_NUMBER"),
-        defaultValue: "",
-        className: "payment-form-text-input-correction"
+        defaultValue: ""
       }
     }, {
       label: "ES_VENDOR_REGISTRY_SERVICE_TYPE",
       isMandatory: true,
       type: "component",
-      route: "select-service",
-      hideInEmployee: false,
-      key: "additionalDetails",
+      key: "serviceType",
       component: "SelectServiceType",
       disable: disabled,
+      populators: {
+        name: "serviceType",
+        defaultValue: {
+          code: "WT",
+          name: "WT",
+          i18nKey: "WT"
+        }
+      },
       texts: {
-        headerCaption: "",
-        header: "CS_COMMON_CHOOSE_SERVICE",
-        cardText: "CS_COMMON_SELECT_SERVICE",
-        submitBarLabel: "CS_COMMON_NEXT",
-        skipText: "CORE_COMMON_SKIP_CONTINUE"
+        header: "CS_COMMON_CHOOSE_SERVICE_TYPE",
+        submitBarLabel: "CS_COMMON_NEXT"
       }
     }, {
       route: "vehicle",
@@ -9970,8 +10085,7 @@ const VehicleConfig = (t, disabled = false) => {
           pattern: /^[A-Za-z]/
         },
         error: t("FSM_REGISTRY_INVALID_NAME"),
-        defaultValue: "",
-        className: "payment-form-text-input-correction"
+        defaultValue: ""
       }
     }, {
       label: "ES_FSM_REGISTRY_NEW_VEHICLE_OWNER_PHONE",
@@ -9986,12 +10100,7 @@ const VehicleConfig = (t, disabled = false) => {
           pattern: /^[6-9]\d{9}$/
         },
         error: t("FSM_REGISTRY_INVALID_PHONE"),
-        defaultValue: "",
-        className: "payment-form-text-input-correction",
-        labelStyle: {
-          border: "1px solid black",
-          borderRight: "none"
-        }
+        defaultValue: ""
       }
     }, {
       label: "ES_FSM_REGISTRY_NEW_GENDER",
@@ -10030,8 +10139,7 @@ const VehicleConfig = (t, disabled = false) => {
           pattern: /^[a-zA-Z0-9+_.-]+@[a-zA-Z0-9.-]+\.[a-zA-Z0-9.-]+$/
         },
         error: t("FSM_REGISTRY_INVALID_EMAIL"),
-        defaultValue: "",
-        className: "payment-form-text-input-correction"
+        defaultValue: ""
       }
     }]
   }];
@@ -10087,6 +10195,11 @@ const AddVehicle = ({
   });
   const [canSubmit, setSubmitValve] = useState(false);
   const defaultValues = {
+    serviceType: {
+      code: "WT",
+      name: "WT",
+      i18nKey: "WT"
+    },
     tripData: {
       noOfTrips: 1,
       amountPerTrip: null,
@@ -10114,7 +10227,7 @@ const AddVehicle = ({
     setShowToast(null);
   };
   const onSubmit = data => {
-    var _data$vehicle, _data$vehicle$type, _data$vehicle2, _data$vehicle2$modal, _data$vehicle3, _data$vehicle3$type, _data$additionalDetai, _data$selectGender;
+    var _data$vehicle, _data$vehicle$type, _data$vehicle2, _data$vehicle2$modal, _data$vehicle3, _data$vehicle3$type, _data$serviceType, _data$selectGender;
     const registrationNumber = data === null || data === void 0 ? void 0 : data.registrationNumber;
     const vehicleType = data === null || data === void 0 ? void 0 : (_data$vehicle = data.vehicle) === null || _data$vehicle === void 0 ? void 0 : (_data$vehicle$type = _data$vehicle.type) === null || _data$vehicle$type === void 0 ? void 0 : _data$vehicle$type.code;
     const vehicleModal = data === null || data === void 0 ? void 0 : (_data$vehicle2 = data.vehicle) === null || _data$vehicle2 === void 0 ? void 0 : (_data$vehicle2$modal = _data$vehicle2.modal) === null || _data$vehicle2$modal === void 0 ? void 0 : _data$vehicle2$modal.code;
@@ -10125,7 +10238,7 @@ const AddVehicle = ({
     const fitnessValidity = new Date(`${data === null || data === void 0 ? void 0 : data.fitnessValidity}`).getTime();
     const ownerName = data === null || data === void 0 ? void 0 : data.ownerName;
     const phone = data === null || data === void 0 ? void 0 : data.phone;
-    const additionalDetails = data === null || data === void 0 ? void 0 : (_data$additionalDetai = data.additionalDetails) === null || _data$additionalDetai === void 0 ? void 0 : _data$additionalDetai.code;
+    const additionalDetails = data === null || data === void 0 ? void 0 : (_data$serviceType = data.serviceType) === null || _data$serviceType === void 0 ? void 0 : _data$serviceType.code;
     const gender = data === null || data === void 0 ? void 0 : (_data$selectGender = data.selectGender) === null || _data$selectGender === void 0 ? void 0 : _data$selectGender.code;
     const emailId = data === null || data === void 0 ? void 0 : data.emailId;
     const dob = new Date(`${data.dob}`).getTime() || new Date(`1/1/1970`).getTime();
@@ -10355,7 +10468,6 @@ const VENDORCreate = ({
   const onSuccess = () => {
     clearParams();
     queryClient.invalidateQueries("VENDOR_CREATE");
-    queryClient.invalidateQueries("EMP_VENDOR_COMMON_SEARCH");
   };
   let commonFields = createConfig;
   commonFields.forEach(obj => {
@@ -10703,18 +10815,16 @@ const CloseBtn$1 = props => {
 const DriverDetails = props => {
   var _driverData$5, _driverData$5$employe;
   const tenantId = Digit.ULBService.getCurrentTenantId();
-  const state = Digit.ULBService.getStateId();
   const {
     t
   } = useTranslation();
   const history = useHistory();
   const queryClient = useQueryClient();
-  let {
+  const {
     id: dsoId
   } = useParams();
   const [displayMenu, setDisplayMenu] = useState(false);
   const [selectedAction, setSelectedAction] = useState(null);
-  const [config, setCurrentConfig] = useState({});
   const [showModal, setShowModal] = useState(false);
   const [showToast, setShowToast] = useState(null);
   const [vendors, setVendors] = useState([]);
@@ -10987,14 +11097,8 @@ const DriverDetails = props => {
   if (isLoading) {
     return /*#__PURE__*/React.createElement(Loader, null);
   }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, !isLoading ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
-    style: {
-      marginBottom: "16px"
-    }
-  }, t("ES_FSM_REGISTRY_DRIVER_DETAILS")), /*#__PURE__*/React.createElement("div", {
-    style: !isMobile ? {
-      marginLeft: "-15px"
-    } : {}
+  return !isLoading ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "employee-form-content"
   }, /*#__PURE__*/React.createElement(Card, {
     style: {
       position: "relative"
@@ -11010,7 +11114,9 @@ const DriverDetails = props => {
       }
     }, t(detail.title)), /*#__PURE__*/React.createElement(StatusTable, null, detail === null || detail === void 0 ? void 0 : (_detail$values = detail.values) === null || _detail$values === void 0 ? void 0 : _detail$values.map((value, index) => {
       var _detail$values2, _detail$values3;
-      return (value === null || value === void 0 ? void 0 : value.type) === "custom" ? /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
+      return (value === null || value === void 0 ? void 0 : value.type) === "custom" ? /*#__PURE__*/React.createElement(React.Fragment, {
+        key: index
+      }, /*#__PURE__*/React.createElement("div", {
         className: `${index === (detail === null || detail === void 0 ? void 0 : (_detail$values2 = detail.values) === null || _detail$values2 === void 0 ? void 0 : _detail$values2.length) - 1 ? "row last" : "row"} border-none`
       }, /*#__PURE__*/React.createElement("h2", null, t(value.title)), /*#__PURE__*/React.createElement("div", {
         className: "value",
@@ -11085,7 +11191,7 @@ const DriverDetails = props => {
   }) : null, /*#__PURE__*/React.createElement(SubmitBar, {
     label: t("ES_COMMON_TAKE_ACTION"),
     onSubmit: () => setDisplayMenu(!displayMenu)
-  }))) : /*#__PURE__*/React.createElement(Loader, null));
+  }))) : /*#__PURE__*/React.createElement(Loader, null);
 };
 
 const Heading$2 = props => {
@@ -11367,7 +11473,7 @@ const VehicleDetails = props => {
       });
     }
     if (selectedAction === "ADD_VENDOR") {
-      return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(CardText, null, t(`ES_FSM_REGISTRY_SELECT_VENODOR`)), /*#__PURE__*/React.createElement(Dropdown$2, {
+      return /*#__PURE__*/React.createElement(Fragment$1, null, /*#__PURE__*/React.createElement(CardText, null, t(`ES_FSM_REGISTRY_SELECT_VENODOR`)), /*#__PURE__*/React.createElement(Dropdown$2, {
         t: t,
         option: vendors,
         value: selectedOption,
@@ -11377,7 +11483,7 @@ const VehicleDetails = props => {
       }));
     }
     if (selectedAction === "EDIT_VENDOR") {
-      return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(CardText, null, t(`ES_FSM_REGISTRY_SELECT_VENODOR`)), /*#__PURE__*/React.createElement(Dropdown$2, {
+      return /*#__PURE__*/React.createElement(Fragment$1, null, /*#__PURE__*/React.createElement(CardText, null, t(`ES_FSM_REGISTRY_SELECT_VENODOR`)), /*#__PURE__*/React.createElement(Dropdown$2, {
         t: t,
         option: vendors,
         value: selectedOption,
@@ -11387,7 +11493,6 @@ const VehicleDetails = props => {
       }));
     }
   };
-  const isMobile = window.Digit.Utils.browser.isMobile();
   const modalHeading = () => {
     switch (selectedAction) {
       case "DELETE":
@@ -11402,15 +11507,8 @@ const VehicleDetails = props => {
   if (isLoading) {
     return /*#__PURE__*/React.createElement(Loader, null);
   }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, !isLoading ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
-    style: {
-      marginBottom: "16px"
-    }
-  }, t("ES_FSM_REGISTRY_VEHICLE_DETAILS")), /*#__PURE__*/React.createElement("div", {
-    style: !isMobile ? {
-      marginLeft: "-15px"
-    } : {}
-  }, /*#__PURE__*/React.createElement(Card, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !isLoading ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Card, {
+    className: "vehicle-details-card",
     style: {
       position: "relative"
     }
@@ -11425,7 +11523,7 @@ const VehicleDetails = props => {
       }
     }, t(detail.title)), /*#__PURE__*/React.createElement(StatusTable, null, detail === null || detail === void 0 ? void 0 : (_detail$values = detail.values) === null || _detail$values === void 0 ? void 0 : _detail$values.map((value, index) => {
       var _detail$values2, _detail$values3;
-      return (value === null || value === void 0 ? void 0 : value.type) === "custom" ? /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
+      return (value === null || value === void 0 ? void 0 : value.type) === "custom" ? /*#__PURE__*/React.createElement(Fragment$1, null, /*#__PURE__*/React.createElement("div", {
         className: `${index === (detail === null || detail === void 0 ? void 0 : (_detail$values2 = detail.values) === null || _detail$values2 === void 0 ? void 0 : _detail$values2.length) - 1 ? "row last" : "row"} border-none`
       }, /*#__PURE__*/React.createElement("h2", null, t(value.title)), /*#__PURE__*/React.createElement("div", {
         className: "value",
@@ -11471,7 +11569,7 @@ const VehicleDetails = props => {
         } : {}
       });
     })));
-  }))), showModal && /*#__PURE__*/React.createElement(Modal, {
+  })), showModal && /*#__PURE__*/React.createElement(Modal, {
     headerBarMain: /*#__PURE__*/React.createElement(Heading$2, {
       label: t(modalHeading())
     }),
@@ -11519,7 +11617,6 @@ const SelectVehicleType = ({
     data: vehicleData,
     isLoading: vehicleLoading
   } = Digit.Hooks.wt.useWTMDMS(stateId, "Vehicle", "VehicleMakeModel");
-  console.log("vehicleData", vehicleData);
   const {
     data: serviceTypeData,
     isLoading: serviceLoading
@@ -11597,30 +11694,24 @@ const SelectVehicleType = ({
   if (!vehicleData || !serviceTypeData) {
     return /*#__PURE__*/React.createElement("div", null, t("ERROR_FETCHING_DATA"));
   }
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    className: "card-label-smaller"
-  }, t("ES_FSM_REGISTRY_VEHICLE_MODEL")), /*#__PURE__*/React.createElement(Dropdown$2, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("ES_FSM_REGISTRY_VEHICLE_MODEL")), /*#__PURE__*/React.createElement(Dropdown$2, {
     className: "form-field",
     selected: selectedModal,
     option: modals,
     select: selectModal,
     optionKey: "name",
     t: t
-  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    className: "card-label-smaller"
-  }, t("ES_FSM_REGISTRY_VEHICLE_TYPE")), /*#__PURE__*/React.createElement(Dropdown$2, {
+  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("ES_FSM_REGISTRY_VEHICLE_TYPE")), /*#__PURE__*/React.createElement(Dropdown$2, {
     className: "form-field",
     selected: selectedType,
     option: types,
     select: selectType,
     optionKey: "name",
     t: t
-  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, {
-    className: "card-label-smaller"
-  }, t("ES_FSM_REGISTRY_VEHICLE_CAPACITY")), /*#__PURE__*/React.createElement(TextInput, {
+  })), /*#__PURE__*/React.createElement(LabelFieldPair, null, /*#__PURE__*/React.createElement(CardLabel, null, t("ES_FSM_REGISTRY_VEHICLE_CAPACITY")), /*#__PURE__*/React.createElement(TextInput, {
     className: "",
     textInputStyle: {
-      width: "50%"
+      width: "100%"
     },
     value: selectedCapacity,
     disable: true