fix(keychain): align credits purchase with stripe graphql (#2483)

## Summary
Update the generated keychain payment GraphQL types to match the latest
internal Stripe schema.
Keep credits purchases working by removing the deleted `purchaseType`,
`starterpackId`, and `username` inputs from the credits Stripe and
Layerswap requests.
Move the purchase UI enum out of the generated API types so the credits
purchase routes still compile after the schema change.

## Validation
- `pnpm --filter @cartridge/keychain format:check`
- `pnpm --filter @cartridge/keychain lint`
- `pnpm --filter @cartridge/keychain build`

Author: broody

packages/keychain/src/components/app.tsx

@@ -44,8 +44,7 @@ import { UpdateSessionRoute } from "./UpdateSessionRoute";
 import { Funding } from "./funding";
 import { Deposit } from "./funding/Deposit";
 import { useNavigation } from "@/context";
-import { Purchase } from "./purchase";
-import { PurchaseType } from "@/utils/api";
+import { Purchase, PurchaseType } from "./purchase";
 import { ChooseNetwork } from "./purchasenew/wallet/network";
 import { Claim } from "./purchasenew/claim/claim";
 import { Collections } from "./purchasenew/starterpack/collections";

packages/keychain/src/components/purchase/PurchaseContent.tsx

@@ -1,7 +1,6 @@
-import { PurchaseType } from "@/utils/api";
 import { AmountSelection } from "../funding/AmountSelection";
 import { Balance, BalanceType } from "./Balance";
-import { PurchaseState } from "./types";
+import { PurchaseState, PurchaseType } from "./types";
 
 export type PurchaseContentProps = {
   state: PurchaseState;

packages/keychain/src/components/purchase/index.tsx

@@ -13,13 +13,12 @@ import { Elements } from "@stripe/react-stripe-js";
 import { type Appearance } from "@stripe/stripe-js";
 import { useMemo } from "react";
 import CheckoutForm from "./StripeCheckout";
-import { PurchaseType } from "@/utils/api";
 import { PaymentMethod } from "./PaymentMethod";
 import { PurchaseContent } from "./PurchaseContent";
 import { usePurchase } from "@/hooks/purchase";
-import { PurchaseState, PurchaseCreditsProps } from "./types";
+import { PurchaseState, PurchaseCreditsProps, PurchaseType } from "./types";
 
-export { PurchaseState } from "./types";
+export { PurchaseState, PurchaseType } from "./types";
 export type {
   PurchaseCreditsProps,
   PricingDetails,

packages/keychain/src/components/purchase/types.ts

@@ -1,6 +1,10 @@
 import { StarterpackDetails } from "@/context";
 import { ExternalWallet } from "@cartridge/controller";
-import { PurchaseType } from "@/utils/api";
+
+export enum PurchaseType {
+  Credits = "CREDITS",
+  Starterpack = "STARTERPACK",
+}
 
 export enum PurchaseState {
   SELECTION = 0,

packages/keychain/src/components/slot/fund.tsx

@@ -1,8 +1,7 @@
 import { useEffect, useState, useMemo } from "react";
 import { useLocation } from "react-router-dom";
 import { useTeamsQuery } from "@cartridge/ui/utils/api/cartridge";
-import { Purchase } from "../purchase";
-import { PurchaseType } from "@/utils/api";
+import { Purchase, PurchaseType } from "../purchase";
 import {
   Button,
   Card,

packages/keychain/src/context/starterpack/credit-purchase.tsx

@@ -74,7 +74,6 @@ export const CreditPurchaseProvider = ({
     try {
       const paymentIntent = await createPaymentIntent(
         usdToCredits(usdAmount),
-        controller.username(),
         undefined,
         typeof starterpackId === "string" ? starterpackId : undefined,
       );

packages/keychain/src/hooks/payments/stripe.ts

@@ -6,7 +6,6 @@ import { client } from "@/utils/graphql";
 import {
   CreateStripePaymentIntentDocument,
   CreateStripePaymentIntentMutation,
-  PurchaseType,
   StripePaymentDocument,
   StripePaymentQuery,
 } from "@/utils/api";
@@ -50,12 +49,9 @@ const useStripePayment = ({ isSlot }: { isSlot?: boolean }) => {
   );
 
   const createPaymentIntent = useCallback(
-    async (
-      wholeCredits: number,
-      username: string,
-      teamId?: string,
-      starterpackId?: string,
-    ) => {
+    async (wholeCredits: number, teamId?: string, _starterpackId?: string) => {
+      void _starterpackId;
+
       if (!controller) {
         throw new Error("Controller not connected");
       }
@@ -67,16 +63,11 @@ const useStripePayment = ({ isSlot }: { isSlot?: boolean }) => {
           CreateStripePaymentIntentDocument,
           {
             input: {
-              username,
               credits: {
                 amount: wholeCredits,
                 decimals: 0,
               },
               teamId,
-              starterpackId,
-              purchaseType: starterpackId
-                ? PurchaseType.Starterpack
-                : PurchaseType.Credits,
               isMainnet: isLiveMode,
             },
           },

packages/keychain/src/hooks/purchase.ts

@@ -62,7 +62,6 @@ export function usePurchase({
     try {
       const paymentIntent = await createPaymentIntent(
         wholeCredits,
-        controller.username(),
         teamId,
         starterpackDetails?.id?.toString(),
       );

packages/keychain/src/utils/api/generated.ts

@@ -1389,11 +1389,9 @@ export type CreateCoinbaseOnrampOrderInput = {
 };
 
 export type CreateCryptoPaymentInput = {
-  credits?: InputMaybe<CreditsInput>;
+  credits: CreditsInput;
   isMainnet?: InputMaybe<Scalars["Boolean"]>;
   network: Network;
-  purchaseType: PurchaseType;
-  starterpackId?: InputMaybe<Scalars["ID"]>;
   teamId?: InputMaybe<Scalars["ID"]>;
   username: Scalars["String"];
 };
@@ -1406,12 +1404,10 @@ export type CreateLayerswapDepositInput = {
 };
 
 export type CreateLayerswapPaymentInput = {
-  credits?: InputMaybe<CreditsInput>;
+  credits: CreditsInput;
   destinationNetwork: LayerswapDestinationNetwork;
   layerswapFees?: InputMaybe<Scalars["BigInt"]>;
-  purchaseType: PurchaseType;
   sourceNetwork: LayerswapSourceNetwork;
-  starterpackId?: InputMaybe<Scalars["ID"]>;
   teamId?: InputMaybe<Scalars["ID"]>;
 };
 
@@ -1468,12 +1464,19 @@ export type CreateServiceInput = {
 };
 
 export type CreateStripePaymentIntentInput = {
-  credits?: InputMaybe<CreditsInput>;
+  credits: CreditsInput;
   isMainnet?: InputMaybe<Scalars["Boolean"]>;
-  purchaseType: PurchaseType;
-  starterpackId?: InputMaybe<Scalars["ID"]>;
   teamId?: InputMaybe<Scalars["ID"]>;
-  username: Scalars["String"];
+};
+
+export type CreateStripeStarterpackIntentInput = {
+  chainId: Scalars["String"];
+  isMainnet?: InputMaybe<Scalars["Boolean"]>;
+  quantity: Scalars["Int"];
+  referral?: InputMaybe<Scalars["String"]>;
+  referralGroup?: InputMaybe<Scalars["String"]>;
+  registryAddress: Scalars["String"];
+  starterpackId: Scalars["String"];
 };
 
 export type CredentialMetadata =
@@ -2976,6 +2979,7 @@ export type Mutation = {
   createRpcCorsDomain: RpcCorsDomain;
   createSession: Scalars["String"];
   createStripePaymentIntent: StripePaymentIntent;
+  createStripeStarterpackIntent: StripePaymentIntent;
   createTeam: Team;
   decreaseBudget: Paymaster;
   deleteDeployment: Scalars["Boolean"];
@@ -3129,6 +3133,10 @@ export type MutationCreateStripePaymentIntentArgs = {
   input: CreateStripePaymentIntentInput;
 };
 
+export type MutationCreateStripeStarterpackIntentArgs = {
+  input: CreateStripeStarterpackIntentInput;
+};
+
 export type MutationCreateTeamArgs = {
   data?: InputMaybe<TeamInput>;
   name: Scalars["String"];
@@ -4416,12 +4424,6 @@ export type ProveVerifyResponse = {
   verified?: Maybe<Scalars["Boolean"]>;
 };
 
-export enum PurchaseType {
-  Credits = "CREDITS",
-  /** @deprecated Starterpack purchases are now handled client-side */
-  Starterpack = "STARTERPACK",
-}
-
 export type Query = {
   __typename?: "Query";
   account?: Maybe<Account>;

packages/keychain/src/utils/payments.ts

@@ -3,7 +3,6 @@ import {
   CreateLayerswapDepositInput,
   CreateLayerswapPaymentInput,
   LayerswapDestinationNetwork,
-  PurchaseType,
 } from "@/utils/api";
 import { mapPlatformToLayerswapSourceNetwork } from "@/hooks/starterpack/layerswap";
 
@@ -37,15 +36,13 @@ export function depositToLayerswapInput(
 /**
  * Converts a credits purchase to a CreateLayerswapPaymentInput object.
  *
- * @param starterpackId An optional starterpack ID.
  * @param platform The source platform for the payment.
  * @param isMainnet Whether the transaction is for mainnet or testnet.
  * @param wholeCredits The amount of credits to purchase.
  * @param teamId An optional team ID.
  * @returns A CreateLayerswapPaymentInput object.
  */
 export function creditsPurchaseToLayerswapInput(
-  starterpackId: string | undefined,
   platform: ExternalPlatform,
   isMainnet: boolean,
   wholeCredits: number,
@@ -62,12 +59,10 @@ export function creditsPurchaseToLayerswapInput(
   return {
     sourceNetwork,
     destinationNetwork,
-    purchaseType: PurchaseType.Credits,
     credits: {
       amount: wholeCredits,
       decimals: 0,
     },
-    starterpackId,
     teamId,
   };
 }