shvz Comments - Answer Overflow

const stripPromise = loadStripe(env.NEXT_PUBLIC_STRIPE_KEY)

export function useBuyCredit() {
  const checkout = api.checkout.createCheckout.useMutation();

  return {
    buyCredits: async (plan: string) => {
      console.log('buyCredits called with plan:', plan);
      const response = await checkout.mutateAsync({ plan: plan });
      const stripe = await stripPromise;
      await stripe?.redirectToCheckout({
        sessionId: response.id,
      })
    },
  };
}

const stripPromise = loadStripe(env.NEXT_PUBLIC_STRIPE_KEY)

export function useBuyCredit() {
  const checkout = api.checkout.createCheckout.useMutation();

  return {
    buyCredits: async (plan: string) => {
      console.log('buyCredits called with plan:', plan);
      const response = await checkout.mutateAsync({ plan: plan });
      const stripe = await stripPromise;
      await stripe?.redirectToCheckout({
        sessionId: response.id,
      })
    },
  };
}

my handleBuyCredits

  const handleBuyCredits = useCallback(async (plan: string) => {
    console.log(`handleBuyCredits called with plan: ${plan}`);
    if (!session) {
      (signIn as () => Promise<void>)().catch(console.error); // This will redirect the user to the login page
      return;
    }

    try {
      await buyCredits(plan); // This should create a Stripe Checkout Session and redirect the user to the Stripe Checkout page
    } catch (error) {
      console.error(error);
    }
  }, [buyCredits, session]);

  const handleBuyCredits = useCallback(async (plan: string) => {
    console.log(`handleBuyCredits called with plan: ${plan}`);
    if (!session) {
      (signIn as () => Promise<void>)().catch(console.error); // This will redirect the user to the login page
      return;
    }

    try {
      await buyCredits(plan); // This should create a Stripe Checkout Session and redirect the user to the Stripe Checkout page
    } catch (error) {
      console.error(error);
    }
  }, [buyCredits, session]);

but then my back received an plan: undefined

10 replies

TTCTheo's Typesafe Cult

•Created by shvz on 8/28/2023 in #questions

mutateAsync()

10 replies

TTCTheo's Typesafe Cult

•Created by shvz on 8/28/2023 in #questions

mutateAsync()

in my front, I'm passing 'basic', 'standard' or 'premium'

10 replies

TTCTheo's Typesafe Cult

•Created by shvz on 8/28/2023 in #questions

mutateAsync()

I'm having hard time passing the price_id I endup having an object within an object for some reason, I have now stear away from trying to pass hardcoded price_id and use my .env now my backend return an undefined plan while my price ID is set in my .env using NEXT_PUBLIC and should pass properly to my back

import {
  createTRPCRouter,
  protectedProcedure,
} from "~/server/api/trpc";

import Stripe from 'stripe';
import { env } from "~/env.mjs";

const stripe = new Stripe(env.STRIPE_SECRET_KEY, {
  apiVersion: '2022-11-15',
});

type LineItem = {
  price: string;
  quantity: number;
};

export const checkoutRouter = createTRPCRouter({
  createCheckout: protectedProcedure.mutation(async ({ ctx, plan }: { ctx: any, plan: string }) => {
    let priceId;
    console.log('Received plan:', plan);
    switch (plan) {
      case 'basic':
        priceId = process.env.NEXT_PUBLIC_PRICE_ID_BASIC;
        break;
      case 'standard':
        priceId = process.env.NEXT_PUBLIC_PRICE_ID_STANDARD;
        break;
      case 'premium':
        priceId = process.env.NEXT_PUBLIC_PRICE_ID_PREMIUM;
        break;
      default:
        console.error(`Invalid plan: ${plan}`);
        throw new Error(`Invalid plan: ${plan}`);
    }

    const lineItems: LineItem[] = [
      { price: priceId, quantity: 1 },
    ];

    return stripe.checkout.sessions.create({
      payment_method_types: ['card'],
      metadata: {
        userId: ctx.session.user.id,
      },
      line_items: lineItems,
      mode: 'payment',
      success_url: `${env.HOST_NAME}`,
      cancel_url: `${env.HOST_NAME}`,
    });
  }),
});

import {
  createTRPCRouter,
  protectedProcedure,
} from "~/server/api/trpc";

import Stripe from 'stripe';
import { env } from "~/env.mjs";

const stripe = new Stripe(env.STRIPE_SECRET_KEY, {
  apiVersion: '2022-11-15',
});

type LineItem = {
  price: string;
  quantity: number;
};

export const checkoutRouter = createTRPCRouter({
  createCheckout: protectedProcedure.mutation(async ({ ctx, plan }: { ctx: any, plan: string }) => {
    let priceId;
    console.log('Received plan:', plan);
    switch (plan) {
      case 'basic':
        priceId = process.env.NEXT_PUBLIC_PRICE_ID_BASIC;
        break;
      case 'standard':
        priceId = process.env.NEXT_PUBLIC_PRICE_ID_STANDARD;
        break;
      case 'premium':
        priceId = process.env.NEXT_PUBLIC_PRICE_ID_PREMIUM;
        break;
      default:
        console.error(`Invalid plan: ${plan}`);
        throw new Error(`Invalid plan: ${plan}`);
    }

    const lineItems: LineItem[] = [
      { price: priceId, quantity: 1 },
    ];

    return stripe.checkout.sessions.create({
      payment_method_types: ['card'],
      metadata: {
        userId: ctx.session.user.id,
      },
      line_items: lineItems,
      mode: 'payment',
      success_url: `${env.HOST_NAME}`,
      cancel_url: `${env.HOST_NAME}`,
    });
  }),
});

10 replies

Gaming

Programming