Add password reset

src/pages/Forgot/ForgotPage.tsx

@@ -0,0 +1,34 @@
+import { RouteComponentProps } from "react-router-dom"
+import { useDispatch, useSelector, shallowEqual } from "react-redux"
+import React, { memo } from "react"
+import { Helmet } from "react-helmet"
+
+import { AppState } from "../../store"
+import ForgotForm from "../../components/ForgotForm/ForgotForm"
+import styles from "./styles.module.scss"
+
+export type Props = RouteComponentProps
+
+const ForgotPage: React.FC<Props> = (): JSX.Element => {
+    const dispatch = useDispatch()
+    const forgotError = useSelector((state: AppState) => state.volunteerForgot.error, shallowEqual)
+    const forgotMessage = useSelector(
+        (state: AppState) => state.volunteerForgot.entity?.message,
+        shallowEqual
+    )
+
+    return (
+        <div className={styles.forgotPage}>
+            <div className={styles.forgotContent}>
+                <Helmet title="ForgotPage" />
+                <ForgotForm
+                    dispatch={dispatch}
+                    error={forgotError || ""}
+                    message={forgotMessage || ""}
+                />
+            </div>
+        </div>
+    )
+}
+
+export default memo(ForgotPage)

src/pages/Forgot/index.tsx

@@ -0,0 +1,14 @@
+import loadable from "@loadable/component"
+
+import { Loading, ErrorBoundary } from "../../components"
+import { Props } from "./ForgotPage"
+
+const ForgotPage = loadable(() => import("./ForgotPage"), {
+    fallback: <Loading />,
+})
+
+export default (props: Props): JSX.Element => (
+    <ErrorBoundary>
+        <ForgotPage {...props} />
+    </ErrorBoundary>
+)

src/pages/Forgot/styles.module.scss

@@ -0,0 +1,9 @@
+@import "../../theme/mixins";
+
+.forgotPage {
+    @include page-wrapper-center;
+}
+
+.forgotContent {
+    @include page-content-wrapper;
+}

src/pages/Login/LoginPage.tsx

@@ -9,18 +9,18 @@ import styles from "./styles.module.scss"
 
 export type Props = RouteComponentProps
 
-const RegisterPage: React.FC<Props> = (): JSX.Element => {
+const LoginPage: React.FC<Props> = (): JSX.Element => {
     const dispatch = useDispatch()
     const loginError = useSelector((state: AppState) => state.volunteerLogin.error, shallowEqual)
 
     return (
         <div className={styles.loginPage}>
             <div className={styles.loginContent}>
-                <Helmet title="RegisterPage" />
+                <Helmet title="LoginPage" />
                 <LoginForm dispatch={dispatch} error={loginError || ""} />
             </div>
         </div>
     )
 }
 
-export default memo(RegisterPage)
+export default memo(LoginPage)