{"version":3,"sources":["webpack:///./src/pages/forgot-password.tsx"],"names":["ForgotPasswordPage","lang","useIntl","ValidationSchema","useMemo","Yup","shape","email","formatMessage","id","required","useState","showErrorMessage","setShowErrorMessage","errorMessage","setErrorMessage","showAlert","setShowAlert","useForgotPasswordLazyQuery","fetchPolicy","forgotPassword","data","loading","error","useEffect","console","log","message","isLoggedIn","navigate","client","title","description","show","enter","enterFrom","enterTo","leave","leaveFrom","leaveTo","className","xmlns","viewBox","fill","fillRule","d","clipRule","type","onClick","aria-label","initialValues","validationSchema","onSubmit","values","actions","variables","clientId","process","setSubmitting","isSubmitting","errors","htmlFor","name","placeholder","msg","disabled","cx","cy","r","stroke","strokeWidth"],"mappings":"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","file":"component---src-pages-forgot-password-tsx-954704bea7803a4236a0.js","sourcesContent":["import React, { useEffect, useState, useMemo } from \"react\";\nimport { Formik, Form, Field, ErrorMessage } from \"formik\";\nimport * as Yup from \"yup\";\nimport { navigate } from \"gatsby\";\nimport { useIntl, FormattedMessage } from \"gatsby-plugin-intl\";\nimport { Transition } from \"@tailwindui/react\";\nimport { ApolloProvider } from \"@apollo/client\";\n\nimport Layout from \"../components/layout\";\nimport SEO from \"../components/seo\";\nimport { isLoggedIn } from \"../components/app/services/auth\";\nimport { useForgotPasswordLazyQuery } from \"../components/app/generated/graphql\";\nimport client from \"../gatsby-theme-apollo/client\";\n\nconst ForgotPasswordPage: React.FC = () => {\n  const lang = useIntl();\n\n  const ValidationSchema = useMemo(() => {\n    return Yup.object().shape({\n      email: Yup.string()\n        .email(lang.formatMessage({ id: \"error_invalid_email\" }))\n        .required(lang.formatMessage({ id: \"required\" })),\n    });\n  }, [lang]);\n\n  const [showErrorMessage, setShowErrorMessage] = useState<boolean>(false);\n  const [errorMessage, setErrorMessage] = useState<string>(\"\");\n  const [showAlert, setShowAlert] = useState(false);\n  const [forgotPassword, { data, loading, error }] = useForgotPasswordLazyQuery(\n    {\n      fetchPolicy: \"network-only\",\n    }\n  );\n\n  useEffect(() => {\n    if (data) {\n      console.log(data);\n      if (data.forgotPassword) {\n        // show success alert\n        setShowAlert(true);\n      }\n    }\n\n    if (error) {\n      console.log(error);\n      setShowErrorMessage(true);\n      setErrorMessage(error.message);\n    }\n\n    if (loading) {\n      console.log(loading);\n    }\n  }, [data, error, loading]);\n\n  if (isLoggedIn()) {\n    navigate(`/app`);\n  }\n\n  return (\n    <ApolloProvider client={client}>\n      <Layout>\n        <SEO\n          title=\"Forgot Password\"\n          description=\"Forgot password to your GivFast account.\"\n        />\n        <Transition\n          show={showAlert}\n          enter=\"ease-out duration-300\"\n          enterFrom=\"opacity-0\"\n          enterTo=\"opacity-100\"\n          leave=\"ease-in duration-200\"\n          leaveFrom=\"opacity-100\"\n          leaveTo=\"opacity-0\"\n        >\n          <div>\n            <div className=\"rounded-md bg-green-50 p-4\">\n              <div className=\"flex\">\n                <div className=\"flex-shrink-0\">\n                  <svg\n                    className=\"h-5 w-5 text-green-400\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    viewBox=\"0 0 20 20\"\n                    fill=\"currentColor\"\n                  >\n                    <path\n                      fillRule=\"evenodd\"\n                      d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\"\n                      clipRule=\"evenodd\"\n                    />\n                  </svg>\n                </div>\n                <div className=\"ml-3\">\n                  <p className=\"text-sm leading-5 font-medium text-green-800\">\n                    <FormattedMessage id=\"sent_msg\" />\n                  </p>\n                </div>\n                <div className=\"ml-auto pl-3\">\n                  <div className=\"-mx-1.5 -my-1.5\">\n                    <button\n                      type=\"button\"\n                      onClick={() => setShowAlert(false)}\n                      className=\"inline-flex rounded-md p-1.5 text-green-500 hover:bg-green-100 focus:outline-none focus:bg-green-100 transition ease-in-out duration-150\"\n                      aria-label=\"Dismiss\"\n                    >\n                      <svg\n                        className=\"h-5 w-5\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                        viewBox=\"0 0 20 20\"\n                        fill=\"currentColor\"\n                      >\n                        <path\n                          fillRule=\"evenodd\"\n                          d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n                          clipRule=\"evenodd\"\n                        />\n                      </svg>\n                    </button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </Transition>\n        <Transition\n          show={showErrorMessage}\n          enter=\"ease-out duration-300\"\n          enterFrom=\"opacity-0\"\n          enterTo=\"opacity-100\"\n          leave=\"ease-in duration-200\"\n          leaveFrom=\"opacity-100\"\n          leaveTo=\"opacity-0\"\n        >\n          <div>\n            <div className=\"rounded-md bg-red-50 p-4\">\n              <div className=\"flex\">\n                <div className=\"flex-shrink-0\">\n                  <svg className=\"h-5 w-5 text-red-400\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n                    <path fillRule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\" clipRule=\"evenodd\" />\n                  </svg>\n                </div>\n                <div className=\"ml-3\">\n                  <h3 className=\"text-sm leading-5 font-medium text-red-800\">\n                    <FormattedMessage id=\"oops\" />\n                  </h3>\n                  <div className=\"mt-2 text-sm leading-5 text-red-700\">\n                    <ul className=\"list-disc pl-5\">\n                      <li>\n                        {errorMessage}\n                      </li>\n                    </ul>\n                  </div>\n                </div>\n                <div className=\"ml-auto pl-3\">\n                  <div className=\"-mx-1.5 -my-1.5\">\n                    <button\n                      type=\"button\"\n                      onClick={() => setShowErrorMessage(false)}\n                      className=\"inline-flex rounded-md p-1.5 text-red-500 hover:bg-red-100 focus:outline-none focus:bg-red-100 transition ease-in-out duration-150\"\n                      aria-label=\"Dismiss\"\n                    >\n                      <svg\n                        className=\"h-5 w-5\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                        viewBox=\"0 0 20 20\"\n                        fill=\"currentColor\"\n                      >\n                        <path\n                          fillRule=\"evenodd\"\n                          d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n                          clipRule=\"evenodd\"\n                        />\n                      </svg>\n                    </button>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </Transition>\n        <div className=\"py-16 px-4 overflow-hidden sm:px-6 lg:px-8 lg:py-24\">\n          <div className=\"relative max-w-xl mx-auto\">\n            <div className=\"text-center\">\n              <h2 className=\"text-3xl leading-9 font-extrabold tracking-tight text-gray-900 sm:text-4xl sm:leading-10\">\n                <FormattedMessage id=\"fogot_password\" />\n              </h2>\n              <p className=\"mt-4 text-lg leading-6 text-gray-500\">\n                <FormattedMessage id=\"fogot_password_2\" />\n              </p>\n            </div>\n            <div className=\"mt-12\">\n              <Formik\n                initialValues={{ email: \"\" }}\n                validationSchema={ValidationSchema}\n                onSubmit={(values, actions) => {\n                  try {\n                    forgotPassword({\n                      variables: {\n                        email: values.email,\n                        clientId: process.env.GIVFAST_API_CLIENT_ID,\n                      },\n                    });\n                  } catch (error) {\n                    console.error(error);\n                    setErrorMessage(error.message);\n                    setShowErrorMessage(true);\n                  }\n                  actions.setSubmitting(false);\n                }}\n              >\n                {({ isSubmitting, errors }) => (\n                  <Form>\n                    {/* Email Field */}\n                    <div className=\"mt-6\">\n                      <label\n                        htmlFor=\"email\"\n                        className=\"block text-sm font-medium leading-5 text-gray-700\"\n                      >\n                        <FormattedMessage id=\"label_email\" />\n                      </label>\n                      <div className=\"mt-1 relative rounded-md shadow-sm\">\n                        <Field\n                          type=\"email\"\n                          name=\"email\"\n                          className={`form-input block w-full sm:text-sm sm:leading-5 pr-10 ${\n                            errors.email\n                              ? \"border-red-300 text-red-900 placeholder-red-300 focus:border-red-300 focus:shadow-outline-red\"\n                              : \"\"\n                          }`}\n                          placeholder=\"you@example.com\"\n                        />\n                        {/* {errors.email && (\n                        <div className=\"absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none\">\n                          <svg\n                            className=\"h-5 w-5 text-red-500\"\n                            fill=\"currentColor\"\n                            viewBox=\"0 0 20 20\"\n                          >\n                            <path\n                              fillRule=\"evenodd\"\n                              d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7 4a1 1 0 11-2 0 1 1 0 012 0zm-1-9a1 1 0 00-1 1v4a1 1 0 102 0V6a1 1 0 00-1-1z\"\n                              clipRule=\"evenodd\"\n                            />\n                          </svg>\n                        </div>\n                      )} */}\n                      </div>\n                      <ErrorMessage name=\"email\">\n                        {(msg: string): React.ReactNode => (\n                          <p\n                            className=\"mt-2 text-sm text-red-600\"\n                            id=\"email-error\"\n                          >\n                            {msg}\n                          </p>\n                        )}\n                      </ErrorMessage>\n                    </div>\n                    <div className=\"mt-6\">\n                      <button\n                        type=\"submit\"\n                        className=\"group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm leading-5 font-medium rounded-md text-white bg-teal-600 hover:bg-teal-500 focus:outline-none focus:border-teal-700 focus:shadow-outline-indigo active:bg-teal-700 transition duration-150 ease-in-out capitalize\"\n                        disabled={loading}\n                      >\n                        <span className=\"absolute left-0 inset-y-0 flex items-center pl-3\">\n                          {(loading || isSubmitting) && !error && (\n                            <svg\n                              className=\"animate-spin -ml-1 mr-3 h-5 w-5 text-white\"\n                              xmlns=\"http://www.w3.org/2000/svg\"\n                              fill=\"none\"\n                              viewBox=\"0 0 24 24\"\n                            >\n                              <circle\n                                className=\"opacity-25\"\n                                cx=\"12\"\n                                cy=\"12\"\n                                r=\"10\"\n                                stroke=\"currentColor\"\n                                strokeWidth=\"4\"\n                              ></circle>\n                              <path\n                                className=\"opacity-75\"\n                                fill=\"currentColor\"\n                                d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n                              ></path>\n                            </svg>\n                          )}\n                        </span>\n                        <FormattedMessage id=\"submit\" />\n                      </button>\n                    </div>\n                  </Form>\n                )}\n              </Formik>\n            </div>\n          </div>\n        </div>\n      </Layout>\n    </ApolloProvider>\n  );\n};\n\nexport default ForgotPasswordPage;\n"],"sourceRoot":""}