diff --git a/client/src/components/PasswordChangeForm/index.jsx b/client/src/components/PasswordChangeForm/index.jsx index 3dadb8b..5cea93b 100644 --- a/client/src/components/PasswordChangeForm/index.jsx +++ b/client/src/components/PasswordChangeForm/index.jsx @@ -1,7 +1,8 @@ import React, { useState } from "react"; +import { useDispatch, useSelector } from "react-redux"; import { Button, Form, FormGroup } from "reactstrap"; -import { useFirebase } from "../../services/auth"; import InputField from "../InputField"; +import { updatePasswordAsync, selectError } from "../../store/sessionSlice"; const useStyles = () => ({ root: { @@ -17,19 +18,16 @@ const useStyles = () => ({ const PasswordChangeForm = () => { const [password1, setPassword1] = useState(""); const [password2, setPassword2] = useState(""); - const [error, setError] = useState(null); - const auth = useFirebase(); + const error = useSelector(selectError); + + const dispatch = useDispatch(); const handleSubmit = (e) => { e.preventDefault(); - auth - .updatePassword(password1) - .then(() => { - setPassword1(""); - setPassword2(""); - }) - .catch((err) => setError(err)); + setPassword1(""); + setPassword2(""); + dispatch(updatePasswordAsync(password1)); }; const isInvalid = password1 === password2 || password1 === ""; diff --git a/client/src/components/PasswordForgetForm/index.jsx b/client/src/components/PasswordForgetForm/index.jsx index ddf0d73..3f51105 100644 --- a/client/src/components/PasswordForgetForm/index.jsx +++ b/client/src/components/PasswordForgetForm/index.jsx @@ -1,7 +1,8 @@ import React, { useState } from "react"; +import { useDispatch, useSelector } from "react-redux"; import { Button, Form, FormGroup } from "reactstrap"; -import { useFirebase } from "../../services/auth"; import InputField from "../../components/InputField"; +import { resetPasswordAsync, selectError } from "../../store/sessionSlice"; const useStyles = () => ({ button: { @@ -12,19 +13,14 @@ const useStyles = () => ({ const PasswordForgetForm = () => { const [email, setEmail] = useState(""); - const [error, setError] = useState(null); + const error = useSelector(selectError); - const auth = useFirebase(); + const dispatch = useDispatch(); const handleSubmit = (e) => { e.preventDefault(); - auth - .resetPassword(email) - .then(() => { - setEmail(""); - setError(null); - }) - .catch((err) => setError(err)); + setEmail(""); + dispatch(resetPasswordAsync(email)); }; const isInvalid = email === ""; diff --git a/client/src/components/SignOutButton/index.jsx b/client/src/components/SignOutButton/index.jsx index ddbdb9e..f7e7a6a 100644 --- a/client/src/components/SignOutButton/index.jsx +++ b/client/src/components/SignOutButton/index.jsx @@ -1,9 +1,11 @@ import React from "react"; +import { withRouter } from "react-router-dom"; +import { useDispatch } from "react-redux"; import { Button } from "reactstrap"; -import { useFirebase } from "../../services/auth"; +import { signOutAsync } from "../../store/sessionSlice"; const SignOutButton = () => { - const auth = useFirebase(); - return ; + const dispatch = useDispatch(); + return ; }; -export default SignOutButton; +export default withRouter(SignOutButton); diff --git a/client/src/constants/authConditions.js b/client/src/constants/authConditions.js index 66ed9d5..c0c4c56 100644 --- a/client/src/constants/authConditions.js +++ b/client/src/constants/authConditions.js @@ -1,4 +1,4 @@ import * as ROLES from "./roles"; -export const AUTHENTICATED = (authUser) => !!authUser; +export const AUTHENTICATED = (authUser) => !!authUser.loggedIn; export const ADMIN = (authUser) => authUser && !!authUser.roles[ROLES.ADMIN]; diff --git a/client/src/routes/PrivateRoute.jsx b/client/src/routes/PrivateRoute.jsx index 600d52e..21067ea 100644 --- a/client/src/routes/PrivateRoute.jsx +++ b/client/src/routes/PrivateRoute.jsx @@ -15,7 +15,7 @@ const PrivateRoute = ({ useEffect(() => { if (!condition(authUser)) { - history.push(ROUTES.SIGN_IN); + setTimeout(() => history.push(ROUTES.SIGN_IN), 0); } }, [condition, history, authUser]); diff --git a/client/src/store/sessionSlice.js b/client/src/store/sessionSlice.js index 6719a77..4580509 100644 --- a/client/src/store/sessionSlice.js +++ b/client/src/store/sessionSlice.js @@ -87,10 +87,33 @@ export const signInAsync = (email, password, props) => async (dispatch) => { firebase .auth() .signInWithEmailAndPassword(email, password) - .then(() => props.history.push(ROUTES.APP)) + .then(() => { + dispatch(logIn()); + props.history.push(ROUTES.APP); + }) .catch((err) => dispatch(newError(err))); }; +/** + * Sign out + */ +export const signOutAsync = () => async (dispatch) => { + firebase + .auth() + .signOut() + .then(() => { + dispatch(logOut()); + }); +}; + +export const resetPasswordAsync = (email) => async (dispatch) => { + firebase.auth().sendPasswordResetEmail(email); +}; + +export const updatePasswordAsync = (password) => async (dispatch) => { + firebase.auth().currentUser.updatePassword(password); +}; + /** * Create auth user with google */