diff --git a/challenge-3-frontend/app/page.tsx b/challenge-3-frontend/app/page.tsx index fb01185..bb05946 100644 --- a/challenge-3-frontend/app/page.tsx +++ b/challenge-3-frontend/app/page.tsx @@ -1,110 +1,107 @@ -import Image from "next/image"; -import Link from "next/link"; +// pages/yield-farming.tsx +'use client'; +import { useState } from "react"; +import { Input } from "@/components/ui/input"; +import { Button } from "@/components/ui/button"; +import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; +import { Progress } from "@/components/ui/progress"; + +export default function YieldFarming() { + const [stakeAmount, setStakeAmount] = useState(""); + const [withdrawAmount, setWithdrawAmount] = useState(""); + const isAdmin = true; // simulate admin check -export default function Home() { return ( -
-
- OpenGuild logo -

Get started by checking out the demos

-
    -
  1. - Wallet -
  2. -
  3. - Send transaction -
  4. -
  5. - Write contract -
  6. -
  7. - Mint/Redeem LST Bifrost -
  8. -
-
- - Vercel logomark - Deploy now - - - Read our docs - -
-
- +
+ {/* Stake Section */} + + + Stake Your Tokens + + + setStakeAmount(e.target.value)} + /> + +

LP Token Balance: 120.5

+

Estimated APR: 18.25%

+
+
+ + {/* Rewards Dashboard */} + + + Rewards Dashboard + + +

Pending Rewards: 42.00

+ +

Staking Duration: 12 days

+
+ Progress to 30-day boost: + +
+
+
+ + {/* Withdraw Section */} + + + Withdraw Tokens + + + setWithdrawAmount(e.target.value)} + /> + +

Currently Staked: 250.00

+
+
+ + {/* Emergency Withdraw */} + + + ⚠ Emergency Withdraw + + +

+ Use only if absolutely necessary. This action is irreversible and might forfeit rewards. +

+ +
+
+ + {/* Admin Panel */} + {isAdmin && ( + + + Admin Panel + + +

Current Reward Rate: 2.5x

+ + +
+
+ )} + + {/* Boost Multiplier Tracker */} + + + Boost Multiplier + + +

Current Multiplier: 1.5x

+
+ Progress to 2x: + +
+
+
); } diff --git a/challenge-3-frontend/components/ui/card.tsx b/challenge-3-frontend/components/ui/card.tsx new file mode 100644 index 0000000..27c2b9b --- /dev/null +++ b/challenge-3-frontend/components/ui/card.tsx @@ -0,0 +1,27 @@ +import * as React from "react"; +import { cn } from "@/lib/utils"; // use your utility function for merging classes + +const Card = React.forwardRef>( + ({ className, ...props }, ref) => ( +
+ ) +); +Card.displayName = "Card"; + +const CardHeader = ({ className, ...props }: React.HTMLAttributes) => ( +
+); + +const CardTitle = ({ className, ...props }: React.HTMLAttributes) => ( +

+); + +const CardContent = ({ className, ...props }: React.HTMLAttributes) => ( +
+); + +export { Card, CardHeader, CardTitle, CardContent }; diff --git a/challenge-3-frontend/components/ui/progress.tsx b/challenge-3-frontend/components/ui/progress.tsx new file mode 100644 index 0000000..0050ace --- /dev/null +++ b/challenge-3-frontend/components/ui/progress.tsx @@ -0,0 +1,26 @@ +import * as React from "react"; +import { cn } from "@/lib/utils"; // make sure you have this utility + +interface ProgressProps extends React.HTMLAttributes { + value?: number; + max?: number; +} + +const Progress = React.forwardRef( + ({ className, value = 0, max = 100, ...props }, ref) => ( +
+
+
+ ) +); + +Progress.displayName = "Progress"; + +export { Progress };