UNPKG

@shopgate/engage

Version:
11 lines • 7.97 kB
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 React,{useState,useMemo,useCallback,useEffect}from'react';import PropTypes from'prop-types';import{useCookies}from'react-cookie';import{useRoute,i18n,LoadingProvider,EUNAUTHORIZED,EAUTHENTICATION,ENOTFOUND}from'@shopgate/engage/core';import{useFormState}from'@shopgate/engage/core/hooks/useFormState';import{authenticateConstraints}from"./OrderDetailsProvider.constraints";import connect from"./OrderDetailsProvider.connector";import Context from"./OrderDetailsProvider.context";var defaultFormState={email:'',phone:''};/** * Converts validation errors into errors for form builder. * @param {Object} validationErrors The validation errors. * @returns {Array} */var convertValidationErrors=function convertValidationErrors(validationErrors){return Object.keys(validationErrors).map(function(key){return{path:key,message:i18n.text(validationErrors[key])};});};/** * @param {Object} props The component props. * @returns {JSX} */var OrderDetailsProvider=function OrderDetailsProvider(_ref){var isUserLoggedIn=_ref.isUserLoggedIn,order=_ref.order,orderId=_ref.orderId,shopSettings=_ref.shopSettings,userLocation=_ref.userLocation,fetchOrderDetails=_ref.fetchOrderDetails,cancelOrder=_ref.cancelOrder,children=_ref.children;var _useRoute=useRoute(),pathname=_useRoute.pathname;var _useState=useState(!isUserLoggedIn),_useState2=_slicedToArray(_useState,2),showForm=_useState2[0],setShowForm=_useState2[1];var _useState3=useState(false),_useState4=_slicedToArray(_useState3,2),isLoading=_useState4[0],setIsLoading=_useState4[1];var _useState5=useState(''),_useState6=_slicedToArray(_useState5,2),errorMessage=_useState6[0],setErrorMessage=_useState6[1];var orderTokenCookie=["shopgate_order_token_".concat(orderId)];var _useCookies=useCookies([orderTokenCookie]),_useCookies2=_slicedToArray(_useCookies,2),cookies=_useCookies2[0],setCookie=_useCookies2[1];var orderToken=cookies[orderTokenCookie];// Form visibility useEffect(function(){if(isUserLoggedIn){setShowForm(errorMessage);}else{setShowForm(!order&&!orderToken||errorMessage);}},[errorMessage,isUserLoggedIn,order,orderToken]);var handleRequest=useCallback(/*#__PURE__*/function(){var _ref2=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(email,phone,token){var message,response,code;return _regeneratorRuntime.wrap(function _callee$(_context){while(1)switch(_context.prev=_context.next){case 0:setIsLoading(true);_context.prev=1;_context.next=4;return fetchOrderDetails(orderId,{email:email,phone:phone,token:token});case 4:response=_context.sent;if(response.token&&response.tokenExpires){setCookie(orderTokenCookie,response.token,{expires:new Date(response.tokenExpires)});}setErrorMessage('');_context.next=13;break;case 9:_context.prev=9;_context.t0=_context["catch"](1);code=_context.t0.code;if(code===EUNAUTHORIZED){message='order_details.errors.authorize';}else if(code===EAUTHENTICATION){message='order_details.errors.authenticate';}else if(code===ENOTFOUND){message='order_details.errors.not_found';}case 13:if(message){setErrorMessage(i18n.text(message));}setIsLoading(false);case 15:case"end":return _context.stop();}},_callee,null,[[1,9]]);}));return function(_x,_x2,_x3){return _ref2.apply(this,arguments);};}(),[fetchOrderDetails,orderTokenCookie,orderId,setCookie]);var handleCancel=useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(){var message,code;return _regeneratorRuntime.wrap(function _callee2$(_context2){while(1)switch(_context2.prev=_context2.next){case 0:setIsLoading(true);_context2.prev=1;_context2.next=4;return cancelOrder(orderId,orderToken);case 4:setErrorMessage('');_context2.next=11;break;case 7:_context2.prev=7;_context2.t0=_context2["catch"](1);code=_context2.t0.code;if(code===EAUTHENTICATION){message='order_details.errors.expired';}else if(code===ENOTFOUND){message='order_details.errors.not_found';}case 11:if(message){setErrorMessage(i18n.text(message));}setIsLoading(false);case 13:case"end":return _context2.stop();}},_callee2,null,[[1,7]]);})),[cancelOrder,orderId,orderToken]);// Loading state useEffect(function(){if(isLoading){LoadingProvider.setLoading(pathname);return;}LoadingProvider.unsetLoading(pathname);},[isLoading,pathname]);useEffect(function(){if(!isUserLoggedIn&&!orderToken){return;}_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3(){return _regeneratorRuntime.wrap(function _callee3$(_context3){while(1)switch(_context3.prev=_context3.next){case 0:_context3.next=2;return handleRequest(undefined,undefined,!isUserLoggedIn?orderToken:undefined);case 2:case"end":return _context3.stop();}},_callee3);}))();/* eslint-disable react-hooks/exhaustive-deps */},[]);/* eslint-enable react-hooks/exhaustive-deps */var authenticateFormState={valid:false,values:[]};// Authentication form var handleAuthenticateFormSubmit=useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(){var _authenticateFormStat,email,phone;return _regeneratorRuntime.wrap(function _callee4$(_context4){while(1)switch(_context4.prev=_context4.next){case 0:if(authenticateFormState.valid){_context4.next=2;break;}return _context4.abrupt("return");case 2:_authenticateFormStat=authenticateFormState.values,email=_authenticateFormStat.email,phone=_authenticateFormStat.phone;_context4.next=5;return handleRequest(email,phone);case 5:case"end":return _context4.stop();}},_callee4);})),[authenticateFormState.valid,authenticateFormState.values,handleRequest]);authenticateFormState=useFormState(defaultFormState,handleAuthenticateFormSubmit,authenticateConstraints);var handleSubmit=useCallback(function(){authenticateFormState.handleSubmit(new Event('submit'));},[authenticateFormState]);var value=useMemo(function(){return{isUserLoggedIn:isUserLoggedIn,order:order,handleSubmit:handleSubmit,isLoading:isLoading,showForm:showForm,supportedCountries:shopSettings.supportedCountries,countrySortOrder:shopSettings.countrySortOrder,validationErrors:convertValidationErrors(authenticateFormState.validationErrors||{}),updateForm:authenticateFormState.setValues,defaultFormState:defaultFormState,userLocation:userLocation,fetchOrderDetails:fetchOrderDetails,cancelOrder:handleCancel,errorMessage:errorMessage};},[authenticateFormState.setValues,authenticateFormState.validationErrors,fetchOrderDetails,handleCancel,handleSubmit,isUserLoggedIn,showForm,isLoading,order,shopSettings.supportedCountries,shopSettings.countrySortOrder,userLocation,errorMessage]);return React.createElement(Context.Provider,{value:value},children);};OrderDetailsProvider.defaultProps={children:null,shopSettings:null,userLocation:null,order:null,orderId:null};export default connect(OrderDetailsProvider);