Hello,

I'm learning next.js by building an e-commerce with stripe and I've partly been following a guide for this. If a successful stripe purchase is made it will redirect the user to this page code I past below. And it renders fine on my local dev server. When I try to deploy to vercel though I get an error:

"Route /stripe/purchase-success couldn't be rendered statically because it used searchParams.payment_intent. See more info here: https://nextjs.org/docs/messages/dynamic-server-error"

This is a bit confusing because it's working on my local dev server. I have a few questions.

1. How can it work on my local dev server? It wants to take in a prop called "searchParams", but this is a parent page.tsx it doesn't take in any props, from where does it get this searchParams prop?
2. As I understand, when I deploy to Vercel, its statically generated and thus, this magic trick I dont understand doesn't work anymore. And now I need to use SSR to generate the file at request time? So I just use getServerSideProps of the dynamic data I need and then pass it as prop to the main function? Still again, what is the searchParams it accesses from stripe here?

Here is the code of the successpage:

Would love some help to get my head clear on what is happening here. Thanks.