RomanDEV | Stripe Developers | Page 1

sterile daggerBOT Jan 20, 2023, 1:34 PM

#

olive tulip Jan 20, 2023, 1:35 PM

#

👋 happy to help

#

I will be with you shortly

tidal thunder Jan 20, 2023, 1:37 PM

#

Hey. Any reason why you're defining interface Promise?

#

That's the issue there. you're inferring the wrong type by creating your own

#

You need to delete:

interface Promise{
  publishableKey:string,
   options?: StripeConstructorOptions | undefined
}

lucid sundial Jan 20, 2023, 1:42 PM

#

Deleted, null is still underlined. Getting the error: Argument of type 'null' is not assignable to parameter of type 'Promise<Stripe | null> | (() => Promise<Stripe | null>)'.ts(2345)

tidal thunder Jan 20, 2023, 1:47 PM

#

Is this reproducible somewhere? I can't replicate this with the same code (no type warnings)

lucid sundial Jan 20, 2023, 1:52 PM

#

backend:

import {Router, Request,Response} from 'express'
const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
const stripeRouter = Router();

stripeRouter.post("/create-payment-intent", async (req:Request, res:Response) => {
  try {
    const paymentIntent = await stripe.paymentIntents.create({
      currency: "EUR",
      amount: 1999,
      automatic_payment_methods: { enabled: true },
    });

    // Send publishable key and PaymentIntent details to client
    res.send({
      clientSecret: paymentIntent.client_secret,
    });
  } catch (error) {
    res.status(400)
    console.log(error)
    throw new Error("Action failed");
  }
});
// //bring publishableKey to frontend
stripeRouter.get("/config", (req, res) => {
  res.send({
    publishableKey: process.env.STRIPE_PUBLIC_KEY,
  });
});


export default stripeRouter;

No errors and puplishableKey and clientSecret are logged in frontend. Checkout is the original code from the tutorial.

tidal thunder Jan 20, 2023, 1:54 PM

#

Your backend code is unrelated here

#

Can you share a screenshot of TS complaining, and which line specifically

#

Also, which tutorial/codebase are you following/using?

lucid sundial Jan 20, 2023, 2:00 PM

#

It is only this line: const [stripePromise, setStripePromise] = React.useState<Promise<Stripe | null>>(null); null is underlined. The error message: Argument of type 'null' is not assignable to parameter of type 'Promise<Stripe | null> | (() => Promise<Stripe | null>)'.ts(2345) Link: https://www.youtube.com/watch?v=e-whXipfRvg

YouTube

Stripe Developers

React Stripe.js and the Payment Element

In this episode, you’ll learn how to accept payments with the Payment Element using React Stripe.js. We’ll also see how to leverage many types of payment methods with one single integration using automatic payment methods.

Presenter

Matthew Ling - Developer Advocate at Stripe - https://twitter.com/mattling_dev

#RomanDEV

Presenter

Table of contents