refactor:plans details so checkout okey

ademsuslu · Dec 2, 2024 · 0ca8f5a · 0ca8f5a
1 parent d1f43aa
commit 0ca8f5a
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 13 deletions.
diff --git a/app/(root)/checkout/[selectedPlan]/page.tsx → app/(root)/checkout/[id]/page.tsx b/app/(root)/checkout/[selectedPlan]/page.tsx → app/(root)/checkout/[id]/page.tsx
@@ -1,22 +1,23 @@
 import BillingDetay from "@/components/shared/billing/billing-detay";
 import { BillingFormComponent } from "@/components/shared/forms/billing/billing-form";
 
-import { plans } from "@/data/projects"
 
-export default async function BussinesDetails({
+
+export default async function SelectedPlandDetails({
   params,
 }: {
-  params: Promise<{ selectedPlan: string }>
+  params: Promise<{ id: string }>
 }) {
-  const selectedPlan = (await params).selectedPlan
-  const planData = plans.find(pland => pland.plan === selectedPlan)
-
-
+  const id = (await params).id
+  const response = await fetch(`${process.env.NEXT_API_URL}/plans/${id}`,{cache:"no-store"})
+  const data = await response.json()
+console.log("********************************")
+console.log(data)
 
   return <div className=" w-full  gap-4 grid grid-cols-1 md:grid-cols-2 justify-between p-6">
           <div className="border p-6 border-gray-300 shadow-lg rounded-lg bg-gray-900">
               <BillingFormComponent />
           </div>
-          <BillingDetay  planData={planData}/>
+          <BillingDetay  planData={data}/>
         </div>
 }
diff --git a/components/shared/billing/billing-detay.tsx b/components/shared/billing/billing-detay.tsx
@@ -1,3 +1,4 @@
+"use client"
 import React from 'react'
 import {
     Card,
@@ -7,10 +8,11 @@ import {
     CardTitle,
   } from "@/components/ui/card"
   import { FaCheckCircle, FaCalendarAlt, FaDollarSign } from "react-icons/fa";
+import { Plans } from '@/types/plans/model';
 
 
 interface planDataProps {
-    planData:any
+    planData:Plans
 }
 
 const BillingDetay:React.FC<planDataProps> = ({planData}) => {
@@ -23,14 +25,14 @@ const BillingDetay:React.FC<planDataProps> = ({planData}) => {
     <Card className=" border border-gray-300 shadow-lg rounded-lg bg-gray-900 text-white">
       <CardHeader className="p-6">
         <CardTitle className="text-2xl font-bold flex items-center">
-          {planData?.plan} <FaCheckCircle className="ml-2 text-green-400" />
+          {planData.plan} <FaCheckCircle className="ml-2 text-green-400" />
         </CardTitle>
       </CardHeader>
       <CardContent className="p-6">
         <div className="mb-4">
           <h3 className="text-lg font-semibold mb-2">Features:</h3>
           <ul className="list-disc list-inside">
-            {planData?.features.map((item: string, index: number) => (
+            {planData?.features?.map((item: string, index: number) => (
               <li key={index} className="text-gray-400">
                 {item}
               </li>
@@ -53,7 +55,7 @@ const BillingDetay:React.FC<planDataProps> = ({planData}) => {
       <CardFooter className="p-6 border-t border-gray-700 flex justify-between items-center">
         <p className="text-lg font-semibold flex items-center">
           <FaDollarSign className="mr-2 text-yellow-500" />
-          {planData?.price === 0 ? "Free" : `${planData?.price}`}
+          {planData?.price}
         </p>
       </CardFooter>
     </Card>

diff --git a/components/shared/prices.tsx b/components/shared/prices.tsx
@@ -55,7 +55,7 @@ const Prices: React.FC<Props> = ({ data }) => {
                             <div className='p-1'>
 
                                 <Button asChild size="lg" className="text-lg rounded mt-3   w-full">
-                                    <Link href={`/checkout/${item.plan}`}>👉 Start Now</Link>
+                                    <Link href={`/checkout/${item._id}`}>👉 Start Now</Link>
                                 </Button>
                             </div>
                         </div>