Update pricing page + add pnpm

components/Pricing.tsx

@@ -18,16 +18,6 @@ const Pricing = (): JSX.Element => {
 	const [customerId, setCustomerId] = useState(null);
 	const [sub, setSub] = useState(false);
 
-	const portal = () => {
-		axios
-			.post('/api/stripe/customer-portal', {
-				customerId,
-			})
-			.then((result) => {
-				router.push(result.data.url);
-			});
-	};
-
 	useEffect(() => {
 		if (user) {
 			getSub().then((result) => setSub(result));
@@ -45,16 +35,25 @@ const Pricing = (): JSX.Element => {
 	const handleSubmit = async (e: React.SyntheticEvent<HTMLButtonElement>, priceId: string) => {
 		e.preventDefault();
 		// Create a Checkout Session. This will redirect the user to the Stripe website for the payment.
-		axios
-			.post('/api/stripe/create-checkout-session', {
-				priceId,
-				email: user.email,
-				customerId,
-				userId: user.id,
-				tokenId: session.access_token,
-				pay_mode: 'subscription',
-			})
-			.then((result) => router.push(result.data.url));
+		if (sub) {
+			axios
+				.post('/api/stripe/customer-portal', {
+					customerId,
+				})
+				.then((result) => {
+					router.push(result.data.url);
+				});
+		} else
+			axios
+				.post('/api/stripe/create-checkout-session', {
+					priceId,
+					email: user.email,
+					customerId,
+					userId: user.id,
+					tokenId: session.access_token,
+					pay_mode: 'subscription',
+				})
+				.then((result) => router.push(result.data.url));
 	};
 	return (
 		<div>
@@ -104,7 +103,7 @@ const Pricing = (): JSX.Element => {
 									handleSubmit(e, 'price_1JtHhaDMjD0UnVmM5uCyyrWn');
 								}}
 							>
-								Subscribe
+								{sub ? 'Handle subscription' : 'Subscribe'}
 							</button>
 						) : (
 							<button className="btn btn-primary" onClick={() => router.push('/login')}>
@@ -131,7 +130,14 @@ const Pricing = (): JSX.Element => {
 						</ul>
 
 						{user ? (
-							<button className="btn btn-primary">Subscribe</button>
+							<button
+								className="btn btn-primary"
+								onClick={(e) => {
+									handleSubmit(e, 'price_1JtHhaDMjD0UnVmM5uCyyrWn');
+								}}
+							>
+								{sub ? 'Handle subscription' : 'Subscribe'}
+							</button>
 						) : (
 							<button className="btn btn-primary" onClick={() => router.push('/login')}>
 								Log in

package.json

@@ -10,16 +10,16 @@
     "test": "playwright test"
   },
   "dependencies": {
-    "@headlessui/react": "^1.4.1",
+    "@headlessui/react": "^1.4.2",
     "@sendgrid/mail": "^7.6.0",
     "@stripe/stripe-js": "^1.21.1",
-    "@supabase/supabase-js": "^1.25.2",
+    "@supabase/supabase-js": "^1.27.0",
     "@types/node": "^16.10.1",
     "@types/react": "^17.0.24",
     "@types/react-dom": "^17.0.9",
     "axios": "^0.24.0",
     "cors": "^2.8.5",
-    "daisyui": "^1.16.1",
+    "daisyui": "^1.16.2",
     "express-rate-limit": "^5.5.1",
     "micro": "^9.3.4",
     "next": ">=12.0.3",