feature/IO-3255-simplified-parts-management - Checkpoint

client/src/components/vehicles-list/vehicles-list.component.jsx

@@ -1,14 +1,14 @@
 import { SyncOutlined } from "@ant-design/icons";
 import { Button, Card, Input, Space, Table, Typography } from "antd";
 import queryString from "query-string";
-import React, { useState } from "react";
+import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link, useLocation, useNavigate } from "react-router-dom";
 import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
 import { pageLimit } from "../../utils/config";
 import { alphaSort } from "../../utils/sorters";
 
-export default function VehiclesListComponent({ loading, vehicles, total, refetch }) {
+export default function VehiclesListComponent({ loading, vehicles, total, refetch, basePath = "/manage" }) {
   const search = queryString.parse(useLocation().search);
   const {
     page
@@ -31,7 +31,7 @@ export default function VehiclesListComponent({ loading, vehicles, total, refetc
       sorter: (a, b) => alphaSort(a.v_vin, b.v_vin),
       sortOrder: state.sortedInfo.columnKey === "v_vin" && state.sortedInfo.order,
       render: (text, record) => (
-        <Link to={"/manage/vehicles/" + record.id}>
+        <Link to={`${basePath}/vehicles/${record.id}`}>
           <VehicleVinDisplay>{record.v_vin || "N/A"}</VehicleVinDisplay>
         </Link>
       )

client/src/components/vehicles-list/vehicles-list.container.jsx

@@ -1,4 +1,3 @@
-import React from "react";
 import VehiclesListComponent from "./vehicles-list.component";
 import { useQuery } from "@apollo/client";
 import AlertComponent from "../alert/alert.component";
@@ -6,10 +5,18 @@ import { QUERY_ALL_VEHICLES_PAGINATED } from "../../graphql/vehicles.queries";
 import queryString from "query-string";
 import { useLocation } from "react-router-dom";
 import { pageLimit } from "../../utils/config";
+import { connect } from "react-redux";
+import { selectIsPartsEntry } from "../../redux/application/application.selectors";
+import { createStructuredSelector } from "reselect";
 
-export default function VehiclesListContainer() {
+const mapStateToProps = createStructuredSelector({
+  isPartsEntry: selectIsPartsEntry
+});
+
+export function VehiclesListContainer({ isPartsEntry }) {
   const searchParams = queryString.parse(useLocation().search);
   const { page, sortcolumn, sortorder, search } = searchParams;
+  const basePath = isPartsEntry ? "/parts" : "/manage";
 
   const { loading, error, data, refetch } = useQuery(QUERY_ALL_VEHICLES_PAGINATED, {
     variables: {
@@ -33,6 +40,9 @@ export default function VehiclesListContainer() {
       vehicles={data ? data.search_vehicles : null}
       total={data ? data.search_vehicles_aggregate.aggregate.count : 0}
       refetch={refetch}
+      basePath={basePath}
     />
   );
 }
+
+export default connect(mapStateToProps)(VehiclesListContainer);