diff --git a/components/Cart.jsx b/components/Cart.jsx index 1db05c23..ea87a4d5 100644 --- a/components/Cart.jsx +++ b/components/Cart.jsx @@ -6,15 +6,12 @@ import toast from 'react-hot-toast'; import { useStateContext } from '../context/StateContext'; import { urlFor } from '../lib/client'; -import getStripe from '../lib/getStripe'; const Cart = () => { const cartRef = useRef(); const { totalPrice, totalQuantities, cartItems, setShowCart, toggleCartItemQuanitity, onRemove } = useStateContext(); const handleCheckout = async () => { - const stripe = await getStripe(); - const response = await fetch('/api/stripe', { method: 'POST', headers: { @@ -29,7 +26,7 @@ const Cart = () => { toast.loading('Redirecting...'); - stripe.redirectToCheckout({ sessionId: data.id }); + window.location.href = data.url; } return ( @@ -109,4 +106,4 @@ const Cart = () => { ) } -export default Cart \ No newline at end of file +export default Cart diff --git a/package-lock.json b/package-lock.json index ab502f48..125c60a3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,7 +11,7 @@ "@babel/core": "^7.17.9", "@sanity/client": "^3.2.0", "@sanity/image-url": "^1.0.1", - "@stripe/stripe-js": "^1.25.0", + "@stripe/stripe-js": "^9.2.0", "canvas-confetti": "^1.5.1", "next": "12.1.0", "next-sanity-image": "^3.2.1", @@ -19,7 +19,7 @@ "react-dom": "17.0.2", "react-hot-toast": "^2.2.0", "react-icons": "^4.3.1", - "stripe": "^8.209.0" + "stripe": "^22.0.1" }, "devDependencies": { "@babel/preset-react": "^7.16.7", @@ -888,9 +888,13 @@ } }, "node_modules/@stripe/stripe-js": { - "version": "1.27.0", - "resolved": "https://registry.npmjs.org/@stripe/stripe-js/-/stripe-js-1.27.0.tgz", - "integrity": "sha512-SEiybUBu+tlsFKuzdFFydxxjkbrdzHo0tz/naYC5Dt9or/Ux2gcKJBPYQ4RmqQCNHFxgyNj6UYsclywwhe2inQ==" + "version": "9.2.0", + "resolved": "https://registry.npmjs.org/@stripe/stripe-js/-/stripe-js-9.2.0.tgz", + "integrity": "sha512-YSzLC0t6VS9MDdPTynSMqU8IxrItFUjkDORALFT6sSMR/XZ5Vgm3RDp/Gk7z727MC4A9s4MFVel0gF0c7+kdrg==", + "license": "MIT", + "engines": { + "node": ">=12.16" + } }, "node_modules/@types/json5": { "version": "0.0.29", @@ -899,11 +903,6 @@ "dev": true, "license": "MIT" }, - "node_modules/@types/node": { - "version": "17.0.23", - "resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.23.tgz", - "integrity": "sha512-UxDxWn7dl97rKVeVS61vErvw086aCYhDLyvRQZ5Rk65rZKepaFdm53GeqXaKBuOhED4e9uWq34IC3TdSdJJ2Gw==" - }, "node_modules/@typescript-eslint/parser": { "version": "5.10.1", "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.10.1.tgz", @@ -1266,6 +1265,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.2.tgz", "integrity": "sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==", + "dev": true, "license": "MIT", "dependencies": { "function-bind": "^1.1.1", @@ -2208,6 +2208,7 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==", + "dev": true, "license": "MIT" }, "node_modules/functional-red-black-tree": { @@ -2229,6 +2230,7 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.1.1.tgz", "integrity": "sha512-kWZrnVM42QCiEA2Ig1bG8zjoIMOgxWwYCEeNdwY6Tv/cOSeGpcoX4pXHfKUxNKVoArnrEr2e9srnAxxGIraS9Q==", + "dev": true, "license": "MIT", "dependencies": { "function-bind": "^1.1.1", @@ -2380,6 +2382,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", + "dev": true, "license": "MIT", "dependencies": { "function-bind": "^1.1.1" @@ -2412,6 +2415,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz", "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==", + "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -3096,6 +3100,7 @@ "version": "1.12.0", "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.12.0.tgz", "integrity": "sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g==", + "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -3423,20 +3428,6 @@ "node": ">=6" } }, - "node_modules/qs": { - "version": "6.10.3", - "resolved": "https://registry.npmjs.org/qs/-/qs-6.10.3.tgz", - "integrity": "sha512-wr7M2E0OFRfIfJZjKGieI8lBKb7fRCH4Fv5KNPEs7gJ8jadvotdsS08PzOKR7opXhZ/Xkjtt3WF9g38drmyRqQ==", - "dependencies": { - "side-channel": "^1.0.4" - }, - "engines": { - "node": ">=0.6" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/querystringify": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz", @@ -3719,6 +3710,7 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz", "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.0", @@ -3873,15 +3865,20 @@ } }, "node_modules/stripe": { - "version": "8.216.0", - "resolved": "https://registry.npmjs.org/stripe/-/stripe-8.216.0.tgz", - "integrity": "sha512-LY8cNGizEnklIa4T82l6mZW0HS4cfzo1hNuhT+ZR9PBkmYcSUbg3ilUBVF0FCd4RP+NA44VEVfoSTTZ1Gg5+rQ==", - "dependencies": { - "@types/node": ">=8.1.0", - "qs": "^6.10.3" - }, + "version": "22.0.1", + "resolved": "https://registry.npmjs.org/stripe/-/stripe-22.0.1.tgz", + "integrity": "sha512-Yw764pZ6s8Xu4CtUZdD5uWOkw6gc9xzO9OKylCuj1gMhMDLbyGbDtaPNNSFE4mB6njYSHESYIVbF1iIzUfAl2g==", + "license": "MIT", "engines": { - "node": "^8.1 || >=10.*" + "node": ">=18" + }, + "peerDependencies": { + "@types/node": ">=18" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + } } }, "node_modules/styled-jsx": { @@ -4737,9 +4734,9 @@ "integrity": "sha512-NBDKGj14g9Z+bopIvZcQKWCzJq5JSrdmzRR1CS+iyA3Gm8SnIWBfZa7I3mTg2X6Nu8LQXG0EPKXdOGozLS4i3w==" }, "@stripe/stripe-js": { - "version": "1.27.0", - "resolved": "https://registry.npmjs.org/@stripe/stripe-js/-/stripe-js-1.27.0.tgz", - "integrity": "sha512-SEiybUBu+tlsFKuzdFFydxxjkbrdzHo0tz/naYC5Dt9or/Ux2gcKJBPYQ4RmqQCNHFxgyNj6UYsclywwhe2inQ==" + "version": "9.2.0", + "resolved": "https://registry.npmjs.org/@stripe/stripe-js/-/stripe-js-9.2.0.tgz", + "integrity": "sha512-YSzLC0t6VS9MDdPTynSMqU8IxrItFUjkDORALFT6sSMR/XZ5Vgm3RDp/Gk7z727MC4A9s4MFVel0gF0c7+kdrg==" }, "@types/json5": { "version": "0.0.29", @@ -4747,11 +4744,6 @@ "integrity": "sha1-7ihweulOEdK4J7y+UnC86n8+ce4=", "dev": true }, - "@types/node": { - "version": "17.0.23", - "resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.23.tgz", - "integrity": "sha512-UxDxWn7dl97rKVeVS61vErvw086aCYhDLyvRQZ5Rk65rZKepaFdm53GeqXaKBuOhED4e9uWq34IC3TdSdJJ2Gw==" - }, "@typescript-eslint/parser": { "version": "5.10.1", "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.10.1.tgz", @@ -4971,6 +4963,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.2.tgz", "integrity": "sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==", + "dev": true, "requires": { "function-bind": "^1.1.1", "get-intrinsic": "^1.0.2" @@ -5654,7 +5647,8 @@ "function-bind": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", - "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==" + "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==", + "dev": true }, "functional-red-black-tree": { "version": "1.0.1", @@ -5671,6 +5665,7 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.1.1.tgz", "integrity": "sha512-kWZrnVM42QCiEA2Ig1bG8zjoIMOgxWwYCEeNdwY6Tv/cOSeGpcoX4pXHfKUxNKVoArnrEr2e9srnAxxGIraS9Q==", + "dev": true, "requires": { "function-bind": "^1.1.1", "has": "^1.0.3", @@ -5782,6 +5777,7 @@ "version": "1.0.3", "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", + "dev": true, "requires": { "function-bind": "^1.1.1" } @@ -5801,7 +5797,8 @@ "has-symbols": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz", - "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==" + "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==", + "dev": true }, "has-tostringtag": { "version": "1.0.0", @@ -6246,7 +6243,8 @@ "object-inspect": { "version": "1.12.0", "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.12.0.tgz", - "integrity": "sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g==" + "integrity": "sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g==", + "dev": true }, "object-keys": { "version": "1.1.1", @@ -6471,14 +6469,6 @@ "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==", "dev": true }, - "qs": { - "version": "6.10.3", - "resolved": "https://registry.npmjs.org/qs/-/qs-6.10.3.tgz", - "integrity": "sha512-wr7M2E0OFRfIfJZjKGieI8lBKb7fRCH4Fv5KNPEs7gJ8jadvotdsS08PzOKR7opXhZ/Xkjtt3WF9g38drmyRqQ==", - "requires": { - "side-channel": "^1.0.4" - } - }, "querystringify": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz", @@ -6661,6 +6651,7 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz", "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==", + "dev": true, "requires": { "call-bind": "^1.0.0", "get-intrinsic": "^1.0.2", @@ -6759,13 +6750,9 @@ "dev": true }, "stripe": { - "version": "8.216.0", - "resolved": "https://registry.npmjs.org/stripe/-/stripe-8.216.0.tgz", - "integrity": "sha512-LY8cNGizEnklIa4T82l6mZW0HS4cfzo1hNuhT+ZR9PBkmYcSUbg3ilUBVF0FCd4RP+NA44VEVfoSTTZ1Gg5+rQ==", - "requires": { - "@types/node": ">=8.1.0", - "qs": "^6.10.3" - } + "version": "22.0.1", + "resolved": "https://registry.npmjs.org/stripe/-/stripe-22.0.1.tgz", + "integrity": "sha512-Yw764pZ6s8Xu4CtUZdD5uWOkw6gc9xzO9OKylCuj1gMhMDLbyGbDtaPNNSFE4mB6njYSHESYIVbF1iIzUfAl2g==" }, "styled-jsx": { "version": "5.0.0", diff --git a/package.json b/package.json index 18c07a24..3cde8bf8 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ "@babel/core": "^7.17.9", "@sanity/client": "^3.2.0", "@sanity/image-url": "^1.0.1", - "@stripe/stripe-js": "^1.25.0", + "@stripe/stripe-js": "^9.2.0", "canvas-confetti": "^1.5.1", "next": "12.1.0", "next-sanity-image": "^3.2.1", @@ -20,7 +20,7 @@ "react-dom": "17.0.2", "react-hot-toast": "^2.2.0", "react-icons": "^4.3.1", - "stripe": "^8.209.0" + "stripe": "^22.0.1" }, "devDependencies": { "@babel/preset-react": "^7.16.7", diff --git a/pages/api/stripe.js b/pages/api/stripe.js index bb791276..e33b1fc9 100644 --- a/pages/api/stripe.js +++ b/pages/api/stripe.js @@ -1,6 +1,8 @@ import Stripe from 'stripe'; -const stripe = new Stripe(process.env.NEXT_PUBLIC_STRIPE_SECRET_KEY); +const stripe = new Stripe(process.env.NEXT_PUBLIC_STRIPE_SECRET_KEY, { + apiVersion: '2026-03-25.dahlia', +}); export default async function handler(req, res) { if (req.method === 'POST') { @@ -8,11 +10,7 @@ export default async function handler(req, res) { const params = { submit_type: 'pay', mode: 'payment', - payment_method_types: ['card'], billing_address_collection: 'auto', - shipping_options: [ - { shipping_rate: 'shr_1Kn3IaEnylLNWUqj5rqhg9oV' }, - ], line_items: req.body.map((item) => { const img = item.image[0].asset._ref; const newImage = img.replace('image-', 'https://cdn.sanity.io/images/vfxfwnaw/production/').replace('-webp', '.webp'); @@ -48,4 +46,4 @@ export default async function handler(req, res) { res.setHeader('Allow', 'POST'); res.status(405).end('Method Not Allowed'); } -} \ No newline at end of file +}