diff --git a/app/check-ticket/page.tsx b/app/check-ticket/page.tsx index 884416d..d09fe54 100644 --- a/app/check-ticket/page.tsx +++ b/app/check-ticket/page.tsx @@ -1,6 +1,69 @@ -export default function CheckTicketPage() { - return ( -
Check ticket page placeholder
- ) -} +"use client" +import { useState } from "react" + +export default function CheckTicketPage() { + const [ticketId, setTicketId] = useState("") + const [result, setResult] = useState(null) + + const handleCheck = () => { + if (!ticketId.trim()) return + setResult({ + id: ticketId, + event: "Arsenal vs Manchester City", + selection: "Arsenal Win", + odds: "2.80", + stake: "100 ETB", + potentialWin: "280 ETB", + status: "pending", + date: "2026-02-19 17:30", + }) + } + + return ( +
+
+

Check Ticket

+
+ +
+
+ +
+ setTicketId(e.target.value)} + placeholder="Enter ticket ID or bet code" + className="flex-1 bg-input border border-border rounded px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:border-primary" + onKeyDown={(e) => e.key === "Enter" && handleCheck()} + /> + +
+
+ + {result && ( +
+
+ Ticket Details + Pending +
+
+ {Object.entries(result as Record).filter(([k]) => k !== "status").map(([key, val]) => ( +
+ {key.replace(/([A-Z])/g, ' $1')}: + {val} +
+ ))} +
+
+ )} +
+
+ ) +} \ No newline at end of file diff --git a/app/deposit/page.tsx b/app/deposit/page.tsx index 2947b6a..eb7b702 100644 --- a/app/deposit/page.tsx +++ b/app/deposit/page.tsx @@ -1,6 +1,94 @@ -export default function DepositPage() { - return ( -
Deposit page placeholder
- ) -} +"use client" +import { useState } from "react" + +const methods = [ + { id: "telebirr", name: "Telebirr", icon: "๐Ÿ“ฑ", desc: "Ethiopian mobile payment" }, + { id: "cbe", name: "CBE Birr", icon: "๐Ÿฆ", desc: "Commercial Bank of Ethiopia" }, + { id: "awash", name: "Awash Bank", icon: "๐Ÿ›๏ธ", desc: "Awash Bank transfer" }, + { id: "abyssinia", name: "Bank of Abyssinia", icon: "๐Ÿ’ณ", desc: "Bank of Abyssinia" }, +] + +const quickAmounts = [50, 100, 200, 500, 1000, 2000] + +export default function DepositPage() { + const [method, setMethod] = useState("telebirr") + const [amount, setAmount] = useState("") + + return ( +
+
+
+

Deposit

+

Add funds to your account

+
+ +
+ {/* Balance */} +
+ Current Balance + 0.00 ETB +
+ + {/* Payment methods */} +
+ +
+ {methods.map((m) => ( + + ))} +
+
+ + {/* Amount */} +
+ + setAmount(e.target.value)} + placeholder="Enter amount" + className="w-full bg-input border border-border rounded px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:border-primary" + min="50" + /> +
+ {quickAmounts.map((a) => ( + + ))} +
+
+ +

Min deposit: 50 ETB ยท Max deposit: 50,000 ETB

+ + +
+
+
+ ) +} \ No newline at end of file diff --git a/app/history/page.tsx b/app/history/page.tsx index 8b4319e..9a75a9b 100644 --- a/app/history/page.tsx +++ b/app/history/page.tsx @@ -1,6 +1,65 @@ -export default function HistoryPage() { - return ( -
History page placeholder
- ) +const mockHistory = [ + { id: "BET001", event: "Arsenal vs Man City", selection: "Arsenal Win", odds: 2.80, stake: 100, status: "won", date: "2026-02-18" }, + { id: "BET002", event: "Bayern vs Dortmund", selection: "Over 2.5 Goals", odds: 1.65, stake: 50, status: "lost", date: "2026-02-17" }, + { id: "BET003", event: "NBA: Lakers vs Celtics", selection: "Lakers ML", odds: 1.85, stake: 200, status: "pending", date: "2026-02-19" }, + { id: "BET004", event: "St. George vs Dire Dawa", selection: "St. George Win", odds: 1.65, stake: 500, status: "won", date: "2026-02-16" }, +] + +const statusStyles: Record = { + won: "text-primary bg-primary/20", + lost: "text-destructive bg-destructive/20", + pending: "text-yellow-500 bg-yellow-500/20", } +export default function HistoryPage() { + return ( +
+
+

Bet History

+ Please login to see full history +
+ + {/* Filter */} +
+ {["All", "Won", "Lost", "Pending"].map((f) => ( + + ))} +
+ +
+ + + + + + + + + + + + + + {mockHistory.map((bet) => ( + + + + + + + + + + ))} + +
Bet IDEventSelectionOddsStakeStatusDate
{bet.id}{bet.event}{bet.selection}{bet.odds.toFixed(2)}{bet.stake} ETB + + {bet.status} + + {bet.date}
+
+
+ ) +} \ No newline at end of file diff --git a/app/live/page.tsx b/app/live/page.tsx index 9247d56..ebcbac0 100644 --- a/app/live/page.tsx +++ b/app/live/page.tsx @@ -1,6 +1,9 @@ -import { InPlayPage } from "@/components/betting/in-play-page" +import { LiveEventsList } from "@/components/betting/live-events-list" export default function LivePage() { - return + return ( +
+ +
+ ) } - diff --git a/app/login/page.tsx b/app/login/page.tsx index 0761ed1..65a3808 100644 --- a/app/login/page.tsx +++ b/app/login/page.tsx @@ -1,4 +1,60 @@ -export default function LoginPage() { - return
Login page placeholder
-} +"use client" +import { useState } from "react" +import Link from "next/link" + +export default function LoginPage() { + const [username, setUsername] = useState("") + const [password, setPassword] = useState("") + + return ( +
+
+
+

Login

+

Sign in to your Harifsport account

+
+
+
+ + setUsername(e.target.value)} + placeholder="Enter username" + className="w-full bg-input border border-border rounded px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:border-primary transition-colors" + /> +
+
+ + setPassword(e.target.value)} + placeholder="Enter password" + className="w-full bg-input border border-border rounded px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:border-primary transition-colors" + /> +
+
+ + + Forgot password? + +
+ +

+ Don't have an account?{" "} + + Register now + +

+
+
+
+ ) +} \ No newline at end of file diff --git a/app/profile/page.tsx b/app/profile/page.tsx index 56cd069..f8764bf 100644 --- a/app/profile/page.tsx +++ b/app/profile/page.tsx @@ -1,6 +1,50 @@ +import Link from "next/link" + export default function ProfilePage() { return ( -
Profile page placeholder
- ) -} +
+
+

