HP DABANG QR

import React, { useState, useEffect } from 'react'; import { initializeApp } from 'firebase/app'; import { getAuth, signInAnonymously, onAuthStateChanged, signOut, updateProfile } from 'firebase/auth'; import { getFirestore, collection, addDoc, getDocs, doc, updateDoc, onSnapshot, query, where, setDoc, increment, serverTimestamp, getDoc } from 'firebase/firestore'; import { Gamepad2, Trophy, Wallet, User, Swords, Clock, MapPin, Coins, ChevronRight, LogOut, AlertCircle, CheckCircle2, Lock, Copy } from 'lucide-react'; // --- Firebase Configuration (From your uploaded JSON) --- const firebaseConfig = { apiKey: "AIzaSyDqFXbs1-oIGnixQL_SpTxKxTuiOynNjRQ", authDomain: "file-market-e9c39.firebaseapp.com", // Derived from project_id databaseURL: "https://file-market-e9c39-default-rtdb.firebaseio.com", projectId: "file-market-e9c39", storageBucket: "file-market-e9c39.firebasestorage.app", messagingSenderId: "355537437035", appId: "1:355537437035:android:868399d491f093e5328c2e" }; // Initialize Firebase const app = initializeApp(firebaseConfig); const auth = getAuth(app); const db = getFirestore(app); // --- Components --- const MatchCard = ({ match, user, onJoin }) => { const isJoined = match.participants?.includes(user?.uid); // Calculate slots left const totalSlots = 48; // Standard Free Fire lobby const joinedCount = match.participants?.length || 0; const slotsLeft = totalSlots - joinedCount; const progress = (joinedCount / totalSlots) * 100; return (

{/* Header Banner */}

Match #{match.matchId || '001'}

{match.matchTime || 'Time TBA'}

{match.map || 'BERMUDA'}

{/* Stats Row */}

Prize Pool

₹{match.prizePool || 0}

Per Kill

₹{match.perKill || 0}

Entry

{match.entryFee === 0 ? "FREE" : `₹${match.entryFee}`}

{/* Type & Version */}

{match.type || 'SOLO'} {match.version || 'TPP'}

{/* Progress Bar */}

Only {slotsLeft} spots left! {joinedCount}/{totalSlots}

{/* Action Button Area */}

{isJoined ? (

YOU JOINED

{/* Room ID Logic - Controlled by Admin */}

{match.roomId ? (

Room ID:

{match.roomId} navigator.clipboard.writeText(match.roomId)}/>

Password:

{match.roomPass} navigator.clipboard.writeText(match.roomPass)}/>

) : (

Room ID & Pass will display here 15 mins before start.

)}

) : ( )}

); }; const WalletSection = ({ user, wallet }) => { return (

{/* Balance Card */}

Total Balance

₹{wallet?.balance || 0}

{/* Transactions Mockup */}

Recent Transactions

{/* Mock data for visual */}

Winning Prize

Match #45 Winner

+₹150

Match Entry

Joined Match #52

-₹20

) } const ProfileSection = ({ user, wallet }) => { return (

{user?.displayName || 'Player One'}

UID: {user?.uid?.slice(0, 8)}...

12

Matches Played

₹450

Total Won

) } export default function App() { const [user, setUser] = useState(null); const [activeTab, setActiveTab] = useState('home'); const [matches, setMatches] = useState([]); const [myMatches, setMyMatches] = useState([]); const [wallet, setWallet] = useState({ balance: 0 }); const [loading, setLoading] = useState(true); const [notification, setNotification] = useState(null); // Auth & Initial Load useEffect(() => { const unsubscribe = onAuthStateChanged(auth, async (currentUser) => { if (currentUser) { setUser(currentUser); // Ensure user doc exists const userRef = doc(db, "users", currentUser.uid); const userSnap = await getDoc(userRef); if (!userSnap.exists()) { // First time login setup await setDoc(userRef, { balance: 100, // Giving 100 bonus for testing email: currentUser.email || 'anon', createdAt: serverTimestamp() }); } // Listen to User Wallet const unsubWallet = onSnapshot(userRef, (doc) => { if (doc.exists()) setWallet(doc.data()); }); // Listen to Matches const q = query(collection(db, "matches")); // In real app, order by time const unsubMatches = onSnapshot(q, (snapshot) => { const matchesData = snapshot.docs.map(doc => ({ id: doc.id, ...doc.data() })); setMatches(matchesData); }); return () => { unsubWallet(); unsubMatches(); } } else { // Auto login for demo purposes (Anonymous) signInAnonymously(auth); } setLoading(false); }); return () => unsubscribe(); }, []); // Filter My Matches useEffect(() => { if (user && matches.length > 0) { const my = matches.filter(m => m.participants?.includes(user.uid)); setMyMatches(my); } }, [user, matches]); const showNotification = (msg, type = 'success') => { setNotification({ msg, type }); setTimeout(() => setNotification(null), 3000); } const handleJoinMatch = async (match) => { if (!user) return; if (wallet.balance < match.entryFee) { showNotification("Insufficient Balance! Please Add Money.", "error"); return; } try { const matchRef = doc(db, "matches", match.id); const userRef = doc(db, "users", user.uid); // Transaction to ensure balance deduction and slot availability // For simplicity in this demo, using direct updates (In prod, use runTransaction) // 1. Deduct Balance await updateDoc(userRef, { balance: increment(-match.entryFee) }); // 2. Add to Participants const currentParticipants = match.participants || []; await updateDoc(matchRef, { participants: [...currentParticipants, user.uid] }); showNotification("Match Joined Successfully!", "success"); setActiveTab("mymatches"); } catch (error) { console.error("Error joining match:", error); showNotification("Failed to join. Try again.", "error"); } }; // Mock Admin: Add a dummy match for testing if list is empty const addDummyMatch = async () => { await addDoc(collection(db, "matches"), { matchId: Math.floor(Math.random() * 1000), map: "BERMUDA", type: "SOLO", version: "TPP", entryFee: 20, prizePool: 500, perKill: 15, matchTime: "Today, 8:00 PM", participants: [], roomId: "", // Empty initially roomPass: "" }); }; if (loading) { return (

); } return (

{/* Notification Toast */} {notification && (

{notification.msg}

)} {/* Top App Bar */}

DABANG ESPORTS

setActiveTab('wallet')} className="flex items-center gap-2 bg-gray-800 px-3 py-1.5 rounded-full border border-gray-700 cursor-pointer hover:bg-gray-700 transition" > ₹{wallet?.balance || 0}

{/* Main Content Area */}

{/* HOME TAB */} {activeTab === 'home' && (

Upcoming Matches

{/* Dev Tool: Add match button only shown if empty (for first time use) */} {matches.length === 0 && ( )}

{matches.length === 0 ? (

No matches scheduled right now.

Check back later!

) : ( matches.map(match => ( )) )}

)} {/* MY MATCHES TAB */} {activeTab === 'mymatches' && (

Joined Matches

{myMatches.length === 0 ? (

You haven't joined any matches yet.

) : ( myMatches.map(match => ( {}} /> )) )}

)} {/* WALLET TAB */} {activeTab === 'wallet' && } {/* PROFILE TAB */} {activeTab === 'profile' && }

{/* Bottom Navigation */}

); }