Hello David,

It seems that session has been successfully created, I provide price id, it goes to the checkout website, but it does not show/fetch the subscription panel, only a very thin form for the card. The page is almost empty... I use .env file for encryption. Still I get the following error: 

Uncaught (in promise) IntegrationError: Invalid value for stripe.confirmCardPayment intent secret: value should be a client secret of the form ${id}_secret_${secret}. You specified: cs_test_b1yKo6ziMTc7Yy2yQOvFx0ERR6rDK9qo38O0ZBBxntKrOMtjbIEQunawW0_secret_fidwbEhqYWAnPydgaGdgYWFgYScpJ2lkfGpwcVF8dWAnPydocGlxbFpscWBoJyknd2BhbHdgZnFKa0ZqaHVpYHFsamsnPydkaXJkfHYneCUl.
    at se (v3/:1:239911)
    at ue (v3/:1:239990)
    at d (v3/:1:587582)
    at v3/:1:430560
    at v3/:1:206869
    at e.<anonymous> (v3/:1:485339)
    at e.confirmCardPayment (v3/:1:115613)
    at extended.connect (application-d503b08834a7bb062943dd1245b4691e917b7849dfbe227ac16fb9b861c0d8cd.js:10663:39)
    at Context.connect (application-d503b08834a7bb062943dd1245b4691e917b7849dfbe227ac16fb9b861c0d8cd.js:5949:23)
    at Module.connectContextForScope (application-d503b08834a7bb062943dd1245b4691e917b7849dfbe227ac16fb9b861c0d8cd.js:6113:13)

application-7fc13708…c7db1713a06.js:6577 
Error connecting controller

TypeError: Cannot read properties of null (reading 'addEventListener')
    at extended.connect (application-7fc13708…1713a06.js:10795:47)
    at Context.connect (application-7fc13708…b1713a06.js:5949:23)
    at Module.connectContextForScope (application-7fc13708…b1713a06.js:6113:13)
    at Router.scopeConnected (application-7fc13708…b1713a06.js:6485:15)
    at ScopeObserver.elementMatchedValue (application-7fc13708…b1713a06.js:6394:21)
    at ValueListObserver.tokenMatched (application-7fc13708…b1713a06.js:5462:21)
    at TokenListObserver.tokenMatched (application-7fc13708…b1713a06.js:5399:19)
    at application-7fc13708…b1713a06.js:5393:36
    at Array.forEach (<anonymous>)
    at TokenListObserver.tokensMatched (application-7fc13708…b1713a06.js:5393:12)



{identifier: 'stripe', controller: extended, element: div}

class CheckoutsController < ApplicationController
  before_action :require_user!
  before_action :check_subscription

  def require_user!
    unless current_user
      flash[:alert] = "Musisz być zalogowany, aby dostać się do tej strony."
      redirect_to root_path
    end
  end

  def show
    customer = current_user.stripe_customer

    payload = {
      customer: customer,
      billing_address_collection: :auto,
      payment_method_types: %w[card],
      allow_promotion_codes: true,
      subscription_data: {
        items: [{ plan: "price_xxxxxxxxx", quantity: 1 }]
      },
      ui_mode: "embedded",
      return_url: CGI.unescape(payments_url(session_id: '{CHECKOUT_SESSION_ID}'))
    }
    @session = Stripe::Checkout::Session.create(payload)
    @stripe_publishable_key = ENV['STRIPE_PUBLISHABLE_KEY']
    current_user.update(stripe_checkout_id: @session.id)
  end

  private

  def check_subscription
    return unless current_user.subscribed?

    redirect_to root_path, notice: "You are already subscribed!"
  end
end

<div data-controller="stripe"
     data-stripe-public-key-value="<%= @stripe_publishable_key %>"
     data-stripe-client-secret-value="<%= @client_secret %>">
</div>

import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="stripe"
export default class extends Controller {
  static values = { publicKey: String, clientSecret: String }
  stripe = Stripe(this.publicKeyValue)

  async connect() {
    this.checkout = await this.stripe.initEmbeddedCheckout({
      clientSecret: this.clientSecretValue
    })
    this.checkout.mount(this.element)
  }

  disconnect() {
    this.checkout.destroy()
  }
}

Stripe.api_key = ENV['STRIPE_SECRET_KEY']
Stripe.api_version =  '2024-04-10'

STRIPE_PUBLISHABLE_KEY = ENV['STRIPE_PUBLISHABLE_KEY']

<div data-controller="stripe"
     data-stripe-public-key-value="<%= @stripe_publishable_key %>"
     data-stripe-session-id-value="<%= @session_id %>">
  <!-- Checkout button that will trigger Stripe Checkout -->
  <button id="checkout-button">Checkout</button>
</div>