Skip to content

Prepare for deferred confirm #252

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
elia wants to merge 9 commits into from
Closed

Prepare for deferred confirm #252

Changes from 1 commit
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
8b83f87
Autocreate the sandbox before starting bin/dev
elia Mar 23, 2023
d22673a
Fix migrations updater timestamp and order
elia Mar 23, 2023
a717e97
Don't break the obfuscated card number line
elia Mar 27, 2023
1b302eb
Rely on the payment method's auto capture settings
elia Mar 27, 2023
0c1e36a
Silence rubocop on multiline ternary operators
elia Mar 27, 2023
68b6ffa
Use `@stripe/stripe-js` as a module with importmap
rainerdema Mar 28, 2023
d73896c
Include Stripe custom partial payment info
elia Mar 27, 2023
950e678
Ensure it's the right form when handling the payment submit
elia Mar 28, 2023
b401f6b
Don't try to update migrations on the CI
elia Mar 28, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 15 additions & 12 deletions ...s_stripe/install/templates/app/javascript/controllers/solidus_stripe_intent_controller.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Controller } from '@hotwired/stimulus'
import { loadStripe } from '@stripe/stripe-js'
import { Controller } from "@hotwired/stimulus"
import { loadStripe } from "@stripe/stripe-js"

export default class extends Controller {
static values = {
Expand All @@ -15,7 +15,7 @@ export default class extends Controller {
radioSelector: String,
}

static targets = ['paymentElement', 'message']
static targets = ["paymentElement", "message"]

get submitOutletElement() {
return document.querySelector(this.submitSelectorValue)
Expand All @@ -32,6 +32,9 @@ export default class extends Controller {

// @action
async handleSubmit(e) {
// Bail out if not on the payment method form.
if (e.target !== this.radioOutletElement.form) return
Comment thread
waiting-for-dev marked this conversation as resolved.

// Bail out if the current payment method is not selected.
if (!this.radioOutletElement.checked) return

Expand All @@ -41,10 +44,10 @@ export default class extends Controller {

const { error } = await this.confirmIntent()

if (error.type === 'card_error' || error.type === 'validation_error') {
if (error.type === "card_error" || error.type === "validation_error") {
this.messageTarget.textContent = error.message
} else {
this.messageTarget.textContent = 'An unexpected error occurred.'
this.messageTarget.textContent = "An unexpected error occurred."
}

this.setLoading(false)
Expand All @@ -53,8 +56,8 @@ export default class extends Controller {
confirmIntent() {
let confirmMethod

if (this.flowValue === 'payment') confirmMethod = 'confirmPayment'
if (this.flowValue === 'setup') confirmMethod = 'confirmSetup'
if (this.flowValue === "payment") confirmMethod = "confirmPayment"
if (this.flowValue === "setup") confirmMethod = "confirmSetup"

if (!this.flowValue)
throw new Error("flowValue should be either 'payment' or 'setup'.")
Expand All @@ -69,21 +72,21 @@ export default class extends Controller {

setupPaymentElement() {
this.elements = this.stripe.elements({
appearance: { theme: 'stripe' },
appearance: { theme: "stripe" },
clientSecret: this.clientSecretValue,
})
this.paymentElement = this.elements.create('payment', { layout: 'tabs' })
this.paymentElementTarget.innerHTML = '' // Remove child nodes used for loading
this.paymentElement = this.elements.create("payment", { layout: "tabs" })
this.paymentElementTarget.innerHTML = "" // Remove child nodes used for loading
this.paymentElement.mount(this.paymentElementTarget)
}

setLoading(isLoading) {
const element = this.submitOutletElement

if (isLoading) {
element.setAttribute('disabled', '')
element.setAttribute("disabled", "")
} else {
element.removeAttribute('disabled')
element.removeAttribute("disabled")
}
}
}