@shopgate/engage/login/components/ForgotPassword/ForgotPassword.js

Shopgate's ENGAGE library.

import _regeneratorRuntime from"@babel/runtime/regenerator";function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg);var value=info.value;}catch(error){reject(error);return;}if(info.done){resolve(value);}else{Promise.resolve(value).then(_next,_throw);}}function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise(function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value);}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err);}_next(undefined);});};}function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import{hot}from'react-hot-loader/root';import React,{Fragment,useCallback,useState}from'react';import PropTypes from'prop-types';import{RippleButton,I18n,ArrowIcon}from'@shopgate/engage/components';import TextField from'@shopgate/pwa-ui-shared/TextField';import{i18n,EUSERNOTFOUND}from'@shopgate/engage/core';import{container,headline,subline,form,input,button,buttonContainer,resetInstructions,resetInstructionsEmail,goBackButtonContainer,goBackButton,goBackButtonIcon}from"./ForgotPassword.style";import connect from"./ForgotPassword.connector";/**
 * The ForgotPassword component.
 * @param {Object} props The component props.
 * @returns {JSX}
 */var ForgotPassword=function ForgotPassword(_ref){var resetPassword=_ref.resetPassword,goBack=_ref.goBack;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),showSuccess=_useState2[0],setShowSuccess=_useState2[1];var _useState3=useState(''),_useState4=_slicedToArray(_useState3,2),email=_useState4[0],setEmail=_useState4[1];var _useState5=useState(''),_useState6=_slicedToArray(_useState5,2),validationError=_useState6[0],setValidationError=_useState6[1];var _useState7=useState(false),_useState8=_slicedToArray(_useState7,2),loading=_useState8[0],setLoading=_useState8[1];var handleSubmit=useCallback(/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(event){var code;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:event.preventDefault();setValidationError('');if(!email){_context.next=17;break;}setLoading(true);_context.prev=4;_context.next=7;return resetPassword(email);case 7:setShowSuccess(true);_context.next=14;break;case 10:_context.prev=10;_context.t0=_context["catch"](4);code=_context.t0.code;if(code===EUSERNOTFOUND){setValidationError('login.reset_password.customer_not_found');}case 14:setLoading(false);_context.next=18;break;case 17:setValidationError('validation.email');case 18:case"end":return _context.stop();}},_callee,null,[[4,10]]);}));return function(_x){return _ref2.apply(this,arguments);};}(),[email,resetPassword]);var handleBackToLogin=useCallback(function(){goBack();},[goBack]);return React.createElement("div",{className:container},React.createElement("div",{className:headline},React.createElement(I18n.Text,{string:"login.forgot_password"})),!showSuccess?React.createElement(Fragment,null,React.createElement("div",{className:subline},React.createElement(I18n.Text,{string:"login.reset_password.subline"})),React.createElement("form",{onSubmit:handleSubmit,className:form},React.createElement(TextField,{type:"email",name:"email",className:input,label:"login.email",value:email,onChange:function onChange(value){return setEmail(value);},errorText:validationError}),React.createElement("div",{className:buttonContainer},React.createElement(RippleButton,{className:button,type:"secondary",disabled:loading},React.createElement(I18n.Text,{string:"common.submit"}))))):React.createElement(Fragment,null,React.createElement("div",{className:resetInstructions},React.createElement("span",{/* eslint-disable react/no-danger */dangerouslySetInnerHTML:{__html:i18n.text('login.reset_password.reset_instructions',{email:"<span class=\"".concat(resetInstructionsEmail,"\">").concat(email,"</span>")})}/* eslint-enable react/no-danger */})),React.createElement("div",{className:goBackButtonContainer},React.createElement(RippleButton,{flat:true,className:goBackButton,type:"secondary",onClick:handleBackToLogin},React.createElement(ArrowIcon,{className:goBackButtonIcon}),React.createElement(I18n.Text,{string:"login.reset_password.back_to_login"})))));};export default hot(connect(ForgotPassword));