mirror of
https://github.com/empayre/fleet.git
synced 2024-11-06 08:55:24 +00:00
403 Page, routing for tier permissions (#920)
* 403 page, svg, routing * Reroute basic tier pages if no permission to access
This commit is contained in:
RachelElysia
GitHub
parent
16a8e13f85
commit
af301be81c
47
assets/images/403.svg
Normal file
47
assets/images/403.svg
Normal file
@ -0,0 +1,47 @@
|
||||
<svg width="1280" height="454" viewBox="0 0 1280 454" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="-5" width="1285" height="406" fill="url(#paint0_linear)"/>
|
||||
<circle cx="188.5" cy="414.5" r="91.5" fill="#E6EDEF"/>
|
||||
<circle cx="111.5" cy="391.5" r="72.5" fill="#E6EDEF"/>
|
||||
<circle cx="197.5" cy="455.5" r="85.5" fill="#E6EDEF"/>
|
||||
<circle cx="1230.5" cy="364.5" r="109.5" fill="#E6EDEF"/>
|
||||
<circle cx="1279.5" cy="399.5" r="94.5" fill="#E6EDEF"/>
|
||||
<circle cx="1086.5" cy="428.5" r="43.5" fill="#E6EDEF"/>
|
||||
<circle cx="1085.5" cy="406.5" r="77.5" fill="#E6EDEF"/>
|
||||
<circle cx="988.5" cy="433.5" r="62.5" fill="#E6EDEF"/>
|
||||
<circle cx="20.5" cy="388.5" r="91.5" fill="#F2F7F9"/>
|
||||
<circle cx="111.5" cy="368.5" r="72.5" fill="#F2F7F9"/>
|
||||
<circle cx="188.5" cy="438.5" r="85.5" fill="#F2F7F9"/>
|
||||
<circle cx="396.5" cy="431.5" r="72.5" fill="#F2F7F9"/>
|
||||
<circle cx="712.5" cy="433.5" r="72.5" fill="#F2F7F9"/>
|
||||
<circle cx="903.5" cy="430.5" r="72.5" fill="#F2F7F9"/>
|
||||
<circle cx="1142.5" cy="393.5" r="109.5" fill="#F2F7F9"/>
|
||||
<circle cx="1158.5" cy="425.5" r="72.5" fill="#F2F7F9"/>
|
||||
<circle cx="1279.5" cy="376.5" r="94.5" fill="#F2F7F9"/>
|
||||
<circle cx="1086.5" cy="405.5" r="43.5" fill="#F2F7F9"/>
|
||||
<circle cx="296" cy="408" r="52" fill="#F2F7F9"/>
|
||||
<circle cx="609.5" cy="443.5" r="62.5" fill="#F2F7F9"/>
|
||||
<circle cx="1018.5" cy="411.5" r="77.5" fill="#F2F7F9"/>
|
||||
<circle cx="812.5" cy="441.5" r="62.5" fill="#F2F7F9"/>
|
||||
<circle cx="20.5" cy="474.5" r="91.5" fill="white"/>
|
||||
<circle cx="188.5" cy="464.5" r="85.5" fill="white"/>
|
||||
<circle cx="97.5" cy="443.5" r="72.5" fill="white"/>
|
||||
<circle cx="356.5" cy="424.5" r="72.5" fill="white"/>
|
||||
<circle cx="501.5" cy="426.5" r="72.5" fill="white"/>
|
||||
<circle cx="677.5" cy="426.5" r="72.5" fill="white"/>
|
||||
<circle cx="853.5" cy="414.5" r="72.5" fill="white"/>
|
||||
<circle cx="1050.5" cy="451.5" r="109.5" fill="white"/>
|
||||
<circle cx="1158.5" cy="421.5" r="72.5" fill="white"/>
|
||||
<circle cx="1279.5" cy="462.5" r="94.5" fill="white"/>
|
||||
<circle cx="438.5" cy="392.5" r="43.5" fill="white"/>
|
||||
<circle cx="257.5" cy="410.5" r="43.5" fill="white"/>
|
||||
<circle cx="591.5" cy="420.5" r="62.5" fill="white"/>
|
||||
<circle cx="935.5" cy="410.5" r="62.5" fill="white"/>
|
||||
<circle cx="762.5" cy="415.5" r="62.5" fill="white"/>
|
||||
<rect y="436" width="1285" height="70" fill="white"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="637.5" y1="0" x2="669.104" y2="582.618" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#1F1D42"/>
|
||||
<stop offset="1" stop-color="#00FFF0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.4 KiB |
@ -18,7 +18,7 @@ interface IRootState {
|
||||
};
|
||||
}
|
||||
|
||||
const { HOME } = paths;
|
||||
const { FLEET_403 } = paths;
|
||||
|
||||
const BasicTierRoutes = (props: IBasicTierRoutes) => {
|
||||
const { children } = props;
|
||||
@ -33,8 +33,7 @@ const BasicTierRoutes = (props: IBasicTierRoutes) => {
|
||||
}
|
||||
|
||||
if (!permissionUtils.isBasicTier(config)) {
|
||||
dispatch(push(HOME));
|
||||
dispatch(renderFlash("error", "You do not have permissions for that page"));
|
||||
dispatch(push(FLEET_403));
|
||||
return null;
|
||||
}
|
||||
return <>{children}</>;
|
||||
|
||||
40
frontend/pages/Fleet403/Fleet403.jsx
Normal file
40
frontend/pages/Fleet403/Fleet403.jsx
Normal file
@ -0,0 +1,40 @@
|
||||
import React, { Component } from "react";
|
||||
import { Link } from "react-router";
|
||||
|
||||
import PATHS from "router/paths";
|
||||
|
||||
import fleetLogoText from "../../../assets/images/fleet-logo-text-white.svg";
|
||||
import backgroundImg from "../../../assets/images/403.svg";
|
||||
|
||||
const baseClass = "fleet-403";
|
||||
|
||||
class Fleet403 extends Component {
|
||||
render() {
|
||||
return (
|
||||
<div className={baseClass}>
|
||||
<header className="primary-header">
|
||||
<Link to={PATHS.HOME}>
|
||||
<img
|
||||
className="primary-header__logo"
|
||||
src={fleetLogoText}
|
||||
alt="Fleet logo"
|
||||
/>
|
||||
</Link>
|
||||
</header>
|
||||
<img
|
||||
src={backgroundImg}
|
||||
alt="403 background"
|
||||
className="background-image"
|
||||
/>
|
||||
<main>
|
||||
<h1>
|
||||
<span>Access denied.</span>
|
||||
</h1>
|
||||
<p>You do not have permissions to access that page.</p>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Fleet403;
|
||||
54
frontend/pages/Fleet403/_styles.scss
Normal file
54
frontend/pages/Fleet403/_styles.scss
Normal file
@ -0,0 +1,54 @@
|
||||
.fleet-403 {
|
||||
p {
|
||||
color: #333;
|
||||
font-style: $regular;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $core-vibrant-blue;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.primary-header {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
height: 90px;
|
||||
width: 100%;
|
||||
|
||||
&__logo {
|
||||
height: 48px;
|
||||
width: 174px;
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
left: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.background-image {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
main {
|
||||
text-align: center;
|
||||
|
||||
> h1 {
|
||||
display: inline;
|
||||
font-size: 32px;
|
||||
max-width: 479px;
|
||||
color: $core-fleet-black;
|
||||
|
||||
span {
|
||||
font-weight: $bold;
|
||||
}
|
||||
}
|
||||
|
||||
> h2 {
|
||||
font-size: 36px;
|
||||
margin: 13px 0 $pad-xlarge;
|
||||
}
|
||||
}
|
||||
}
|
||||
1
frontend/pages/Fleet403/index.js
Normal file
1
frontend/pages/Fleet403/index.js
Normal file
@ -0,0 +1 @@
|
||||
export { default } from "./Fleet403";
|
||||
@ -35,6 +35,7 @@ import PackComposerPage from "pages/packs/PackComposerPage";
|
||||
import QueryPage from "pages/queries/QueryPage";
|
||||
import QueryPageWrapper from "components/queries/QueryPageWrapper";
|
||||
import RegistrationPage from "pages/RegistrationPage";
|
||||
import Fleet403 from "pages/Fleet403";
|
||||
import Fleet404 from "pages/Fleet404";
|
||||
import Fleet500 from "pages/Fleet500";
|
||||
import UserSettingsPage from "pages/UserSettingsPage";
|
||||
@ -110,6 +111,7 @@ const routes = (
|
||||
</Route>
|
||||
<Route path="/500" component={Fleet500} />
|
||||
<Route path="/404" component={Fleet404} />
|
||||
<Route path="/403" component={Fleet403} />
|
||||
<Route path="*" component={Fleet404} />
|
||||
</Router>
|
||||
</Provider>
|
||||
|
||||
@ -19,6 +19,7 @@ export default {
|
||||
},
|
||||
FORGOT_PASSWORD: `${URL_PREFIX}/login/forgot`,
|
||||
HOME: `${URL_PREFIX}/`,
|
||||
FLEET_403: `${URL_PREFIX}/403`,
|
||||
FLEET_500: `${URL_PREFIX}/500`,
|
||||
LOGIN: `${URL_PREFIX}/login`,
|
||||
LOGOUT: `${URL_PREFIX}/logout`,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user