Let's continue by implementing our Stripe checkout. So whenever we click the checkout button, we want to create a Stripe checkout session, which will redirect us to our checkout page, where we then can enter our payment information and pay for our order. So if we go back to our card component in our Blade view, we already wired this up to call a checkout method on our component. So let's open up our card, and let's implement this checkout method. Now given we've installed Share and added DeepTrade to our User, we have access to a few new methods on our User model. We can use this to create a checkout on Stripe.

few new methods on our User model. We can use this to create a checkout on Stripe. We're going to say return of User, and now there is a checkout method available. This checkout method accepts the items or line items that are part of our checkout process. Now if we look at Stripe API and head over to the checkout.session and the subsection called create a checkout session, you can see that the line items accept a few different variations. As you can see, it accepts a price ID or a plan object, and this is kind of a choice that you have to make yourself. You can create products within Stripe and reference these products and prices, so then

that you have to make yourself. You can create products within Stripe and reference these products and prices, so then you have all your information grouped, and you can access your Stripe dashboard, and you have insights into statistics, reports, which are based on different products, and you can automate this process as well, so then you can create products from within your application and make sure that they are recreated in your Stripe account. In this example, we're going to use a more manual approach where you can set data dynamically. As you can see, besides passing a price ID to our line item, we can also provide price data, then request a few parameters like currency, a product. Again, if we don't have a product within Stripe, we can use a product data array to set data.

data, then request a few parameters like currency, a product. Again, if we don't have a product within Stripe, we can use a product data array to set data manually, so we have to provide a product name. If you want, you can also provide a description, images, metadata, a text code. We have to provide the amount, the cost of the product, and we can also set a quantity, which you can see right here. So if we switch back to our editor, we can simply provide this array here. So the first argument of this method accepts the line items, so we're going to create a first line item here to give you an example of how this would look like. But first, we're going to have our price data array.

first line item here to give you an example of how this would look like. But first, we're going to have our priceData array. So this requires a currency, and we're going to set this to United States dollars. Next, we have to set the amount. This value is in cents, so 100 would be $1. Next, we have to provide our productData, and of course, we have to set our quantity. By default, that's 1, but let's say, for example, 2. Then we have our productData, so we have to provide a name. And now, given we're using a dynamic approach, it is very useful to set some metadata on this checkout session and on the product level.

And now, given we're using a dynamic approach, it is very useful to set some metadata on this checkout session and on the product level. We can reference this information later on to link up our checkout session and have a reference to which products were purchased during this checkout session. So we're going to set a metadata array, and now here, we simply want to store the productID, and let's also store the productVariantID. There we go. So now if we click the checkout button, it should create a session and redirect us to Stripe, where we would have to pay $2, and because we have one product with a quantity of two, we should see the My Product as the name.

Stripe, where we would have to pay $2, and because we have one product with a quantity of two, we should see My Product as the name. In the UI, you don't see the metadata, so let's verify this as it works. So let's switch back to our browser and go to our store, and let's click the checkout button, and I made one little mistake. Sorry about that. The quantity has to be outside the price data array. There we go. Let's try that again, and there you go. We are now redirected to Stripe.

Let's try that again, and there you go. We are now redirected to Stripe. You can see that we have to pay $2 because we have a quantity of two, and because of the automatic tax recognition, you can see that it has determined that I am only in the Netherlands and I have to pay a 20% sales tax. Okay, let's head back to our store, and this is, of course, a demo. We just set some static values on this array. Let's make sure that we actually use the information of the products and productVariants, which are located in our cart. So inside this component, we already have a variety of methods that provide us with

which are located in our cart. So inside this component, we already have a variety of methods that provide us with the cart and the items. So let's again use an action to extract this logic into a separate class. Create a new class, and let's call it CreateStripeCheckSession. Let's create a new method, and let's call it CreateFromCart. So this is going to accept our cart model. And let's copy and paste this logic for now. So let's update this code, and instead of the auth user logic, we can actually reference our cart.

So let's update this code, and instead of the auth user logic, we can actually reference our cart. Click Cart User. Let's make sure that we set up this relationship. This is going to be a belongsTo relationship, and this is going to return our user. There we go. So now we need to make sure that this is worth correct data. So let's create a new method, and let's call it formatCartItems. Let's add this method. This is going to be a collection of our models, and this is going to be the structure that

Let's add this method. This is going to be a collection of our models, and this is going to be the structure that we have to replicate. So we're going to say return, and we're going to get rid of our items, and we're going to call map. Let's move this array structure into our map function, and let's update the corresponding data. So we're going to reference the item product, and if we go to product, we can reference and call getAmount. Next, we want to include our product name.

and call getAmount. Next, we want to include our product name. Now we want to reference our metadata, and of course our variant ID. Finally, we want to reference the quantity count. There we go. Now, like before, we're referencing a couple of different relationships here. So for an optimal query, let's ensure that we load any missing relationships into items. We're going to say loadMissing, and we're going to load our missing product relationship if it doesn't exist yet. Okay.

if it doesn't exist yet. Okay. Now we want to ensure that we return the checkoutSession. Let's move back to our Card component and reference our checkoutSession. I'm going to say return checkoutSession. Create more cards, and we are going to pass our card. Okay. Let's give this a try. It seems I made a mistake here. There's no such price.

It seems I made a mistake here. There's no such price. Take a look. And of course, we need to make sure that we actually return an array rather than a collection. There you go. So this seems to work. We have our blanket, a quantity of nine. We can see again that the text has been added. So we're making good progress. Awesome.

So we're making good progress. Awesome. Now, when a User is redirected to Stripe, it currently shows the product name, but it doesn't show the actual variant that they've chosen, so the size and the color. So let's update our array that we sent to Stripe, and let's include a description for our products, where in this case, we'll show the size and the color. Given we are now accessing our variant relationship, we want to make sure that we load it in case it is missing to optimize it.

Given we are now accessing our variant relationship, we want to make sure that we load it in case it is missing to optimize it. So let's verify that everything's still working. Let's head over to our cards, click Checkout, and there you go. The size and the color are now listed as a description below our product. Finally, we can enable one additional feature for our checkout. When you are building a web shop, you might want to use coupon codes, promotion codes that you can use for marketing purposes,

you might want to use coupon codes, promotion codes that you can use for marketing purposes, and these codes your customers can use to get a discount on their order. Now, this is built into Stripe, so all we have to do is instruct Cashier to allow the usage of promotion code. So we're going to update the checkout callback right here, and we're simply going to call a new method called allowPromotionCodes. And now, if we give this a try again in the browser,

called AllowPromotionCodes. And now, if we give this a try again in the browser, we should see a new input field shown on the checkout page where we can enter our promotion code.