diff --git a/client/src/components/tech-login/tech-login.component.jsx b/client/src/components/tech-login/tech-login.component.jsx
index 502b20cbf..eec9775b4 100644
--- a/client/src/components/tech-login/tech-login.component.jsx
+++ b/client/src/components/tech-login/tech-login.component.jsx
@@ -11,7 +11,7 @@ import {
} from "../../redux/tech/tech.selectors";
import AlertComponent from "../alert/alert.component";
import "./tech-login.styles.scss";
-import { Redirect } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
const mapStateToProps = createStructuredSelector({
technician: selectTechnician,
@@ -30,14 +30,16 @@ export function TechLogin({
techLoginStart,
}) {
const { t } = useTranslation();
+ const navigate = useNavigate();
const handleFinish = (values) => {
techLoginStart(values);
};
+ if (technician) return navigate("/tech/joblookup");
+
return (
- {technician ?
: null}
;
diff --git a/client/src/components/ticket-tickets-dates-selector/time-tickets-dates-selector.component.jsx b/client/src/components/ticket-tickets-dates-selector/time-tickets-dates-selector.component.jsx
index a827e3fd7..3c6792aaf 100644
--- a/client/src/components/ticket-tickets-dates-selector/time-tickets-dates-selector.component.jsx
+++ b/client/src/components/ticket-tickets-dates-selector/time-tickets-dates-selector.component.jsx
@@ -3,12 +3,12 @@ import { DatePicker } from "antd";
import moment from "moment";
import queryString from "query-string";
import React from "react";
-import { useHistory, useLocation } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
export default function TimeTicketsDatesSelector() {
const searchParams = queryString.parse(useLocation().search);
const { start, end } = searchParams;
- const history = useHistory();
+ const history = useNavigate();
const handleChange = (dates) => {
if (dates) {
diff --git a/client/src/components/vehicle-detail-form/vehicle-detail-form.container.jsx b/client/src/components/vehicle-detail-form/vehicle-detail-form.container.jsx
index 9fbe45ed7..38406e515 100644
--- a/client/src/components/vehicle-detail-form/vehicle-detail-form.container.jsx
+++ b/client/src/components/vehicle-detail-form/vehicle-detail-form.container.jsx
@@ -5,7 +5,7 @@ import VehicleDetailFormComponent from "./vehicle-detail-form.component";
import { useTranslation } from "react-i18next";
import moment from "moment";
import { DELETE_VEHICLE, UPDATE_VEHICLE } from "../../graphql/vehicles.queries";
-import { useHistory } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
function VehicleDetailFormContainer({ vehicle, refetch }) {
const { t } = useTranslation();
@@ -13,7 +13,7 @@ function VehicleDetailFormContainer({ vehicle, refetch }) {
const [deleteVehicle] = useMutation(DELETE_VEHICLE);
const [form] = Form.useForm();
const [loading, setLoading] = useState(false);
- const history = useHistory();
+ const history = useNavigate();
const handleDelete = async () => {
setLoading(true);
diff --git a/client/src/components/vehicles-list/vehicles-list.component.jsx b/client/src/components/vehicles-list/vehicles-list.component.jsx
index bb1a97183..38e68655b 100644
--- a/client/src/components/vehicles-list/vehicles-list.component.jsx
+++ b/client/src/components/vehicles-list/vehicles-list.component.jsx
@@ -3,7 +3,7 @@ import { Button, Card, Input, Space, Table, Typography } from "antd";
import queryString from "query-string";
import React, { useState } from "react";
import { useTranslation } from "react-i18next";
-import { Link, useHistory, useLocation } from "react-router-dom";
+import { Link, useNavigate, useLocation } from "react-router-dom";
import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
import {pageLimit} from "../../utils/config";
export default function VehiclesListComponent({
@@ -17,7 +17,7 @@ export default function VehiclesListComponent({
page,
//sortcolumn, sortorder,
} = search;
- const history = useHistory();
+ const history = useNavigate();
const [state, setState] = useState({
sortedInfo: {},
diff --git a/client/src/components/vendors-form/vendors-form.container.jsx b/client/src/components/vendors-form/vendors-form.container.jsx
index af9257bf2..3f92c717d 100644
--- a/client/src/components/vendors-form/vendors-form.container.jsx
+++ b/client/src/components/vendors-form/vendors-form.container.jsx
@@ -4,7 +4,7 @@ import queryString from "query-string";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { useHistory, useLocation } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import {
DELETE_VENDOR,
@@ -22,7 +22,7 @@ const mapStateToProps = createStructuredSelector({
});
function VendorsFormContainer({ refetch, bodyshop }) {
- const history = useHistory();
+ const history = useNavigate();
const search = queryString.parse(useLocation().search);
const { selectedvendor } = search;
const [formLoading, setFormLoading] = useState(false);
diff --git a/client/src/components/vendors-list/vendors-list.container.jsx b/client/src/components/vendors-list/vendors-list.container.jsx
index 11cfa919e..5bf201790 100644
--- a/client/src/components/vendors-list/vendors-list.container.jsx
+++ b/client/src/components/vendors-list/vendors-list.container.jsx
@@ -1,7 +1,7 @@
import { useQuery } from "@apollo/client";
import queryString from "query-string";
import React from "react";
-import { useHistory, useLocation } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
import AlertComponent from "../../components/alert/alert.component";
import { QUERY_ALL_VENDORS } from "../../graphql/vendors.queries";
import VendorsListComponent from "./vendors-list.component";
@@ -12,7 +12,7 @@ export default function VendorsListContainer() {
nextFetchPolicy: "network-only",
});
const search = queryString.parse(useLocation().search);
- const history = useHistory();
+ const history = useNavigate();
const handleNewVendor = () => {
search.selectedvendor = "new";
diff --git a/client/src/pages/bills/bills.page.component.jsx b/client/src/pages/bills/bills.page.component.jsx
index 169a94a5e..b3854c423 100644
--- a/client/src/pages/bills/bills.page.component.jsx
+++ b/client/src/pages/bills/bills.page.component.jsx
@@ -5,7 +5,7 @@ import queryString from "query-string";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { Link, useHistory, useLocation } from "react-router-dom";
+import { Link, useNavigate, useLocation } from "react-router-dom";
import BillDeleteButton from "../../components/bill-delete-button/bill-delete-button.component";
import PartsOrderModalContainer from "../../components/parts-order-modal/parts-order-modal.container";
import PrintWrapperComponent from "../../components/print-wrapper/print-wrapper.component";
@@ -35,7 +35,7 @@ export function BillsListPage({
const [openSearchResults, setOpenSearchResults] = useState([]);
const [searchLoading, setSearchLoading] = useState(false);
const { page } = search;
- const history = useHistory();
+ const history = useNavigate();
const [state, setState] = useState({
sortedInfo: {},
filteredInfo: { text: "" },
diff --git a/client/src/pages/contract-create/contract-create.page.container.jsx b/client/src/pages/contract-create/contract-create.page.container.jsx
index 7ab35f1c5..8eae1e43b 100644
--- a/client/src/pages/contract-create/contract-create.page.container.jsx
+++ b/client/src/pages/contract-create/contract-create.page.container.jsx
@@ -3,7 +3,7 @@ import { Form, notification } from "antd";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { useHistory, useLocation } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
import { INSERT_NEW_CONTRACT } from "../../graphql/cccontracts.queries";
@@ -30,7 +30,7 @@ export function ContractCreatePageContainer({
}) {
const [form] = Form.useForm();
const { t } = useTranslation();
- const history = useHistory();
+ const history = useNavigate();
const location = useLocation();
const [loading, setLoading] = useState(false);
const selectedCarState = useState(null);
diff --git a/client/src/pages/courtesy-car-create/courtesy-car-create.page.container.jsx b/client/src/pages/courtesy-car-create/courtesy-car-create.page.container.jsx
index f373e4066..5079c65d6 100644
--- a/client/src/pages/courtesy-car-create/courtesy-car-create.page.container.jsx
+++ b/client/src/pages/courtesy-car-create/courtesy-car-create.page.container.jsx
@@ -3,7 +3,7 @@ import { Form, notification } from "antd";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { useHistory } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import CourtesyCarFormComponent from "../../components/courtesy-car-form/courtesy-car-form.component";
import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
@@ -30,7 +30,7 @@ export function CourtesyCarCreateContainer({
const [loading, setLoading] = useState(false);
const [insertCourtesyCar] = useMutation(INSERT_NEW_COURTESY_CAR);
const { t } = useTranslation();
- const history = useHistory();
+ const history = useNavigate();
const handleFinish = async (values) => {
setLoading(true);
diff --git a/client/src/pages/dms-payables/dms-payables.container.jsx b/client/src/pages/dms-payables/dms-payables.container.jsx
index de3bd2f17..4349c49c5 100644
--- a/client/src/pages/dms-payables/dms-payables.container.jsx
+++ b/client/src/pages/dms-payables/dms-payables.container.jsx
@@ -2,7 +2,7 @@ import { Button, Card, Col, notification, Row, Select, Space } from "antd";
import React, { useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { useHistory, useLocation } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import SocketIO from "socket.io-client";
import DmsAllocationsSummaryApComponent from "../../components/dms-allocations-summary-ap/dms-allocations-summary-ap.component";
@@ -42,7 +42,7 @@ export const socket = SocketIO(
export function DmsContainer({ bodyshop, setBreadcrumbs, setSelectedHeader }) {
const { t } = useTranslation();
const [logLevel, setLogLevel] = useState("DEBUG");
- const history = useHistory();
+ const history = useNavigate();
const [logs, setLogs] = useState([]);
const { state } = useLocation();
diff --git a/client/src/pages/dms/dms.container.jsx b/client/src/pages/dms/dms.container.jsx
index 77c670e60..ae748c04c 100644
--- a/client/src/pages/dms/dms.container.jsx
+++ b/client/src/pages/dms/dms.container.jsx
@@ -13,7 +13,7 @@ import queryString from "query-string";
import React, { useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { Link, useHistory, useLocation } from "react-router-dom";
+import { Link, useNavigate, useLocation } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import SocketIO from "socket.io-client";
import AlertComponent from "../../components/alert/alert.component";
@@ -60,7 +60,7 @@ export const socket = SocketIO(
export function DmsContainer({ bodyshop, setBreadcrumbs, setSelectedHeader }) {
const { t } = useTranslation();
const [logLevel, setLogLevel] = useState("DEBUG");
- const history = useHistory();
+ const history = useNavigate();
const [logs, setLogs] = useState([]);
const search = queryString.parse(useLocation().search);
const { jobId } = search;
diff --git a/client/src/pages/export-logs/export-logs.page.component.jsx b/client/src/pages/export-logs/export-logs.page.component.jsx
index 7ae8977cf..14c415990 100644
--- a/client/src/pages/export-logs/export-logs.page.component.jsx
+++ b/client/src/pages/export-logs/export-logs.page.component.jsx
@@ -6,7 +6,7 @@ import queryString from "query-string";
import React from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { Link, useHistory, useLocation } from "react-router-dom";
+import { Link, useNavigate, useLocation } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import AlertComponent from "../../components/alert/alert.component";
import { QUERY_EXPORT_LOG_PAGINATED } from "../../graphql/accounting.queries";
@@ -21,7 +21,7 @@ const mapStateToProps = createStructuredSelector({
export function ExportLogsPageComponent({ bodyshop }) {
const searchParams = queryString.parse(useLocation().search);
const { page, sortcolumn, sortorder, search } = searchParams;
- const history = useHistory();
+ const history = useNavigate();
const { loading, error, data, refetch } = useQuery(
QUERY_EXPORT_LOG_PAGINATED,
diff --git a/client/src/pages/jobs-detail/jobs-detail.page.component.jsx b/client/src/pages/jobs-detail/jobs-detail.page.component.jsx
index 001a18166..ebde2e03e 100644
--- a/client/src/pages/jobs-detail/jobs-detail.page.component.jsx
+++ b/client/src/pages/jobs-detail/jobs-detail.page.component.jsx
@@ -24,7 +24,7 @@ import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { FaHardHat, FaRegStickyNote, FaShieldAlt } from "react-icons/fa";
import { connect } from "react-redux";
-import { useHistory, useLocation } from "react-router-dom";
+import {useNavigate, useLocation} from "react-router-dom";
import { createStructuredSelector } from "reselect";
import FormFieldsChanged from "../../components/form-fields-changed-alert/form-fields-changed-alert.component";
import JobAuditTrail from "../../components/job-audit-trail/job-audit-trail.component";
@@ -77,7 +77,7 @@ export function JobsDetailPage({
}) {
const { t } = useTranslation();
const [form] = Form.useForm();
- const history = useHistory();
+ const history = useNavigate();
const [loading, setLoading] = useState(false);
const search = queryString.parse(useLocation().search);
diff --git a/client/src/pages/landing/landing.page.jsx b/client/src/pages/landing/landing.page.jsx
index 9677488e6..a189a5409 100644
--- a/client/src/pages/landing/landing.page.jsx
+++ b/client/src/pages/landing/landing.page.jsx
@@ -1,6 +1,6 @@
import React from "react";
import { connect } from "react-redux";
-import { Redirect } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import { selectCurrentUser } from "../../redux/user/user.selectors";
import LandingPageStatic from "../../landing/index";
@@ -12,7 +12,8 @@ const mapStateToProps = createStructuredSelector({
export default connect(mapStateToProps, null)(LandingPage);
export function LandingPage({ currentUser }) {
- if (currentUser.authorized) return
;
+ const navigate = useNavigate();
+ if (currentUser.authorized) return navigate("/manage");
return
;
//return
;
diff --git a/client/src/pages/manage-root/manage-root.page.component.jsx b/client/src/pages/manage-root/manage-root.page.component.jsx
index 1d15268f2..0b87db1d8 100644
--- a/client/src/pages/manage-root/manage-root.page.component.jsx
+++ b/client/src/pages/manage-root/manage-root.page.component.jsx
@@ -1,10 +1,10 @@
import React from "react";
//import DashboardGridComponent from "../../components/dashboard-grid/dashboard-grid.component";
-import { Redirect } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
export default function ManageRootPageComponent() {
//const client = useApolloClient();
-
- return
;
+ const navigate = useNavigate();
+ return navigate("/manage/jobs");
// return (
//
diff --git a/client/src/pages/manage/manage.page.component.jsx b/client/src/pages/manage/manage.page.component.jsx
index fe1969ee9..c83ebd0e8 100644
--- a/client/src/pages/manage/manage.page.component.jsx
+++ b/client/src/pages/manage/manage.page.component.jsx
@@ -3,7 +3,7 @@ import preval from "preval.macro";
import React, { lazy, Suspense, useEffect } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { Link, Route, Switch } from "react-router-dom";
+import { Link, Route, Routes } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import BreadCrumbs from "../../components/breadcrumbs/breadcrumbs.component";
import ChatAffixContainer from "../../components/chat-affix/chat-affix.container";
@@ -212,7 +212,7 @@ export function Manage({ match, conflict, bodyshop }) {
-
+
-
+
-
+
-
+
({
setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
@@ -31,7 +31,7 @@ export function PhonebookContainer({ setBreadcrumbs, setSelectedHeader }) {
}, [setBreadcrumbs, t, setSelectedHeader]);
const search = queryString.parse(useLocation().search);
const { phonebookentry } = search;
- const history = useHistory();
+ const history = useNavigate();
const selectedBreakpoint = Object.entries(Grid.useBreakpoint())
.filter((screen) => !!screen[1])
diff --git a/client/src/pages/scoreboard/scoreboard.page.container.jsx b/client/src/pages/scoreboard/scoreboard.page.container.jsx
index 1ef4b273f..c181c55df 100644
--- a/client/src/pages/scoreboard/scoreboard.page.container.jsx
+++ b/client/src/pages/scoreboard/scoreboard.page.container.jsx
@@ -5,7 +5,7 @@ import React, { useEffect } from "react";
import { useTranslation } from "react-i18next";
import { FaShieldAlt } from "react-icons/fa";
import { connect } from "react-redux";
-import { useHistory, useLocation } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import FeatureWrapper from "../../components/feature-wrapper/feature-wrapper.component";
import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
@@ -31,7 +31,7 @@ export function ScoreboardContainer({ setBreadcrumbs, setSelectedHeader }) {
const { t } = useTranslation();
const searchParams = queryString.parse(useLocation().search);
const { tab } = searchParams;
- const history = useHistory();
+ const history = useNavigate();
useEffect(() => {
document.title = t("titles.scoreboard");
setSelectedHeader("scoreboard");
diff --git a/client/src/pages/shop-vendor/shop-vendor.page.component.jsx b/client/src/pages/shop-vendor/shop-vendor.page.component.jsx
index 6eb6e2064..dafa7ffbe 100644
--- a/client/src/pages/shop-vendor/shop-vendor.page.component.jsx
+++ b/client/src/pages/shop-vendor/shop-vendor.page.component.jsx
@@ -1,14 +1,14 @@
import { Drawer, Grid } from "antd";
import queryString from "query-string";
import React from "react";
-import { useHistory, useLocation } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
import VendorsFormContainer from "../../components/vendors-form/vendors-form.container";
import VendorsListContainer from "../../components/vendors-list/vendors-list.container";
export default function ShopVendorPageComponent() {
const search = queryString.parse(useLocation().search);
const { selectedvendor } = search;
- const history = useHistory();
+ const history = useNavigate();
const selectedBreakpoint = Object.entries(Grid.useBreakpoint())
.filter((screen) => !!screen[1])
diff --git a/client/src/pages/shop/shop.page.component.jsx b/client/src/pages/shop/shop.page.component.jsx
index de6b267d5..0ce020a54 100644
--- a/client/src/pages/shop/shop.page.component.jsx
+++ b/client/src/pages/shop/shop.page.component.jsx
@@ -1,6 +1,6 @@
import { Tabs } from "antd";
import React, { useEffect } from "react";
-import { useHistory, useLocation } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
import queryString from "query-string";
import { useTranslation } from "react-i18next";
import ShopEmployeesContainer from "../../components/shop-employees/shop-employees.container";
@@ -26,7 +26,7 @@ const mapDispatchToProps = (dispatch) => ({
export function ShopPage({ bodyshop, setSelectedHeader, setBreadcrumbs }) {
const { t } = useTranslation();
- const history = useHistory();
+ const history = useNavigate();
const search = queryString.parse(useLocation().search);
useEffect(() => {
diff --git a/client/src/pages/tech/tech.page.component.jsx b/client/src/pages/tech/tech.page.component.jsx
index 5808ae84c..cdf0d6e1b 100644
--- a/client/src/pages/tech/tech.page.component.jsx
+++ b/client/src/pages/tech/tech.page.component.jsx
@@ -2,7 +2,7 @@ import { BackTop, Layout } from "antd";
import React, { Suspense, lazy, useEffect } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
-import { Redirect, Route, Switch } from "react-router-dom";
+import { useNavigate, Route, Routes } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import ErrorBoundary from "../../components/error-boundary/error-boundary.component";
@@ -50,16 +50,18 @@ const mapDispatchToProps = (dispatch) => ({
export function TechPage({ technician, match }) {
const { t } = useTranslation();
+ const navigate = useNavigate();
useEffect(() => {
document.title = t("titles.app");
}, [t]);
+ if (!technician) return navigate(`${match.path}/login`
+ );
return (
- {technician ? null : }
@@ -74,7 +76,7 @@ export function TechPage({ technician, match }) {
-
+
-
+
diff --git a/client/src/utils/private-route.js b/client/src/utils/private-route.js
index 372dba49b..13b7c837d 100644
--- a/client/src/utils/private-route.js
+++ b/client/src/utils/private-route.js
@@ -1,18 +1,17 @@
import React from "react";
-import { Redirect, Route, useLocation } from "react-router-dom";
+import { useNavigate, Route, useLocation } from "react-router-dom";
function PrivateRoute({ component: Component, isAuthorized, ...rest }) {
const location = useLocation();
+ const navigate = useNavigate();
+ if (!isAuthorized) {
+ navigate(`/signin?redirect=${location.pathname}`);
+ }
return (
- isAuthorized === true ? (
-
- ) : (
-
- )
+ render={(props) =>
}
/>
);
diff --git a/client/src/utils/prompt.js b/client/src/utils/prompt.js
new file mode 100644
index 000000000..718029f73
--- /dev/null
+++ b/client/src/utils/prompt.js
@@ -0,0 +1,18 @@
+import { unstable_usePrompt as useBlocker } from 'react-router-dom'
+
+function Prompt(props) {
+ const block = props.when
+
+ useBlocker(() => {
+ if (block) {
+ return ! window.confirm(props.message)
+ }
+ return false
+ })
+
+ return (
+
+ )
+}
+
+export default Prompt
\ No newline at end of file