ODWRTW/canape
2
2
Fork 0
Code Issues 3 Pull Requests 1 Releases Activity

Use redux hooks on the auth component

Browse Source
This commit is contained in:
Grégoire Delattre 2020-04-03 16:29:06 +02:00
parent 2e83c3169f
commit e7f96a1bd7
1 changed files with 16 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
frontend/js/auth.js
View File

@ -1,17 +1,19 @@
import React from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { useDispatch, useSelector } from "react-redux";
import { Route, Redirect } from "react-router-dom";
import { setUserToken } from "./actions/users";
const protectedRoute = ({
component: Component,
isLogged,
isActivated,
isTokenSet,
setUserToken,
...otherProps
}) => {
export const ProtectedRoute = ({ component: Component, ...otherProps }) => {
const dispatch = useDispatch();
const isLogged = useSelector((state) => state.userStore.get("isLogged"));
const isActivated = useSelector((state) =>
state.userStore.get("isActivated")
);
const isTokenSet = useSelector((state) => state.userStore.get("isTokenSet"));
const isAuthenticated = () => {
if (isTokenSet) {
return true;
@ -20,7 +22,7 @@ const protectedRoute = ({
const token = localStorage.getItem("token");
if (isLogged || (token && token !== "")) {
if (!isTokenSet) {
setUserToken(token);
dispatch(setUserToken(token));
}
return true;
}
@ -45,24 +47,12 @@ const protectedRoute = ({
/>
);
};
protectedRoute.propTypes = {
ProtectedRoute.propTypes = {
component: PropTypes.func,
isLogged: PropTypes.bool.isRequired,
isActivated: PropTypes.bool.isRequired,
isTokenSet: PropTypes.bool.isRequired,
setUserToken: PropTypes.func.isRequired,
};
export const ProtectedRoute = connect(
(state) => ({
isLogged: state.userStore.get("isLogged"),
isAdmin: state.userStore.get("isLogged"),
isActivated: state.userStore.get("isActivated"),
isTokenSet: state.userStore.get("isTokenSet"),
}),
{ setUserToken }
)(protectedRoute);
const adminRoute = ({ component: Component, isAdmin, ...otherProps }) => {
export const AdminRoute = ({ component: Component, ...otherProps }) => {
const isAdmin = useSelector((state) => state.userStore.get("isAdmin"));
return (
<Route
{...otherProps}
@ -76,10 +66,6 @@ const adminRoute = ({ component: Component, isAdmin, ...otherProps }) => {
/>
);
};
adminRoute.propTypes = {
AdminRoute.propTypes = {
component: PropTypes.func,
isAdmin: PropTypes.bool.isRequired,
};
export const AdminRoute = connect((state) => ({
isAdmin: state.userStore.get("isLogged"),
}))(adminRoute);