Added error pages for detail type pages BOD-119

This commit is contained in:
Patrick Fic
2020-08-25 13:59:50 -07:00
parent b78b6ef876
commit 728f1a84d7
6 changed files with 163 additions and 173 deletions

View File

@@ -19,9 +19,7 @@ const ResetPassword = lazy(() =>
);
const ManagePage = lazy(() => import("../pages/manage/manage.page.container"));
const SignInPage = lazy(() => import("../pages/sign-in/sign-in.page"));
const Unauthorized = lazy(() =>
import("../pages/unauthorized/unauthorized.component")
);
const CsiPage = lazy(() => import("../pages/csi/csi.container.page"));
const MobilePaymentContainer = lazy(() =>
import("../pages/mobile-payment/mobile-payment.container")
@@ -51,30 +49,41 @@ export function App({ checkUserSession, currentUser }) {
return (
<div>
<Switch>
<ErrorBoundary>
<Suspense fallback={<LoadingSpinner message="App.Js Suspense" />}>
<Suspense fallback={<LoadingSpinner message="App.Js Suspense" />}>
<ErrorBoundary>
<Route exact path="/" component={LandingPage} />
<Route exact path="/unauthorized" component={Unauthorized} />
</ErrorBoundary>
<ErrorBoundary>
<Route exact path="/signin" component={SignInPage} />
</ErrorBoundary>
<ErrorBoundary>
<Route exact path="/resetpassword" component={ResetPassword} />
</ErrorBoundary>
<ErrorBoundary>
<Route exact path="/csi/:surveyId" component={CsiPage} />
</ErrorBoundary>
<ErrorBoundary>
<Route
exact
path="/mp/:paymentIs"
component={MobilePaymentContainer}
/>
</ErrorBoundary>
<ErrorBoundary>
<PrivateRoute
isAuthorized={currentUser.authorized}
path="/manage"
component={ManagePage}
/>
</ErrorBoundary>
<ErrorBoundary>
<PrivateRoute
isAuthorized={currentUser.authorized}
path="/tech"
component={TechPageContainer}
/>
</Suspense>
</ErrorBoundary>
</ErrorBoundary>
</Suspense>
</Switch>
</div>
);

View File

@@ -12,6 +12,7 @@ import {
} from "../../redux/application/application.actions";
import { CreateRecentItem } from "../../utils/create-recent-item";
import OwnersDetailComponent from "./owners-detail.page.component";
import NotFound from "../../components/not-found/not-found.component";
const mapDispatchToProps = (dispatch) => ({
setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
@@ -34,9 +35,9 @@ export function OwnersDetailContainer({
useEffect(() => {
document.title = t("titles.owners-detail", {
name: data
? `${data.owners_by_pk.ownr_fn || ""} ${
data.owners_by_pk.ownr_ln || ""
} ${data.owners_by_pk.ownr_co_nm || ""}`
? `${(data.owners_by_pk && data.owners_by_pk.ownr_fn) || ""} ${
(data.owners_by_pk && data.owners_by_pk.ownr_ln) || ""
} ${(data.owners_by_pk && data.owners_by_pk.ownr_co_nm) || ""}`
: "",
});
@@ -46,15 +47,15 @@ export function OwnersDetailContainer({
link: `/manage/owners/${ownerId}`,
label: t("titles.bc.owner-detail", {
name: data
? `${data.owners_by_pk.ownr_fn || ""} ${
data.owners_by_pk.ownr_ln || ""
} ${data.owners_by_pk.ownr_co_nm || ""}`
? `${(data.owners_by_pk && data.owners_by_pk.ownr_fn) || ""} ${
(data.owners_by_pk && data.owners_by_pk.ownr_ln) || ""
} ${(data.owners_by_pk && data.owners_by_pk.ownr_co_nm) || ""}`
: "",
}),
},
]);
if (data)
if (data && data.owners_by_pk)
addRecentItem(
CreateRecentItem(
ownerId,
@@ -69,16 +70,12 @@ export function OwnersDetailContainer({
if (loading) return <LoadingSpinner />;
if (error) return <AlertComponent message={error.message} type="error" />;
if (!!!data.owners_by_pk) return <NotFound />;
if (data.owners_by_pk)
return (
<RbacWrapper action="owners:detail">
<OwnersDetailComponent owner={data.owners_by_pk} refetch={refetch} />
</RbacWrapper>
);
else
return (
<AlertComponent message={t("owners.errors.noaccess")} type="error" />
);
return (
<RbacWrapper action="owners:detail">
<OwnersDetailComponent owner={data.owners_by_pk} refetch={refetch} />
</RbacWrapper>
);
}
export default connect(null, mapDispatchToProps)(OwnersDetailContainer);

View File

@@ -1,15 +0,0 @@
import React from "react";
import { Typography } from "antd";
import HeaderContainer from "../../components/header/header.container";
export default function Unauthorized() {
return (
<div>
<HeaderContainer landingHeader />
<Typography.Title>Unauthorized</Typography.Title>
<Typography.Paragraph>
You do not have permission to view the requested page.
</Typography.Paragraph>
</div>
);
}

View File

@@ -11,6 +11,7 @@ import {
} from "../../redux/application/application.actions";
import { connect } from "react-redux";
import { CreateRecentItem } from "../../utils/create-recent-item";
import NotFound from "../../components/not-found/not-found.component";
const mapDispatchToProps = (dispatch) => ({
setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
@@ -34,7 +35,9 @@ export function VehicleDetailContainer({
document.title = t("titles.vehicledetail", {
vehicle:
data && data.vehicles_by_pk
? `${data.vehicles_by_pk.v_model_yr} ${data.vehicles_by_pk.v_make_desc} ${data.vehicles_by_pk.v_model_desc}`
? `${data.vehicles_by_pk && data.vehicles_by_pk.v_model_yr} ${
data.vehicles_by_pk && data.vehicles_by_pk.v_make_desc
} ${data.vehicles_by_pk && data.vehicles_by_pk.v_model_desc}`
: "",
});
setBreadcrumbs([
@@ -50,7 +53,7 @@ export function VehicleDetailContainer({
},
]);
if (data)
if (data && data.vehicles_by_pk)
addRecentItem(
CreateRecentItem(
vehId,
@@ -64,13 +67,9 @@ export function VehicleDetailContainer({
if (loading) return <LoadingSpinner />;
if (error) return <AlertComponent message={error.message} type="error" />;
if (data.vehicles_by_pk)
return (
<VehicleDetailComponent vehicle={data.vehicles_by_pk} refetch={refetch} />
);
else
return (
<AlertComponent message={t("vehicles.errors.noaccess")} type="error" />
);
if (!!!data.vehicles_by_pk) return <NotFound />;
return (
<VehicleDetailComponent vehicle={data.vehicles_by_pk} refetch={refetch} />
);
}
export default connect(null, mapDispatchToProps)(VehicleDetailContainer);