From 952e006ddc6e2a215f954f73d6650ebe96b6d57f Mon Sep 17 00:00:00 2001
From: lawvs <18554747+lawvs@users.noreply.github.com>
Date: Mon, 21 Oct 2024 03:43:47 +0800
Subject: [PATCH] feat: update RadioCards to use monthlyBoostCost for dynamic
 pricing

---
 apps/renderer/src/modules/boost/modal.tsx       |  8 ++++++--
 apps/renderer/src/modules/boost/radio-cards.tsx | 14 ++++++++------
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/apps/renderer/src/modules/boost/modal.tsx b/apps/renderer/src/modules/boost/modal.tsx
index 13143ef86f..b6a104f70b 100644
--- a/apps/renderer/src/modules/boost/modal.tsx
+++ b/apps/renderer/src/modules/boost/modal.tsx
@@ -19,7 +19,7 @@ export const BoostModalContent = ({ feedId }: { feedId: string }) => {
   const dPowerBigInt = BigInt(myWalletData?.dailyPowerToken ?? 0)
   const cPowerBigInt = BigInt(myWalletData?.cashablePowerToken ?? 0)
   const balanceBigInt = cPowerBigInt + dPowerBigInt
-  const [amount, setAmount] = useState<number>(80)
+  const [amount, setAmount] = useState<number>(0)
   const amountBigInt = from(amount, 18)[0]
   const wrongNumberRange = amountBigInt > balanceBigInt || amountBigInt <= BigInt(0)
 
@@ -71,7 +71,11 @@ export const BoostModalContent = ({ feedId }: { feedId: string }) => {
         </small>
 
         <BoostProgress {...boostStatus} />
-        <RadioCards value={amount} onValueChange={setAmount} />
+        <RadioCards
+          monthlyBoostCost={boostStatus.monthlyBoostCost}
+          value={amount}
+          onValueChange={setAmount}
+        />
       </div>
 
       <Button
diff --git a/apps/renderer/src/modules/boost/radio-cards.tsx b/apps/renderer/src/modules/boost/radio-cards.tsx
index c1341971d4..e7b2d49715 100644
--- a/apps/renderer/src/modules/boost/radio-cards.tsx
+++ b/apps/renderer/src/modules/boost/radio-cards.tsx
@@ -4,26 +4,28 @@ import { RadioCard } from "~/components/ui/radio-group/RadioCard"
 const radios = [
   {
     name: "1 Month",
-    amount: 80,
+    value: 1,
   },
   {
     name: "3 Months",
-    amount: 240,
+    value: 3,
   },
   {
     name: "6 Months",
-    amount: 480,
+    value: 6,
   },
   {
     name: "1 Year",
-    amount: 960,
+    value: 12,
   },
 ]
 
 export const RadioCards = ({
+  monthlyBoostCost,
   value,
   onValueChange,
 }: {
+  monthlyBoostCost: number
   value: number
   onValueChange: (value: number) => void
 }) => {
@@ -34,12 +36,12 @@ export const RadioCards = ({
           <RadioCard
             key={item.name}
             wrapperClassName="justify-center"
-            value={item.amount.toString()}
+            value={(item.value * monthlyBoostCost).toString()}
             label={
               <div>
                 <h3 className="pr-3 font-medium leading-none">{item.name}</h3>
                 <p className="mt-1 flex items-center justify-center gap-1 text-sm text-theme-vibrancyFg">
-                  {item.amount}
+                  {item.value * monthlyBoostCost}
                   <i className="i-mgc-power text-accent" />
                 </p>
               </div>