https://www.mrhandyman.com/brand/_assets/js/scheduler/PaymentPage.53bd193ead40fbcb7e69.js

1"use strict";(self.webpackChunk_leadflow_mrh=self.webpackChunk_leadflow_mrh||[]).push([[192],{72050:function(n,e,a){var i=a(82001),r=a.n(i),o=a(40935),t=a.n(o)()(r());t.push([n.id,".payment-api-iframe-container {\n  width: 100%;\n  min-height: 500px;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.payment-iframe-wrapper {\n  flex: 1;\n  position: relative;\n  min-height: 500px;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  overflow: hidden;\n  background-color: #fafafa;\n}\n\n.payment-api-iframe {\n  width: 100%;\n  height: 100%;\n  min-height: 500px;\n  border: none;\n  transition: opacity 0.3s ease;\n  display: block;\n}\n\n.payment-api-iframe.loading {\n  opacity: 0.5;\n  pointer-events: none;\n}\n\n.payment-api-iframe.loaded {\n  opacity: 1;\n}\n\n.iframe-loader-overlay {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 10;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  background-color: rgba(255, 255, 255, 0.9);\n  padding: 20px;\n  border-radius: 8px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n}\n\n.payment-info {\n  padding: 8px 16px;\n  background-color: #f5f5f5;\n  border-top: 1px solid #e0e0e0;\n  text-align: center;\n}\n\n@media (max-width: 768px) {\n  .payment-api-iframe-container {\n    min-height: 100vh;\n    min-height: -webkit-fill-available;\n  }\n\n  .payment-iframe-wrapper {\n    min-height: 600px;\n    border-radius: 0;\n    border: none;\n  }\n\n  .payment-api-iframe {\n    min-height: 600px;\n    width: 100%;\n    -webkit-overflow-scrolling: touch;\n  }\n\n  .iframe-loader-overlay {\n    padding: 16px;\n  }\n}\n\n/* Loading animation */\n@keyframes pulse {\n  0% {\n    opacity: 0.6;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.6;\n  }\n}\n\n.iframe-loader-overlay {\n  animation: pulse 2s ease-in-out infinite;\n}\n","",{version:3,sources:["webpack://./../shared/src/feature/paymentIframe/components/PaymentApiIframePage.css"],names:[],mappings:"AAAA;EACE,WAAW;EACX,iBAAiB;EACjB,aAAa;EACb,sBAAsB;EACtB,kBAAkB;AACpB;;AAEA;EACE,OAAO;EACP,kBAAkB;EAClB,iBAAiB;EACjB,yBAAyB;EACzB,kBAAkB;EAClB,gBAAgB;EAChB,yBAAyB;AAC3B;;AAEA;EACE,WAAW;EACX,YAAY;EACZ,iBAAiB;EACjB,YAAY;EACZ,6BAA6B;EAC7B,cAAc;AAChB;;AAEA;EACE,YAAY;EACZ,oBAAoB;AACtB;;AAEA;EACE,UAAU;AACZ;;AAEA;EACE,kBAAkB;EAClB,QAAQ;EACR,SAAS;EACT,gCAAgC;EAChC,WAAW;EACX,aAAa;EACb,sBAAsB;EACtB,mBAAmB;EACnB,0CAA0C;EAC1C,aAAa;EACb,kBAAkB;EAClB,wCAAwC;AAC1C;;AAEA;EACE,iBAAiB;EACjB,yBAAyB;EACzB,6BAA6B;EAC7B,kBAAkB;AACpB;;AAEA;EACE;IACE,iBAAiB;IACjB,kCAAkC;EACpC;;EAEA;IACE,iBAAiB;IACjB,gBAAgB;IAChB,YAAY;EACd;;EAEA;IACE,iBAAiB;IACjB,WAAW;IACX,iCAAiC;EACnC;;EAEA;IACE,aAAa;EACf;AACF;;AAEA,sBAAsB;AACtB;EACE;IACE,YAAY;EACd;EACA;IACE,UAAU;EACZ;EACA;IACE,YAAY;EACd;AACF;;AAEA;EACE,wCAAwC;AAC1C",sourcesContent:[".payment-api-iframe-container {\n  width: 100%;\n  min-height: 500px;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n\n.payment-iframe-wrapper {\n  flex: 1;\n  position: relative;\n  min-height: 500px;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  overflow: hidden;\n  background-color: #fafafa;\n}\n\n.payment-api-iframe {\n  width: 100%;\n  height: 100%;\n  min-height: 500px;\n  border: none;\n  transition: opacity 0.3s ease;\n  display: block;\n}\n\n.payment-api-iframe.loading {\n  opacity: 0.5;\n  pointer-events: none;\n}\n\n.payment-api-iframe.loaded {\n  opacity: 1;\n}\n\n.iframe-loader-overlay {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 10;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  background-color: rgba(255, 255, 255, 0.9);\n  padding: 20px;\n  border-radius: 8px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n}\n\n.payment-info {\n  padding: 8px 16px;\n  background-color: #f5f5f5;\n  border-top: 1px solid #e0e0e0;\n  text-align: center;\n}\n\n@media (max-width: 768px) {\n  .payment-api-iframe-container {\n    min-height: 100vh;\n    min-height: -webkit-fill-available;\n  }\n\n  .payment-iframe-wrapper {\n    min-height: 600px;\n    border-radius: 0;\n    border: none;\n  }\n\n  .payment-api-iframe {\n    min-height: 600px;\n    width: 100%;\n    -webkit-overflow-scrolling: touch;\n  }\n\n  .iframe-loader-overlay {\n    padding: 16px;\n  }\n}\n\n/* Loading animation */\n@keyframes pulse {\n  0% {\n    opacity: 0.6;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0.6;\n  }\n}\n\n.iframe-loader-overlay {\n  animation: pulse 2s ease-in-out infinite;\n}\n"],sourceRoot:""}]),e.A=t},17850:function(n,e,a){var i=a(82001),r=a.n(i),o=a(40935),t=a.n(o)()(r());t.push([n.id,'.payment-iframe {\n  width: 50%;\n  height: 480px;\n  margin: 0 auto;\n  border: none;\n  display: block;\n}\n\n.payment-disclaimer {\n  margin-top: 5px;\n  text-align: center;\n}\n\n.payment-disclaimer-text {\n  color: #6b7280;\n  font-family: "inter", system-ui, Avenir, Helvetica, Arial, sans-serif;\n  font-size: 1.2rem;\n  font-weight: 350;\n}\n\n@media screen and (max-width: 768px) {\n  .payment-iframe {\n    width: 100%;\n  }\n  .payment-disclaimer-text {\n    font-size: 1rem;\n  }\n}\n',"",{version:3,sources:["webpack://./../shared/src/feature/paymentIframe/components/PaymentIframePage.css"],names:[],mappings:"AAAA;EACE,UAAU;EACV,aAAa;EACb,cAAc;EACd,YAAY;EACZ,cAAc;AAChB;;AAEA;EACE,eAAe;EACf,kBAAkB;AACpB;;AAEA;EACE,cAAc;EACd,qEAAqE;EACrE,iBAAiB;EACjB,gBAAgB;AAClB;;AAEA;EACE;IACE,WAAW;EACb;EACA;IACE,eAAe;EACjB;AACF",sourcesContent:['.payment-iframe {\n  width: 50%;\n  height: 480px;\n  margin: 0 auto;\n  border: none;\n  display: block;\n}\n\n.payment-disclaimer {\n  margin-top: 5px;\n  text-align: center;\n}\n\n.payment-disclaimer-text {\n  color: #6b7280;\n  font-family: "inter", system-ui, Avenir, Helvetica, Arial, sans-serif;\n  font-size: 1.2rem;\n  font-weight: 350;\n}\n\n@media screen and (max-width: 768px) {\n  .payment-iframe {\n    width: 100%;\n  }\n  .payment-disclaimer-text {\n    font-size: 1rem;\n  }\n}\n'],sourceRoot:""}]),e.A=t},23271:function(n,e,a){a.r(e),a.d(e,{default:function(){return W}});var i=a(10385),r=a(23269),o=a(39279),t=a(1525),l=a(23630),A=a(47566),d=a(65990),s=a(38243),c=a(68765),m=a(53658),p=a(72591),f=a.n(p),u=a(1740),C=a.n(u),y=a(88128),h=a.n(y),E=a(30855),g=a.n(E),v=a(93051),B=a.n(v),b=a(73656),x=a.n(b),w=a(72050),k={};k.styleTagTransform=x(),k.setAttributes=g(),k.insert=h().bind(null,"head"),k.domAPI=C(),k.insertStyleElement=B(),f()(w.A,k),w.A&&w.A.locals&&w.A.locals;

1var I=a(32639),Y=a(51382),P=a(77892),U=a(62526),F=a(69710),N=a(54184),T=({paymentFailureMessage:n,paymentBtnLabel:e})=>{const{formConfig:a}=(0,c.Hk)();return(0,i.FD)(P.A,{"aria-labelledby":"customized-dialog-title",open:!0,"data-testid":"error-modal",children:[(0,i.Y)(U.A,{className:"payement-error-content",children:(0,i.Y)(d.A,{className:"error-pricing-text",align:"center","data-testid":"error-modal-text",children:n})}),(0,i.Y)(F.A,{className:"payment-error-actions",sx:{justifyContent:"center"},children:(0,i.Y)(N.A,{autoFocus:!0,className:"payment-error-btn","data-testid":"close-button",onClick:()=>{(0,m.A)()?globalThis.location.replace(`${null==a?void 0:a.redirectionPageUrl}?leadconcept=${null==a?void 0:a.conceptCode}`):globalThis.location.replace(null==a?void 0:a.redirectionPageUrl)},children:e})})]})},S=({config:n})=>{const{loading:e,error:a,response:r,makePaymentRequest:p}=(()=>{const[n,e]=(0,t.useState)(!1),[a,i]=(0,t.useState)(null),[r,o]=(0,t.useState)(null),{formConfig:l}=(0,c.Hk)(),A=s.Ay.realGreenApi,d=(0,t.useCallback)((n=>{if(!(null==n?void 0:n.data))return;const{response:e}=n.data;if(e)if(globalThis.onbeforeunload=null,!1!==(null==e?void 0:e.Success)||"IFrame Closed"!==(null==e?void 0:e.Message)){if((null==e?void 0:e.Model)&&!0===(null==e?void 0:e.Success)){if((0,m.A)())return void globalThis.location.replace(`${null==l?void 0:l.redirectionPageUrl}?leadconcept=${null==l?void 0:l.conceptCode}`);globalThis.location.replace(null==l?void 0:l.redirectionPageUrl)}}else i((null==e?void 0:e.Message)||"Payment failed")}),[]);window.addEventListener("message",d);const p=(0,t.useCallback)((n=>{return a=void 0,r=void 0,d=function*(){var a;e(!0),i(null),o(null);try{const e=yield fetch(A,{method:"POST",headers:{"Content-Type":"application/json",apiKey:s.NX.prod},body:JSON.stringify(n)});if(!e.ok)throw new Error(`HTTP error! status: ${e.status}`);const i=yield e.json(),{result:r}=i;if(null===(a=null==r?void 0:r.cardOnFile)||void 0===a?void 0:a.newCardOnFileUrl)return void o({iframeUrl:r.cardOnFile.newCardOnFileUrl,success:!0})}catch(n){const e=n instanceof Error?null==n?void 0:n.message:"Unknown error occurred";if(console.error("Payment API call failed:",e),i(null),o(null),(0,m.A)())return void globalThis.location.replace(`${null==l?void 0:l.redirectionPageUrl}?leadconcept=${l.conceptCode}`);globalThis.location.replace((null==l?void 0:l.redirectionPageUrl)||"/confirmation")}finally{e(!1)}},new((t=void 0)||(t=Promise))((function(n,e){function i(n){try{l(d.next(n))}catch(n){e(n)}}function o(n){try{l(d.throw(n))}catch(n){e(n)}}function l(e){var a;e.done?n(e.value):(a=e.value,a instanceof t?a:new t((function(n){n(a)}))).then(i,o)}l((d=d.apply(a,r||[])).next())}));var a,r,t,d}),[]);return{loading:n,error:a,response:r,makePaymentRequest:p}})(),{formValues:f}=(0,I.xW)(),{formConfig:u}=(0,c.Hk)(),{iframeRef:C,iframeLoading:y,handleIframeLoad:h,handleIframeError:E}=(()=>{const n=(0,t.useRef)(null),[e,a]=(0,t.useState)(!0),[i,r]=(0,t.useState)(!1);return{iframeRef:n,iframeLoading:e,iframeError:i,handleIframeLoad:(0,t.useCallback)((()=>{console.log("Payment iframe loaded successfully"),a(!1),r(!1)}),[]),handleIframeError:(0,t.useCallback)((()=>{console.error("Payment iframe failed to load"),a(!1),r(!0)}),[]),resetIframeState:(0,t.useCallback)((()=>{a(!0),r(!1)}),[])}})();return(0,t.useEffect)((()=>{p({conceptId:(null==u?void 0:u.conceptid)||"",vendorId:(null==u?void 0:u.conceptCode)||"",CustomerNumber:null==f?void 0:f.customerNumber})}),[p]),(0,t.useEffect)((()=>{Y.ZK.setItem(o.uC,JSON.stringify(f))}),[f]),(0,t.useEffect)((()=>{if("IFrame Closed"===a){if((0,m.A)())return void globalThis.location.replace(`${null==u?void 0:u.redirectionPageUrl}?leadconcept=${u.conceptCode}`);globalThis.location.replace((null==u?void 0:u.redirectionPageUrl)||"/confirmation")}}),[a,u]),e?(0,i.Y)("div",{className:"payment-api-iframe-container",children:(0,i.Y)(l.A,{display:"flex",flexDirection:"column",alignItems:"center",p:4,children:(0,i.Y)(A.A,{size:60})})}):(null==r?void 0:r.success)&&r.iframeUrl?(0,i.FD)(i.FK,{children:[(0,i.Y)("div",{className:"payment-api-iframe-container",children:(0,i.FD)("div",{className:"payment-iframe-wrapper",children:[y&&(0,i.FD)("div",{className:"iframe-loader-overlay",children:[(0,i.Y)(A.A,{}),(0,i.Y)(d.A,{variant:"body2",sx:{mt:1},children:"Loading payment form..."})]}),(0,i.Y)("iframe",{id:"payment-iframe",ref:C,className:"payment-api-iframe "+(y?"loading":"loaded"),title:"Payment Form",src:r.iframeUrl,onLoad:h,onError:E,sandbox:"allow-forms allow-scripts allow-same-origin allow-top-navigation allow-popups allow-popups-to-escape-sandbox","data-testid":"payment-iframe",allow:"payment"})]})}),"Payment failed"===a&&(0,i.Y)(T,{paymentFailureMessage:null==n?void 0:n.paymentFailureMessage,paymentBtnLabel:null==n?void 0:n.paymentBtnLabel})]}):null},j=a(17850),L={};L.styleTagTransform=x(),L.setAttributes=g(),L.insert=h().bind(null,"head"),L.domAPI=C(),L.insertStyleElement=B(),f()(j.A,L),j.A&&j.A.locals&&j.A.locals;var z=({config:n})=>{var e;const{formValues:a}=(0,I.xW)(),{iframeRef:r,handleIframeLoad:o}=(()=>{const n=(0,t.useRef)(null);return{iframeRef:n,handleIframeLoad:()=>{setTimeout((()=>{const e=n.current;e&&e.scrollIntoView({behavior:"smooth",block:"center"})}),100)}}})(),[l,d]=(0,t.useState)(!0),s=null==n?void 0:n.preAuthAmount,c=(null==a?void 0:a.jkcode)&&`${null==n?void 0:n.paymentUrl}?jkno=${a.jkcode}`,{preauthorizationAmount:m,preauthorizationEnabled:p}=a;let f="";return f=p?null===(e=null==s?void 0:s.disclaimer)||void 0===e?void 0:e.replace("{fee}",m):null==s?void 0:s.defaultDisclaimer,(0,i.FD)("div",{className:"payment-iframe-container",children:[(0,i.FD)("div",{className:"payment-iframe-wrapper",children:[l&&(0,i.Y)("div",{className:"loader-wrapper",children:(0,i.Y)(A.A,{})}),(0,i.Y)("iframe",{className:"payment-iframe "+(l?"loading":"loaded"),title:"Payment Iframe",id:"customer-payment-iframe",src:c,onLoad:()=>{d(!1),o()},onError:()=>{console.error("Iframe failed to load"),d(!1)},"data-testid":"payment-iframe",ref:r})]}),(0,i.Y)("div",{className:"payment-disclaimer","data-testid":"payment-disclaimer",children:(0,i.Y)("span",{className:"payment-disclaimer-text",children:f})})]})},W=({config:n})=>(null==n?void 0:n.paymentAPI)?(0,r.n)((0,i.Y)(S,{config:n}),o.Jz):(null==n?void 0:n.paymentUrl)?(0,r.n)((0,i.Y)(z,{config:n}),o.Jz):null}}]);
2//# sourceMappingURL=PaymentPage.53bd193ead40fbcb7e69.js.map