Updated giveaway 2.0

src/app/giveaways/page.tsx

@@ -82,10 +82,11 @@ export default async function GiveawaysPage() {
                   <GiveawayCard
                     giveawayId={giveaway.id}
                     title={giveaway.title}
-                    description={`${giveaway.description} — 🕒 ${countdownText}`}
+                    description={giveaway.description}
                     imageUrl={giveaway.prize}
                     value={giveaway.value}
                     userId={user?.id ?? ""}
+                    time_remaining={`🕒 ${countdownText}`}
                   />
                 </div>
               );

src/app/layout.tsx

@@ -18,7 +18,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
             <div className="max-w-7xl mx-auto flex justify-between items-center">
               {/* Logo / Title */}
               <Link href="/" className="text-2xl font-extrabold tracking-tight text-white">
-                TCG Love - Giveaway Page
+                Giveaway System
               </Link>
 
               {/* Navigation */}

src/components/GiveawayCard.tsx

@@ -11,12 +11,15 @@ interface GiveawayCardProps {
     imageUrl: string;
     value: number;
     userId: string;
+    time_remaining: string;
 }
 
-const GiveawayCard: React.FC<GiveawayCardProps> = ({ giveawayId, title, description, imageUrl, value, userId}) => {
+const GiveawayCard: React.FC<GiveawayCardProps> = ({ giveawayId, title, description, imageUrl, value, userId, time_remaining}) => {
     const [isModalOpen, setIsModalOpen] = useState(false);
     const [entrynumber, setEntrynumber] = useState<number>(0);
     const [activeUserCoins, setActiveUserCoins] = useState<number>(0);
+    const [entryMultiplier, setEntryMultiplier] = useState<number>(1);
+
 
 
     const fetchEntryCount = async () => {
@@ -28,6 +31,16 @@ const GiveawayCard: React.FC<GiveawayCardProps> = ({ giveawayId, title, descript
         }
     };
 
+    useEffect(() => {
+        let multiplier = 1;
+        let entries = entrynumber;
+        while (entries >= 3) {
+            entries -= 3;
+            multiplier *= 1.5;
+        }
+        setEntryMultiplier(multiplier);
+    }, [entrynumber]);
+
     useEffect(() => {
         fetchEntryCount();
     }, [userId, giveawayId]);
@@ -66,7 +79,7 @@ const GiveawayCard: React.FC<GiveawayCardProps> = ({ giveawayId, title, descript
             <div className="p-4 flex-1">
                 <h3 className="text-lg font-bold mb-2">{title}</h3>
                 <p className="text-gray-600 text-sm">{description}</p>
-                <p className="text-gray-600 text-sm mt-2">Value: {value} coins</p>
+                <p className="text-gray-600 text-sm mt-2">Time Remaining: {time_remaining}</p>
                 <p className="text-gray-600 text-sm mt-2">Your entries: {entrynumber}</p>
             </div>
             <div className="p-4 flex items-center">
@@ -85,6 +98,8 @@ const GiveawayCard: React.FC<GiveawayCardProps> = ({ giveawayId, title, descript
                 <div className="bg-white p-6 rouded-lg shadow-lg w-96 relative">
                 <h2 className="text-xl font-bold mb-4">{title}</h2>
                 <p className="text-gray-600 mb-4">{description}</p>
+                <p className="text-gray-600 mb-4">Value: {value} coins</p>
+                <p className="text-gray-600 mb-4">Entry cost: {Math.ceil(value*0.01*entryMultiplier)}</p>
                 <img src={imageUrl} alt={title} className="w-full h-48 object-cover mb-4" />
                     <div className="flex justify-between mt-4 text-black">
                         <button
@@ -106,7 +121,7 @@ const GiveawayCard: React.FC<GiveawayCardProps> = ({ giveawayId, title, descript
                                     });
                             }}
                         >
-                            Enter: {Math.ceil(value * 0.01)}
+                            Enter: {Math.ceil(value * 0.01*entryMultiplier)}
                         </button>
                     </div>
                 </div>