JezK
Edit File: sc-paystack-add-method.js.map
{"file":"sc-paystack-add-method.js","mappings":";;;;;;;;;AAAA,MAAM,sBAAsB,GAAG,sBAAsB,CAAC;AACtD,kCAAe,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;qCC8CV,eAAO,CAAC,UAAE;;;;;;iFAMP,UAAE;;;;;;;;;;;;;;;;;;;;;;;sPAsBuC,UAAE;;;;;;;iRAWzC,UAAE,2OAMrB,UAAE,ubAME,UAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/ui/sc-paystack-add-method/sc-paystack-add-method.scss?tag=sc-paystack-add-method","src/components/ui/sc-paystack-add-method/sc-paystack-add-method.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","/**\n * WordPress dependencies.\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * External dependencies.\n */\nimport PaystackPop from '@paystack/inline-js';\nimport { Component, h, Host, Prop, State, Watch } from '@stencil/core';\n\n/**\n * Internal dependencies.\n */\nimport apiFetch from '../../../functions/fetch';\nimport { PaymentIntent } from '../../../types';\n\n@Component({\n tag: 'sc-paystack-add-method',\n styleUrl: 'sc-paystack-add-method.scss',\n shadow: false,\n})\nexport class ScPaystackAddMethod {\n @Prop() liveMode: boolean = true;\n @Prop() customerId: string;\n @Prop() successUrl: string;\n @Prop() currency: string;\n\n @State() loading: boolean;\n @State() loaded: boolean;\n @State() error: string;\n @State() paymentIntent: PaymentIntent;\n\n @Watch('paymentIntent')\n async handlePaymentIntentCreate() {\n const { public_key, access_code } = this.paymentIntent?.processor_data?.paystack || {};\n\n // we need this data.\n if (!public_key || !access_code) return;\n\n const paystack = new PaystackPop();\n\n await paystack.newTransaction({\n key: public_key,\n accessCode: access_code, // We'll use accessCode which will handle product, price on our server.\n onSuccess: async transaction => {\n if (transaction?.status !== 'success') {\n throw { message: sprintf(__('Paystack transaction could not be finished. Status: %s', 'surecart'), transaction?.status) };\n }\n window.location.assign(this.successUrl);\n },\n onClose: err => {\n console.error(err);\n alert(err?.message || __('The payment did not process. Please try again.', 'surecart'));\n },\n });\n }\n\n async createPaymentIntent() {\n try {\n this.loading = true;\n this.error = '';\n this.paymentIntent = await apiFetch({\n method: 'POST',\n path: 'surecart/v1/payment_intents',\n data: {\n processor_type: 'paystack',\n reusable: true,\n live_mode: this.liveMode,\n customer_id: this.customerId,\n currency: this.currency,\n refresh_status: true,\n },\n });\n } catch (e) {\n this.error = e?.additional_errors?.[0]?.message || e?.message || __('Something went wrong', 'surecart');\n } finally {\n this.loading = false;\n }\n }\n\n render() {\n return (\n <Host>\n {this.error && (\n <sc-alert open={!!this.error} type=\"danger\">\n <span slot=\"title\">{__('Error', 'surecart')}</span>\n {this.error}\n </sc-alert>\n )}\n <div class=\"sc-paystack-button-container\">\n <sc-alert open={true} type=\"warning\">\n {__(\n 'In order to add a new card, we will need to make a small transaction to authenticate it. This is for authentication purposes and will be immediately refunded.',\n 'surecart',\n )}\n <div>\n <sc-button loading={this.loading} type=\"primary\" onClick={() => this.createPaymentIntent()} style={{ marginTop: 'var(--sc-spacing-medium)' }}>\n {__('Add New Card', 'surecart')}\n </sc-button>\n </div>\n </sc-alert>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}