diff --git a/bodyshop_translations.babel b/bodyshop_translations.babel index 64e87d01b..b018318cb 100644 --- a/bodyshop_translations.babel +++ b/bodyshop_translations.babel @@ -6491,6 +6491,27 @@ + + sendagain + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + sendby false @@ -19893,6 +19914,48 @@ + + resetpassword + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + + + resetpasswordvalidate + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + schedule false diff --git a/client/src/components/_test/test.component.jsx b/client/src/components/_test/test.component.jsx index b02768f4c..d17450f75 100644 --- a/client/src/components/_test/test.component.jsx +++ b/client/src/components/_test/test.component.jsx @@ -1,17 +1,14 @@ -import axios from "axios"; -import React, { useState, useEffect } from "react"; -import { connect } from "react-redux"; -import { createStructuredSelector } from "reselect"; -import { auth, logImEXEvent } from "../../firebase/firebase.utils"; -import { selectBodyshop } from "../../redux/user/user.selectors"; -import { setEmailOptions } from "../../redux/email/email.actions"; -import { TemplateList } from "../../utils/TemplateConstants"; import { PaymentRequestButtonElement, - useStripe, - Elements, - useElements, + useStripe } from "@stripe/react-stripe-js"; +import React, { useEffect, useState } from "react"; +import { connect } from "react-redux"; +import { createStructuredSelector } from "reselect"; +import { logImEXEvent } from "../../firebase/firebase.utils"; +import { setEmailOptions } from "../../redux/email/email.actions"; +import { selectBodyshop } from "../../redux/user/user.selectors"; +import { TemplateList } from "../../utils/TemplateConstants"; const mapStateToProps = createStructuredSelector({ bodyshop: selectBodyshop, @@ -47,9 +44,9 @@ function Test({ bodyshop, setEmailOptions }) { if (result) { setPaymentRequest(pr); } else { - var details = { - total: { label: "", amount: { currency: "CAD", value: "0.00" } }, - }; + // var details = { + // total: { label: "", amount: { currency: "CAD", value: "0.00" } }, + // }; // new PaymentRequest( // [{ supportedMethods: ["basic-card"] }], // {} diff --git a/client/src/components/user-request-pw-reset/user-request-pw-reset.styles.scss b/client/src/components/user-request-pw-reset/user-request-pw-reset.styles.scss new file mode 100644 index 000000000..2425df8c1 --- /dev/null +++ b/client/src/components/user-request-pw-reset/user-request-pw-reset.styles.scss @@ -0,0 +1,29 @@ +.login-container { + display: flex; + align-items: center; + flex-direction: column; + padding: 2rem; + form { + width: 75vw; + max-width: 20rem; + } + } + + .login-logo-container { + display: flex; + align-items: center; + margin-bottom: 2rem; + h1 { + text-align: center; + margin: 1rem; + } + } + + //Required as it is position inside form. + .login-btn { + margin: 1.5rem 0rem; + position: relative; + left: 50%; + transform: translate(-50%, 0); + } + \ No newline at end of file diff --git a/client/src/components/user-request-pw-reset/user-request-reset-pw.component.jsx b/client/src/components/user-request-pw-reset/user-request-reset-pw.component.jsx index b4ef3c552..3ad5b368e 100644 --- a/client/src/components/user-request-pw-reset/user-request-reset-pw.component.jsx +++ b/client/src/components/user-request-pw-reset/user-request-reset-pw.component.jsx @@ -1,12 +1,13 @@ -import { Button, Form, Result } from "antd"; +import { Button, Form, Input, Result, Typography } from "antd"; import React from "react"; import { useTranslation } from "react-i18next"; import { connect } from "react-redux"; import { createStructuredSelector } from "reselect"; +import ImEXOnlineLogo from "../../assets/logo240.png"; import { sendPasswordReset } from "../../redux/user/user.actions"; import { selectPasswordReset } from "../../redux/user/user.selectors"; import AlertComponent from "../alert/alert.component"; -import EmailFormItemComponent from "../form-items-formatted/email-form-item.component"; +import "./user-request-pw-reset.styles.scss"; const mapStateToProps = createStructuredSelector({ passwordReset: selectPasswordReset, @@ -28,11 +29,14 @@ export function UserRequestResetPw({ passwordReset, sendPasswordReset }) { if (passwordReset.success) return ( sendPasswordReset(passwordReset.email)}> + , ]} @@ -40,24 +44,33 @@ export function UserRequestResetPw({ passwordReset, sendPasswordReset }) { ); return ( -
-
+
+
+ ImEX Online + {t("titles.app")} +
+ {t("titles.resetpassword")} + + - + ]} + > + {passwordReset.error ? ( - + ) : null} - +
); diff --git a/client/src/components/user-validate-pw-reset/user-validate-pw-reset.component.jsx b/client/src/components/user-validate-pw-reset/user-validate-pw-reset.component.jsx index e3c0a1fa7..b67dd83a7 100644 --- a/client/src/components/user-validate-pw-reset/user-validate-pw-reset.component.jsx +++ b/client/src/components/user-validate-pw-reset/user-validate-pw-reset.component.jsx @@ -1,12 +1,15 @@ import { LockOutlined } from "@ant-design/icons"; -import { Button, Form, Input } from "antd"; +import { Button, Form, Input, Result, Typography } from "antd"; import React from "react"; import { useTranslation } from "react-i18next"; import { connect } from "react-redux"; +import { Link } from "react-router-dom"; import { createStructuredSelector } from "reselect"; +import ImEXOnlineLogo from "../../assets/logo240.png"; import { validatePasswordResetStart } from "../../redux/user/user.actions"; import { selectPasswordReset } from "../../redux/user/user.selectors"; import AlertComponent from "../alert/alert.component"; +import "./user-validate-pw-reset.styles.scss"; const mapStateToProps = createStructuredSelector({ passwordReset: selectPasswordReset, @@ -21,34 +24,56 @@ export function UserValidatePwReset({ validatePasswordReset, oobCode, }) { - console.log("UserValidatePwReset -> oobCode", oobCode); const { t } = useTranslation(); const handleFinish = (values) => { validatePasswordReset({ code: oobCode, password: values.password }); }; + if (passwordReset.success) + return ( + + + , + ]} + /> + ); + return ( -
-
+
+
+ ImEX Online + {t("titles.app")} +
+ + {t("titles.resetpasswordvalidate")} + + + + ]} + > } - type='password' + type="password" placeholder={t("general.labels.password")} /> + ]} + > } - type='password' + type="password" placeholder={t("general.labels.password")} /> {passwordReset.error ? ( - + ) : null} - +
); diff --git a/client/src/components/user-validate-pw-reset/user-validate-pw-reset.styles.scss b/client/src/components/user-validate-pw-reset/user-validate-pw-reset.styles.scss new file mode 100644 index 000000000..60dd3a986 --- /dev/null +++ b/client/src/components/user-validate-pw-reset/user-validate-pw-reset.styles.scss @@ -0,0 +1,29 @@ +.reset-container { + display: flex; + align-items: center; + flex-direction: column; + padding: 2rem; + form { + width: 75vw; + max-width: 20rem; + } + } + + .reset-logo-container { + display: flex; + align-items: center; + margin-bottom: 2rem; + h1 { + text-align: center; + margin: 1rem; + } + } + + //Required as it is position inside form. + .reset-btn { + margin: 1.5rem 0rem; + position: relative; + left: 50%; + transform: translate(-50%, 0); + } + \ No newline at end of file diff --git a/client/src/pages/reset-password/reset-password.component.jsx b/client/src/pages/reset-password/reset-password.component.jsx index cf640aedd..5dec13d70 100644 --- a/client/src/pages/reset-password/reset-password.component.jsx +++ b/client/src/pages/reset-password/reset-password.component.jsx @@ -9,7 +9,7 @@ export default function ResetPassword() { const { mode, oobCode } = searchParams; console.log("ResetPassword -> mode, oobCode", mode, oobCode); - if (mode === "passwordReset") + if (mode === "resetPassword") return ; return ; } diff --git a/client/src/redux/user/user.sagas.js b/client/src/redux/user/user.sagas.js index a1e6a59bb..52b48b8dc 100644 --- a/client/src/redux/user/user.sagas.js +++ b/client/src/redux/user/user.sagas.js @@ -22,7 +22,7 @@ import { sendPasswordResetFailure, sendPasswordResetSuccess, validatePasswordResetSuccess, - validatePasswordResetFailure + validatePasswordResetFailure, } from "./user.actions"; import UserActionTypes from "./user.types"; @@ -192,7 +192,6 @@ export function* onValidatePasswordResetStart() { export function* validatePasswordResetStart({ payload: { password, code } }) { try { yield auth.confirmPasswordReset(code, password); - console.log("Good should send."); yield put(validatePasswordResetSuccess()); } catch (error) { console.log("function*validatePasswordResetStart -> error", error); @@ -210,6 +209,6 @@ export function* userSagas() { call(onCheckInstanceId), call(onSignInSuccess), call(onSendPasswordResetStart), - call(onValidatePasswordResetStart) + call(onValidatePasswordResetStart), ]); } diff --git a/client/src/translations/en_us/common.json b/client/src/translations/en_us/common.json index 9573d3e03..d6444cf0b 100644 --- a/client/src/translations/en_us/common.json +++ b/client/src/translations/en_us/common.json @@ -428,6 +428,7 @@ "print": "Print", "search": "Search...", "selectdate": "Select date...", + "sendagain": "Send Again", "sendby": "Send By", "text": "Text", "unknown": "Unknown", @@ -1238,6 +1239,8 @@ "productionboard": "Production - Board", "productionlist": "Production - List View | $t(titles.app)", "profile": "My Profile | $t(titles.app)", + "resetpassword": "Reset Password", + "resetpasswordvalidate": "Enter New Password", "schedule": "Schedule | $t(titles.app)", "scoreboard": "Scoreboard | $t(titles.app)", "shop": "My Shop | $t(titles.app)", diff --git a/client/src/translations/es/common.json b/client/src/translations/es/common.json index ca8d3da57..1465e75b7 100644 --- a/client/src/translations/es/common.json +++ b/client/src/translations/es/common.json @@ -428,6 +428,7 @@ "print": "", "search": "Buscar...", "selectdate": "", + "sendagain": "", "sendby": "", "text": "", "unknown": "Desconocido", @@ -1238,6 +1239,8 @@ "productionboard": "", "productionlist": "", "profile": "Mi perfil | $t(titles.app)", + "resetpassword": "", + "resetpasswordvalidate": "", "schedule": "Horario | $t(titles.app)", "scoreboard": "", "shop": "Mi tienda | $t(titles.app)", diff --git a/client/src/translations/fr/common.json b/client/src/translations/fr/common.json index 7e6434f7d..94949de0b 100644 --- a/client/src/translations/fr/common.json +++ b/client/src/translations/fr/common.json @@ -428,6 +428,7 @@ "print": "", "search": "Chercher...", "selectdate": "", + "sendagain": "", "sendby": "", "text": "", "unknown": "Inconnu", @@ -1238,6 +1239,8 @@ "productionboard": "", "productionlist": "", "profile": "Mon profil | $t(titles.app)", + "resetpassword": "", + "resetpasswordvalidate": "", "schedule": "Horaire | $t(titles.app)", "scoreboard": "", "shop": "Mon magasin | $t(titles.app)",