JezK

Edit File: sc-subscription-next-payment2.js.map

{"file":"sc-subscription-next-payment2.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gPA6GiB,UAAE;;;;;;;;;;;yEAsCqB,UAAE,uPAMA,UAAE,uQAOF,UAAE,iqBAkBF,UAAE,uSAOF,UAAE,gXAQA,UAAE,qlCA2BJ,UAAE;;;;;6CAmBvB,UAAE,qJAOW,UAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/controllers/dashboard/subscription-details/sc-subscription-next-payment.tsx"],"sourcesContent":["import { Component, Fragment, h, Prop, State, Host, Watch } from '@stencil/core';\nimport { __ } from '@wordpress/i18n';\nimport { addQueryArgs } from '@wordpress/url';\nimport apiFetch from '../../../../functions/fetch';\nimport { formatTaxDisplay } from '../../../../functions/tax';\nimport { groupBundleLineItems } from '../../../../functions/line-items';\nimport { Checkout, LineItem, Period, Product, ResponseError, Subscription, ManualPaymentMethod } from '../../../../types';\n\n@Component({\n tag: 'sc-subscription-next-payment',\n shadow: true,\n})\nexport class ScSubscriptionNextPayment {\n @Prop() subscription: Subscription;\n /** Update the payment method url */\n @Prop() updatePaymentMethodUrl: string;\n\n @State() period: Period;\n @State() loading: boolean = true;\n @State() error: ResponseError;\n @State() details: boolean;\n\n componentWillLoad() {\n this.fetch();\n }\n\n @Watch('subscription')\n handleSubscriptionChange() {\n this.fetch();\n }\n\n async fetch() {\n if (this.subscription?.cancel_at_period_end && this.subscription.current_period_end_at) {\n this.loading = false;\n return;\n }\n if (this.subscription?.status === 'canceled') {\n this.loading = false;\n return;\n }\n try {\n this.loading = true;\n this.period = (await apiFetch({\n method: 'PATCH',\n path: addQueryArgs(`surecart/v1/subscriptions/${this.subscription?.id}/upcoming_period`, {\n skip_product_group_validation: true,\n expand: [\n 'period.checkout',\n 'checkout.line_items',\n 'checkout.checkout_fees',\n 'checkout.shipping_fees',\n 'checkout.payment_method',\n 'checkout.manual_payment_method',\n 'payment_method.card',\n 'payment_method.payment_instrument',\n 'payment_method.paypal_account',\n 'payment_method.bank_account',\n 'line_item.price',\n 'line_item.fees',\n 'line_item.component_line_items',\n 'price.product',\n 'period.subscription',\n ],\n }),\n data: {\n purge_pending_update: false,\n },\n })) as Period;\n } catch (e) {\n console.error(e);\n this.error = e;\n } finally {\n this.loading = false;\n }\n }\n\n render() {\n if (this.loading) {\n return (\n <sc-toggle borderless disabled>\n <sc-flex slot=\"summary\" flexDirection=\"column\">\n <sc-skeleton style={{ width: '200px' }}></sc-skeleton>\n <sc-skeleton style={{ width: '400px' }}></sc-skeleton>\n <sc-skeleton style={{ width: '300px' }}></sc-skeleton>\n </sc-flex>\n </sc-toggle>\n );\n }\n\n const checkout = this?.period?.checkout as Checkout;\n if (!checkout)\n return (\n <div style={{ padding: 'var(--sc-spacing-medium)' }}>\n <sc-subscription-details slot=\"summary\" subscription={this.subscription}></sc-subscription-details>\n </div>\n );\n\n const manualPaymentMethod = checkout?.manual_payment ? (checkout?.manual_payment_method as ManualPaymentMethod) : null;\n const paymentMethodExists = this?.subscription.payment_method || this?.subscription.manual_payment;\n\n const checkout_fees = checkout?.checkout_fees?.data;\n const shipping_fees = checkout?.shipping_fees?.data;\n\n return (\n <Host>\n <sc-toggle borderless shady>\n \n <sc-subscription-details subscription={this.subscription}>\n <div style={{ fontSize: 'var(--sc-font-size-small)' }}>\n {__('Your next payment is', 'surecart')} {checkout?.amount_due_display_amount}{' '}\n {!!this.subscription?.remaining_period_text && `— ${this.subscription?.remaining_period_text}`}\n </div>\n </sc-subscription-details>\n \n\n <sc-card noPadding borderless>\n {(() => {\n const items = (checkout?.line_items?.data || []) as LineItem[];\n const { regular, bundleParents, componentsByParent } = groupBundleLineItems(items);\n const orderedItems = [...bundleParents, ...regular];\n return orderedItems.map(item => {\n const product = item?.price?.product as Product;\n const isBundle = !!product?.bundle;\n return (\n <sc-product-line-item\n key={item.id}\n image={product?.line_item_image}\n name={product?.name}\n price={item?.price?.name}\n variant={item?.variant_display_options}\n editable={false}\n removable={false}\n note={item?.display_note}\n scratchDisplayAmount={item?.scratch_display_amount}\n displayAmount={item?.subtotal_display_amount}\n quantity={item?.quantity}\n amount={item?.subtotal_display_amount}\n interval={`${item?.price?.short_interval_text} ${item?.price?.short_interval_count_text}`}\n purchasableStatus={item?.purchasable_status_display}\n fees={item?.fees?.data}\n bundleComponents={isBundle ? componentsByParent[item.id] || [] : []}\n ></sc-product-line-item>\n );\n });\n })()}\n\n <sc-line-item>\n {__('Subtotal', 'surecart')}\n {checkout?.subtotal_display_amount}\n </sc-line-item>\n\n {!!checkout.proration_amount && (\n <sc-line-item>\n {__('Proration Credit', 'surecart')}\n {checkout?.proration_display_amount}\n </sc-line-item>\n )}\n\n {!!checkout.applied_balance_amount && (\n <sc-line-item>\n {__('Applied Balance', 'surecart')}\n {checkout?.applied_balance_display_amount}\n </sc-line-item>\n )}\n\n {checkout_fees?.length > 0 && (\n <Fragment>\n {checkout_fees?.map(fee => (\n <sc-line-item>\n {fee?.description}\n {fee?.display_amount}\n </sc-line-item>\n ))}\n </Fragment>\n )}\n\n {!!checkout.trial_amount && (\n <sc-line-item>\n {__('Trial', 'surecart')}\n {checkout?.trial_display_amount}\n </sc-line-item>\n )}\n\n {!!checkout?.discount_amount && (\n <sc-line-item>\n {__('Discounts', 'surecart')}\n {checkout?.discounts_display_amount}\n </sc-line-item>\n )}\n\n {!!checkout?.shipping_amount && (\n <Fragment>\n <sc-line-item style={{ marginTop: 'var(--sc-spacing-small)' }}>\n {__('Shipping', 'surecart')}\n {checkout?.shipping_display_amount}\n </sc-line-item>\n {shipping_fees?.length > 0 && (\n <Fragment>\n {shipping_fees?.map(fee => (\n <sc-line-item>\n {fee?.description}\n {fee?.display_amount}\n </sc-line-item>\n ))}\n </Fragment>\n )}\n </Fragment>\n )}\n\n {!!checkout.tax_amount && (\n <sc-line-item>\n {formatTaxDisplay(checkout?.tax_label)}\n {checkout?.tax_display_amount}\n </sc-line-item>\n )}\n\n <sc-divider style={{ '--spacing': '0' }}></sc-divider>\n\n {this?.subscription?.can_modify && (\n <sc-line-item>\n {__('Payment', 'surecart')}\n {paymentMethodExists && (\n <a href={this.updatePaymentMethodUrl} slot=\"price-description\">\n <sc-flex justify-content=\"flex-start\" align-items=\"center\" style={{ '--spacing': '0.5em' }}>\n {manualPaymentMethod ? <sc-manual-payment-method paymentMethod={manualPaymentMethod} /> : <sc-payment-method paymentMethod={checkout?.payment_method} />}\n <sc-icon name=\"edit-3\"></sc-icon>\n </sc-flex>\n </a>\n )}\n {!paymentMethodExists && (\n <a\n href={addQueryArgs(window.location.href, {\n action: 'create',\n model: 'payment_method',\n id: this?.subscription.id,\n ...(this?.subscription?.live_mode === false ? { live_mode: false } : {}),\n })}\n slot=\"price-description\"\n >\n {__('Add Payment Method', 'surecart')}\n </a>\n )}\n </sc-line-item>\n )}\n\n <sc-line-item style={{ '--price-size': 'var(--sc-font-size-x-large)' }}>\n {__('Total Due', 'surecart')}\n {checkout?.amount_due_display_amount}\n {checkout.currency}\n </sc-line-item>\n </sc-card>\n </sc-toggle>\n </Host>\n );\n }\n}\n"],"version":3}