My Profile

+
+
+ {/* Avatar */} +
+
+ ๐Ÿ‘ค +
+
+
Guest User
+
Not logged in
+ + Login + +
+
+ + {/* Menu items */} +
+ {[ + { icon: "๐Ÿ†", label: "My Bets", href: "/history" }, + { icon: "๐Ÿ’ฐ", label: "Deposit", href: "/deposit" }, + { icon: "๐ŸŽ", label: "Bonus", href: "/bonus" }, + { icon: "๐Ÿ””", label: "Notifications", href: "/notifications" }, + { icon: "๐Ÿ“‹", label: "Rules", href: "/rules" }, + ].map((item) => ( + +
+ {item.icon} + {item.label} +
+ โ€บ + + ))} +
+
+
+ ) +} \ No newline at end of file diff --git a/app/promotions/page.tsx b/app/promotions/page.tsx index 186d4ce..7bd490a 100644 --- a/app/promotions/page.tsx +++ b/app/promotions/page.tsx @@ -1,6 +1,60 @@ +const promotions = [ + { + id: 1, + title: "Welcome Bonus", + description: "Get 100% up to 500 ETB on your first deposit", + badge: "NEW", + color: "from-primary/20 to-primary/5", + icon: "๐ŸŽ", + }, + { + id: 2, + title: "Accumulator Boost", + description: "Get up to 50% extra winnings on accumulators of 5+ selections", + badge: "POPULAR", + color: "from-yellow-500/20 to-yellow-500/5", + icon: "โšก", + }, + { + id: 3, + title: "Live Bet Cashback", + description: "5% cashback on all losing live bets, credited every Monday", + badge: "", + color: "from-blue-500/20 to-blue-500/5", + icon: "๐Ÿ”„", + }, +] + export default function PromotionsPage() { return ( -
Promotions page placeholder
+
+
+

Promotions

+
+
+ {promotions.map((promo) => ( +
+
{promo.icon}
+
+
+

{promo.title}

+ {promo.badge && ( + + {promo.badge} + + )} +
+

{promo.description}

+
+ +
+ ))} +
+
) -} - +} \ No newline at end of file diff --git a/app/raffle/page.tsx b/app/raffle/page.tsx index 172556c..7b108e8 100644 --- a/app/raffle/page.tsx +++ b/app/raffle/page.tsx @@ -1,4 +1,58 @@ -export default function RafflePage() { - return
Raffle page placeholder
-} +"use client" +import { useState } from "react" + +export default function RafflePage() { + const [tickets, setTickets] = useState(0) + + return ( +
+
+

Raffle

+
+ + {/* Current raffle */} +
+
๐ŸŽฐ
+

Weekend Mega Raffle

+

Prize pool: 100,000 ETB ยท Draw: Saturday 20:00

+ +
+
Your tickets
+
{tickets}
+
+ +
+ Earn 1 raffle ticket for every 100 ETB wagered +
+ + + Get More Tickets + +
+ + {/* Past winners */} +
+
Past Winners
+
+ {[ + { name: "John D.", prize: "50,000 ETB", date: "Feb 15" }, + { name: "Sarah M.", prize: "20,000 ETB", date: "Feb 8" }, + { name: "Abebe K.", prize: "30,000 ETB", date: "Feb 1" }, + ].map((winner, i) => ( +
+
+ ๐Ÿ† +
+
{winner.name}
+
{winner.date}
+
+
+ {winner.prize} +
+ ))} +
+
+
+ ) +} \ No newline at end of file diff --git a/app/register/page.tsx b/app/register/page.tsx index 4c9a341..ace0ac1 100644 --- a/app/register/page.tsx +++ b/app/register/page.tsx @@ -1,6 +1,110 @@ -export default function RegisterPage() { - return ( -
Register page placeholder
- ) -} +"use client" +import { useState } from "react" +import Link from "next/link" + +export default function RegisterPage() { + const [step, setStep] = useState(1) + + return ( +
+
+
+

Create Account

+

Join Harifsport today

+
+ + {/* Steps */} +
+ {["Personal Info", "Account Details", "Verification"].map((s, i) => ( +
+ {i + 1}. {s} +
+ ))} +
+ +
+ {step === 1 && ( + <> +
+
+ + +
+
+ + +
+
+
+ + +
+
+ + +
+ + )} + + {step === 2 && ( + <> +
+ + +
+
+ + +
+
+ + +
+
+ + +
+ + )} + + {step === 3 && ( +
+
โœ…
+

Account Created!

+

Please verify your phone number to start betting.

+ +
+ )} + +
+ {step > 1 && ( + + )} + +
+ + {step === 1 && ( +

+ Already have an account?{" "} + Login +

+ )} +
+
+
+ ) +} \ No newline at end of file diff --git a/app/rules/page.tsx b/app/rules/page.tsx index 95566db..d1e91bd 100644 --- a/app/rules/page.tsx +++ b/app/rules/page.tsx @@ -1,4 +1,48 @@ -export default function RulesPage() { - return
Rules page placeholder
-} +const rules = [ + { + title: "General Betting Rules", + content: "All bets are subject to Harifsport terms and conditions. By placing a bet, you agree to abide by these rules. The minimum bet amount is 5 ETB and the maximum payout is 500,000 ETB per bet.", + }, + { + title: "Live Betting", + content: "Live bets are accepted subject to availability. Odds may change at any time during live events. Bets placed during network disruptions may be voided at management's discretion.", + }, + { + title: "Void Bets", + content: "Bets may be voided in cases of obvious error in odds, match postponement/cancellation, or system malfunction. Voided bets are returned to the account at stake value.", + }, + { + title: "Responsible Gambling", + content: "Harifsport is committed to responsible gambling. Users may set deposit limits, loss limits, or self-exclude at any time. Gambling should be entertaining, not a source of income.", + }, + { + title: "Account Rules", + content: "Each person may hold only one account. Duplicate accounts will be closed. Users must be 18+ years of age. Accounts showing signs of bonus abuse may be restricted.", + }, +] +export default function RulesPage() { + return ( +
+
+

Betting Rules

+
+ +
+ {rules.map((rule, i) => ( +
+
+ + {i + 1} + +

{rule.title}

+
+
+ {rule.content} +
+
+ ))} +
+
+ ) +} \ No newline at end of file