b.santos/cloud-cap-samples
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactoring error page

Browse Source
This commit is contained in:
Dzmitry_Tamashevich@epam.com
2020-11-24 12:49:26 +03:00
committed by Daniel Hutzel
parent 938abb6387
commit 3d176237c1
4 changed files with 55 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
media-store/app/src/components/Router.js
View File

@@ -1,10 +1,5 @@
import React from "react";
import {
BrowserRouter as Router,
Switch,
Route,
Redirect,
} from "react-router-dom";
import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
import { isEmpty } from "lodash";
import { TracksContainer } from "../pages/tracks/TracksPage";
import { CurrentPageHeader } from "./CurrentPageHeader";
@@ -40,39 +35,32 @@ const RestrictedManageStore = withRestrictions(
const MyRouter = () => {
return (
<Router>
<Switch>
<Route path="/error">
<ErrorPage />
</Route>
<Route>
<Header />
<div style={{ padding: "2em 20vh" }}>
<CurrentPageHeader />
<Switch>
<Route exact path={["/"]}>
<TracksContainer />
</Route>
<Route exact path="/person">
<RestrictedPersonPage
myInvoicesSection={<RestrictedMyInvoicesSection />}
/>
</Route>
<Route exact path="/login">
<RestrictedLogin />
</Route>
<Route exact path="/invoice">
<RestrictedInvoicePage />
</Route>
<Route exact path="/manage">
<RestrictedManageStore />
</Route>
<Route>
<Redirect to="/error" />
</Route>
</Switch>
</div>
</Route>
</Switch>
<Header />
<div style={{ padding: "2em 20vh" }}>
<CurrentPageHeader />
<Switch>
<Route exact path={["/", "/tracks"]}>
<TracksContainer />
</Route>
<Route exact path="/person">
<RestrictedPersonPage
myInvoicesSection={<RestrictedMyInvoicesSection />}
/>
</Route>
<Route exact path="/login">
<RestrictedLogin />
</Route>
<Route exact path="/invoice">
<RestrictedInvoicePage />
</Route>
<Route exact path="/manage">
<RestrictedManageStore />
</Route>
<Route path="/">
<ErrorPage />
</Route>
</Switch>
</div>
</Router>
);
};

28
media-store/app/src/pages/ErrorPage.js
View File

@@ -1,22 +1,23 @@
import React, { useEffect } from "react";
import React from "react";
import { useHistory } from "react-router-dom";
import { isEmpty } from "lodash";
import { Result, Button } from "antd";
import { useAppState } from "../hooks/useAppState";
const ErrorPage = () => {
const { error, setError } = useAppState();
const { user, error, setError } = useAppState();
const history = useHistory();
useEffect(() => {
setError({});
history.replace("/");
}, []);
const onGoHome = () => {
setError({});
history.push("/");
};
const goLoginPage = () => {
setError({});
history.push("/login");
};
const errorResultProps = isEmpty(error)
? {
status: 404,
@@ -35,9 +36,16 @@ const ErrorPage = () => {
<Result
{...errorResultProps}
extra={
<Button onClick={onGoHome} type="primary">
Back Home
</Button>
<>
<Button onClick={onGoHome} type="primary">
Back Home
</Button>
{!user && (
<Button onClick={goLoginPage} type="primary">
Login
</Button>
)}
</>
}
/>
);