support-frontend/app/views/subscriptionCheckout.scala.html

@import admin.settings.{AllSettings, On}
@import assets.AssetsResolver
@import com.gu.identity.model.{User => IdUser}
@import com.gu.support.config._
@import services.pricing.ProductPrices
@import views.ViewHelpers._
@import com.gu.support.encoding.CustomCodecs._

@import assets.RefPath
@import views.ReactDiv
@import com.gu.support.promotions.PromotionCopy

@import io.circe.JsonObject
@(
  title: String,
  mainElement: ReactDiv,
  js: String,
  css: String,
  csrf: Option[String],
  idUser: Option[IdUser],
  testMode: Boolean,
  productPrices: ProductPrices,
  maybePromotionCopy: Option[PromotionCopy] = None,
  defaultStripeConfig: StripePublicConfig,
  testStripeConfig: StripePublicConfig,
  defaultPayPalConfig: PayPalConfig,
  testPayPalConfig: PayPalConfig,
  v2recaptchaConfigPublicKey: String,
  orderIsAGift: Boolean = false,
  homeDeliveryPostcodes: Option[List[String]] = None,
  productCatalog: JsonObject,
  noIndex: Boolean,
)(implicit assets: AssetsResolver, requestHeader: RequestHeader, settings: AllSettings)

  @main(title = title, mainJsBundle = RefPath(js), mainElement = mainElement, mainStyleBundle = Some(RefPath(css)), csrf = csrf, noindex = noIndex) {
    <script type="text/javascript">
      window.guardian = window.guardian || {};

      window.guardian.productPrices = @{Html(outputJson(productPrices))}

      window.guardian.promotionCopy = @{Html(outputJson(maybePromotionCopy))}

      window.guardian.orderIsAGift = @orderIsAGift

      @idUser.map { user =>
        window.guardian.user = {
          id: "@user.id",
          email: "@user.primaryEmailAddress",
          @user.publicFields.displayName.map { displayName =>
            displayName: "@displayName",
          }
          @for(firstName <- user.privateFields.firstName; lastName <- user.privateFields.secondName) {
            firstName: "@firstName",
            lastName: "@lastName",
          }
          @for(address4 <- user.privateFields.address4) {
            address4: "@address4",
          }
          @for(country <- user.privateFields.country) {
            country: "@country",
          }
        };
      }

      window.guardian.stripeKeyDefaultCurrencies = {
        REGULAR: {
          default: "@defaultStripeConfig.defaultAccount.rawPublicKey",
          test: "@testStripeConfig.defaultAccount.rawPublicKey"
        }
      };
      window.guardian.stripeKeyAustralia = {
        REGULAR: {
          default: "@defaultStripeConfig.australiaAccount.rawPublicKey",
          test: "@testStripeConfig.australiaAccount.rawPublicKey"
        }
      };
      window.guardian.stripeKeyUnitedStates = window.guardian.stripeKeyDefaultCurrencies;
      window.guardian.payPalEnvironment = {
        default: "@defaultPayPalConfig.payPalEnvironment",
        test: "@testPayPalConfig.payPalEnvironment"
      };

      window.guardian.checkoutPostcodeLookup = @settings.switches.subscriptionsSwitches.checkoutPostcodeLookup.contains(On)

      window.guardian.v2recaptchaPublicKey = "@v2recaptchaConfigPublicKey"

      window.guardian.recaptchaEnabled = @settings.switches.recaptchaSwitches.enableRecaptchaFrontend.contains(On)

      window.guardian.isTestUser = @testMode

      window.guardian.productCatalog = @Html(outputJson(productCatalog))

    </script>

    @homeDeliveryPostcodes.map { postcodes =>
      <script type="text/javascript">
        window.guardian.homeDeliveryPostcodes = @Html(outputJson(postcodes))
      </script>
    }

    <script defer id="stripe-js" src="https://js.stripe.com/v3/"></script>
  }