diff --git a/public/index.html b/public/index.html index aa069f2..5231058 100644 --- a/public/index.html +++ b/public/index.html @@ -25,6 +25,15 @@ Learn how to configure a non-root public URL by running `npm run build`. --> React App + @@ -39,5 +48,7 @@ To begin the development, run `npm start` or `yarn start`. To create a production bundle, use `npm run build` or `yarn build`. --> + + diff --git a/src/App.js b/src/App.js index cbd7a1f..c04cdfb 100644 --- a/src/App.js +++ b/src/App.js @@ -7,7 +7,8 @@ import TeamResults from './pages/TeamResult'; import Home2 from './pages/Home2'; import GameList from './pages/GameList'; import Faq from './pages/Faq'; - +import MatkaResultsDashboard from './pages/Today'; +import Homenew from './User/Home'; // Auth Context const AuthContext = React.createContext(); @@ -1046,8 +1047,11 @@ const ProtectedRoute = ({ children }) => { // App const App = () => { + + return ( + } /> @@ -1060,8 +1064,12 @@ const App = () => { } /> } /> + }/> + } /> } /> + } /> + } /> diff --git a/src/Translate.js b/src/Translate.js new file mode 100644 index 0000000..966e2ce --- /dev/null +++ b/src/Translate.js @@ -0,0 +1,67 @@ +import { useState } from "react"; +import { Menu, X, Globe } from "lucide-react"; +import { Link } from "react-router-dom"; + +export default function Translate() { + const [isOpen, setIsOpen] = useState(false); + const [currentLanguage, setCurrentLanguage] = useState("English"); + + // Function to handle language change + const changeLanguage = (language) => { + setCurrentLanguage(language); + + // This would integrate with Google Translate API + // For actual implementation, you would need to use the Google Translate Element + if (language === "English") { + // Set to English + if (window.googleTranslateElementInit) { + const selectElement = document.querySelector('.goog-te-combo'); + if (selectElement) { + selectElement.value = 'en'; + selectElement.dispatchEvent(new Event('change')); + } + } + } else if (language === "Hindi") { + // Set to Hindi + if (window.googleTranslateElementInit) { + const selectElement = document.querySelector('.goog-te-combo'); + if (selectElement) { + selectElement.value = 'hi'; + selectElement.dispatchEvent(new Event('change')); + } + } + } + }; + + return ( + <> + {/* Translation Bar */} +
+
+
+ + Translate: +
+
+ + + {/* Hidden div for Google Translate Element */} +
+
+
+
+ + {/* Header */} + + ); +} \ No newline at end of file diff --git a/src/User/Faq.js b/src/User/Faq.js new file mode 100644 index 0000000..92eb139 --- /dev/null +++ b/src/User/Faq.js @@ -0,0 +1,47 @@ +import React from 'react'; +import { useState } from 'react'; + + const Faq = () => { + const [openIndex, setOpenIndex] = useState(null); + + const toggleFAQ = (index) => { + setOpenIndex(openIndex === index ? null : index); + }; + + const faqs = [ + { question: "HOW TO PLAY", answer: "Details about how to play." }, + { question: "WHERE TO PLAY", answer: "Information on where to play." }, + { question: "WINNING NUMBERS EMAIL", answer: "Sign up for emails." }, + ]; + + return ( + <> +
+ {/* FAQ Section */} +
+ {faqs.map((faq, index) => ( +
+ + {openIndex === index && ( +
+ {faq.answer} +
+ )} +
+ ))} +
+ +
+ + + ); + } + + export default Faq; + \ No newline at end of file diff --git a/src/User/Footer.js b/src/User/Footer.js new file mode 100644 index 0000000..8021f1c --- /dev/null +++ b/src/User/Footer.js @@ -0,0 +1,46 @@ +import React from 'react'; +import Faq from './Faq'; +const Footer = () => { + + return ( + <> +
+ {/* FAQ Section */} + + + {/* Footer Section */} +
+
+

+ MATKA SATTA +

+

+ Advertisement +

+

+ At *Matka Satta Daily.com*, we provide accurate results, expert tips, and daily charts for all major Matka games. Whether you're looking for Desawar Matka results at 5:00 AM or Gali Matka results at 11:30 PM, we’ve got you covered. Stay ahead of the game with our live updates and expert strategies. + +

+

+ In the event of a discrepancy, the official drawing results shall + prevail. All winning tickets must be redeemed in the + state/jurisdiction in which they are sold. +

+

+ Media Center + Legal + Privacy + español +

+
+
+
+ + ); +} + +export default Footer; diff --git a/src/User/Header.js b/src/User/Header.js new file mode 100644 index 0000000..b77261a --- /dev/null +++ b/src/User/Header.js @@ -0,0 +1,49 @@ +import { useState } from "react"; +import { Menu, X } from "lucide-react"; +import { Link } from "react-router-dom"; + +export default function Header() { + const [isOpen, setIsOpen] = useState(false); + + return ( + <> + {/* Header */} +
+
+
+ {/* Logo */} + + Advertisement + + + {/* Desktop Menu */} + + + {/* Mobile Menu Button */} + +
+ + {/* Mobile Menu */} + {isOpen && ( + + )} +
+
+ + ); +} \ No newline at end of file diff --git a/src/User/Herosection.js b/src/User/Herosection.js new file mode 100644 index 0000000..53f7e16 --- /dev/null +++ b/src/User/Herosection.js @@ -0,0 +1,293 @@ +import React, { useState, useEffect } from 'react'; +import { RefreshCw, Clock, ChevronRight, ChevronLeft } from 'lucide-react'; +import axios from 'axios'; +import TeamTime from './TeamTime'; + +const HeroSection = () => { + const [todaysMatches, setTodaysMatches] = useState([]); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + const [currentDate, setCurrentDate] = useState(''); + const [activeTeamIndex, setActiveTeamIndex] = useState(0); + + // API URL + const API_URL = 'http://localhost:5500/api'; + + // Format time + const formatTime = (timeString) => { + try { + const date = new Date(timeString); + return date.toLocaleTimeString("en-US", { hour: '2-digit', minute: '2-digit', hour12: true }); + } catch (e) { + return "XX:XX"; + } + }; + + // Fetch today's matches + useEffect(() => { + const fetchTodaysMatches = async () => { + try { + setLoading(true); + + // Get today's date for display + const today = new Date(); + setCurrentDate(today.toLocaleDateString('en-US', { + weekday: 'short', + month: 'long', + day: 'numeric', + year: 'numeric' + })); + + // Get today's results + const todayResultsResponse = await axios.get(`${API_URL}/today`); + const todayResults = todayResultsResponse.data; + + // Group by team + const teamResults = {}; + + todayResults.forEach(result => { + if (!teamResults[result.team]) { + teamResults[result.team] = []; + } + teamResults[result.team].push({ + result: result.visible_result, + time: formatTime(result.result_time), + upcoming: new Date(result.result_time) > new Date() + }); + }); + + // Convert to array for display + const groupedResults = Object.entries(teamResults).map(([team, results]) => ({ + team, + results: results.sort((a, b) => a.upcoming - b.upcoming) + })); + + setTodaysMatches(groupedResults); + setLoading(false); + } catch (err) { + console.error("Error fetching today's matches:", err); + setError("Failed to load today's match data. Please try again later."); + setLoading(false); + } + }; + + fetchTodaysMatches(); + }, []); + + // Navigation handlers + const handleNext = () => { + if (todaysMatches.length > 0) { + setActiveTeamIndex((prevIndex) => + prevIndex === todaysMatches.length - 1 ? 0 : prevIndex + 1 + ); + } + }; + + const handlePrev = () => { + if (todaysMatches.length > 0) { + setActiveTeamIndex((prevIndex) => + prevIndex === 0 ? todaysMatches.length - 1 : prevIndex - 1 + ); + } + }; + + // Refresh data + const handleRefresh = () => { + setLoading(true); + setError(null); + + const fetchData = async () => { + try { + const todayResultsResponse = await axios.get(`${API_URL}/today`); + const todayResults = todayResultsResponse.data; + + const teamResults = {}; + + todayResults.forEach(result => { + if (!teamResults[result.team]) { + teamResults[result.team] = []; + } + teamResults[result.team].push({ + result: result.visible_result, + time: formatTime(result.result_time), + upcoming: new Date(result.result_time) > new Date() + }); + }); + + const groupedResults = Object.entries(teamResults).map(([team, results]) => ({ + team, + results: results.sort((a, b) => a.upcoming - b.upcoming) + })); + + setTodaysMatches(groupedResults); + setLoading(false); + } catch (err) { + setError("Failed to refresh match data. Please try again later."); + setLoading(false); + } + }; + + fetchData(); + }; + + // Render boxes similar to lottery design + return ( +
+ {/* Today's Matches Box */} +
+
+

Winning Numbers

+
+
+

{currentDate}

+ + {loading ? ( +
+ +
+ ) : error ? ( +
+

{error}

+
+ ) : todaysMatches.length > 0 ? ( +
+ {/* Navigation buttons */} + + + + + {/* Current team results */} +
+
+ {todaysMatches[activeTeamIndex]?.team || "No Team"} +
+ +
+ {todaysMatches[activeTeamIndex]?.results.map((result, idx) => ( +
+
+ + {result.time} +
+
+ {result.upcoming ? "Upcoming" : result.result} +
+
+ ))} +
+
+ + {/* Team indicators */} +
+ {todaysMatches.map((_, idx) => ( +
+ ))} +
+
+ ) : ( +
+ No match results available for today. +
+ )} + + + + {/*
+ + +
*/} +
+
+ + {/* Next Drawing Box */} +
+
+

Next Drawing

+
+
+

Sat, Mar 22, 2025

+ +
+
+
67
+
+
+
58
+
+
+
11
+
+
+ +
+
HOURS
+
MINUTES
+
SECONDS
+
+ +
+ ESTIMATED JACKPOT +
+ +
+ $444 Million +
+ +
+
+ + {/* Winners Box */} +
+
+

Today's Timing

+
+
+ {/*

{currentDate}

*/} + + {/*
+
Team Alpha
+
JACKPOT WINNERS
+
None
+
+ +
+
Team Beta
+
$2 MILLION WINNERS
+
CO, TX
+
+ +
+
MATCH 5
+
$1 MILLION WINNERS
+
None
+
*/} + +
+
+
+ ); +}; + +export default HeroSection; \ No newline at end of file diff --git a/src/User/Home.js b/src/User/Home.js new file mode 100644 index 0000000..b299252 --- /dev/null +++ b/src/User/Home.js @@ -0,0 +1,207 @@ +import React, { useState, useEffect } from 'react'; +import { BarChart2, Calendar, RefreshCw, Clock, ChevronLeft, ChevronRight } from 'lucide-react'; +import axios from 'axios'; +import Footer from './Footer'; +import Header from './Header'; +import Translate from './Translate'; +import HeroSection from './Herosection'; + +const Home = () => { + + const [teams, setTeams] = useState([]); + const [dates, setDates] = useState([]); + const [selectedTeam, setSelectedTeam] = useState(null); + const [showChartView, setShowChartView] = useState(false); + const [showCalendar, setShowCalendar] = useState(false); + const [currentTime, setCurrentTime] = useState(""); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + const [calendarData, setCalendarData] = useState([]); + const [currentMonth, setCurrentMonth] = useState(new Date()); + const [upcomingMatches, setUpcomingMatches] = useState([]); + + + // API URL + const API_URL = 'http://localhost:5500/api'; + + // Format time + const formatTime = (timeString) => { + try { + const date = new Date(timeString); + return date.toLocaleTimeString("en-US", { hour: '2-digit', minute: '2-digit', hour12: true }); + } catch (e) { + return "XX:XX"; + } + }; + + // Check if a match is upcoming + const isUpcoming = (resultTime) => { + try { + const now = new Date(); + const matchTime = new Date(resultTime); + return matchTime > now; + } catch (e) { + return false; + } + }; + + // Fetch teams data + useEffect(() => { + const fetchData = async () => { + try { + setLoading(true); + + // Get all teams + const teamsResponse = await axios.get(`${API_URL}/teams`); + + // Get today's date and format it + const today = new Date(); + const todayFormatted = today.toISOString().split('T')[0]; + + // Get yesterday's date and format it + const yesterday = new Date(); + yesterday.setDate(yesterday.getDate() - 1); + const yesterdayFormatted = yesterday.toISOString().split('T')[0]; + + // Set dates for display + setDates([yesterdayFormatted, todayFormatted]); + + // Get today's results + const todayResultsResponse = await axios.get(`${API_URL}/results/daily?date=${todayFormatted}`); + const todayResults = todayResultsResponse.data; + + // Get yesterday's results + const yesterdayResultsResponse = await axios.get(`${API_URL}/results/daily?date=${yesterdayFormatted}`); + const yesterdayResults = yesterdayResultsResponse.data; + + // Process upcoming matches + const upcoming = todayResults.filter(result => isUpcoming(result.result_time)); + setUpcomingMatches(upcoming); + + // Combine team data with results + const teamsWithResults = teamsResponse.data.map(team => { + // Get all results for this team + const yesterdayTeamResults = yesterdayResults.filter(r => r.team === team.name); + const todayTeamResults = todayResults.filter(r => r.team === team.name); + + // Create result arrays for both days + const yesterdayResultsArr = yesterdayTeamResults.map(r => ({ + result: r.visible_result, + time: formatTime(r.result_time) + })); + + const todayResultsArr = todayTeamResults + .filter(r => !isUpcoming(r.result_time)) + .map(r => ({ + result: r.visible_result, + time: formatTime(r.result_time) + })); + + // Extract latest scheduled time + let latestTime = "XX:XX"; + const latestTodayResult = todayTeamResults + .sort((a, b) => new Date(b.result_time) - new Date(a.result_time)) + .find(r => r.result_time); + + if (latestTodayResult) { + latestTime = formatTime(latestTodayResult.result_time); + } + + return { + id: team.id, + name: team.name, + time: latestTime, + results: { + [yesterdayFormatted]: yesterdayResultsArr, + [todayFormatted]: todayResultsArr + } + }; + }); + + setTeams(teamsWithResults); + setLoading(false); + } catch (err) { + console.error("Error fetching data:", err); + setError("Failed to load team data. Please try again later."); + setLoading(false); + } + }; + + fetchData(); + + // Update current time every minute + const interval = setInterval(() => { + const now = new Date(); + const formattedTime = now.toLocaleString("en-IN", { timeZone: "Asia/Kolkata" }); + setCurrentTime(formattedTime); + }, 60000); + + // Set initial time + const now = new Date(); + const formattedTime = now.toLocaleString("en-IN", { timeZone: "Asia/Kolkata" }); + setCurrentTime(formattedTime); + + return () => clearInterval(interval); + }, []); + + + return ( +
+ +
+
+ {/* Header */} + {/*

+ Advertisement +

*/} + + {/* Advertisement Banner */} + {/*
+ Advertisement +
*/} + {/* Disclaimer */} +

+ Welcome to *Matka Satta Daily.com, your ultimate destination for accurate and timely Matka Satta results. We provide live updates, expert tips, and daily charts for all major Matka games, including **Desawar, **Delhi Bazar, **Shri Ganesh, **Faridabad, **Ghaziabad, and **Gali Matka*. Whether you're looking for results, guessing strategies, or historical data, we’ve got you covered. +

+ + {/* Informational Text */} +

+ Matka Satta Daily Results 2025: Desawar, Delhi Bazar, Shri Ganesh, Faridabad, Ghaziabad, and Gali Matka Live Updates +

+ + + + {/* Warning Message */} +

+ Please note, do not give any money to anyone in the name of leaked game, neither before nor after - Thank you +

+ + {/* Contact Link */} +

+ Click to contact us ➡ Click Here +

+ + {/* Timestamp */} +

+ Updated: {currentTime} IST. +

+
+
+ + +
+ +
+
+ ); +}; + +export default Home; \ No newline at end of file diff --git a/src/User/TeamTime.js b/src/User/TeamTime.js new file mode 100644 index 0000000..480df75 --- /dev/null +++ b/src/User/TeamTime.js @@ -0,0 +1,36 @@ +import { useState } from "react"; + +const TeamTime = () => { + const [teams, setTeams] = useState([ + { name: "GALI MATKA", time: "6:00 PM" }, + { name: "GHAZIABAD MATKA", time: "4:00 PM" }, + { name: "FARIDABAD MATKA", time: "12:30 PM" }, + { name: "SHRI GANESH MATKA", time: "11:00 AM" }, + { name: "DELHI BAZAR MATKA", time: "9:30 AM" }, + { name: "DESAWAR MATKA", time: "5:00 AM" }, + ]); + + return ( +
+ {/*

Team Match Schedule

*/} + + + + + + + + + {teams.map((team, index) => ( + + + + + ))} + +
Team NameTiming
{team.name}{team.time}
+
+ ); +}; + +export default TeamTime; diff --git a/src/User/Translate.js b/src/User/Translate.js new file mode 100644 index 0000000..31f1562 --- /dev/null +++ b/src/User/Translate.js @@ -0,0 +1,64 @@ +import { useState } from "react"; +import { Globe } from "lucide-react"; + +export default function Translate() { + + const [currentLanguage, setCurrentLanguage] = useState("English"); + + // Function to handle language change + const changeLanguage = (language) => { + setCurrentLanguage(language); + + // This would integrate with Google Translate API + // For actual implementation, you would need to use the Google Translate Element + if (language === "English") { + // Set to English + if (window.googleTranslateElementInit) { + const selectElement = document.querySelector('.goog-te-combo'); + if (selectElement) { + selectElement.value = 'en'; + selectElement.dispatchEvent(new Event('change')); + } + } + } else if (language === "Hindi") { + // Set to Hindi + if (window.googleTranslateElementInit) { + const selectElement = document.querySelector('.goog-te-combo'); + if (selectElement) { + selectElement.value = 'hi'; + selectElement.dispatchEvent(new Event('change')); + } + } + } + }; + + return ( + <> + {/* Translation Bar */} +
+
+
+ + Translate: +
+
+ + + {/* Hidden div for Google Translate Element */} +
+
+
+
+ + ); +} \ No newline at end of file diff --git a/src/pages/Faq.js b/src/pages/Faq.js index 82f77db..0bc647d 100644 --- a/src/pages/Faq.js +++ b/src/pages/Faq.js @@ -20,7 +20,7 @@ import { useState } from 'react'; {/* FAQ Section */}
{faqs.map((faq, index) => ( -
+
*/}
)} - {/* Chart View */} + {/* Chart View - FIXED TO HANDLE MULTIPLE RESULTS PER DAY */} {!loading && showChartView && selectedTeam && (

Monthly Chart: {selectedTeam.name}

-
+
@@ -391,14 +442,21 @@ const handleViewChart = async (team) => { - {selectedTeam.chartData && selectedTeam.chartData.map((item, index) => ( - - - - - - ))} - {(!selectedTeam.chartData || selectedTeam.chartData.length === 0) && ( + {selectedTeam.chartData && selectedTeam.chartData.length > 0 ? ( + selectedTeam.chartData.map((item, index) => ( + + + + + + )) + ) : ( @@ -462,8 +520,8 @@ const handleViewChart = async (team) => { {day && ( <>
{day.day}
@@ -522,7 +580,6 @@ const handleViewChart = async (team) => { @@ -583,7 +640,89 @@ const handleViewChart = async (team) => { )} -
+
+ {/* Section 7 */} +
+
+

Expert Matka Satta Daily Tips for 2025

+
+ +
+

Here are some expert tips to improve your Matka Satta game:

+ +
    +
  • + 1 + Follow the Charts: Use daily charts to identify patterns and trends. +
    • +
  • + 2 + Analyze Historical Data: Study past results to predict future outcomes. +
    • +
  • + 3 + Use Expert Tips: Follow our daily tips and strategies for better results. +
    • +
  • + 4 + Stay Updated: Check our platform for live updates and accurate results. +
    • +
+
+
+ + {/* Divider */} +
+ + {/* Section 8 */} +
+
+

Matka Satta Daily Chart for 2025

+
+ +
+

+ Our Matka Satta daily chart provides historical data and trends + for all major games, including Desawar, Delhi Bazar, Shri Ganesh, Faridabad, Ghaziabad, + and Gali Matka. Use the chart to improve your guessing accuracy and win more often. +

+ + {/* Sample chart preview */} +
+
+

Popular Matka Games

+ Last Updated: March 24, 2025 +
+ +
+ {["Desawar", "Delhi Bazar", "Shri Ganesh", "Faridabad", "Ghaziabad", "Gali Matka"].map((game) => ( +
+

{game}

+ {/*

View Chart

*/} +
+ ))} +
+
+
+
+ + {/* Divider */} +
+ + {/* Conclusion */} + {/*
+

Conclusion

+

+ At Matka Satta Daily.com, we provide accurate results, expert tips, and daily charts + for all major Matka games. Whether you're looking for Desawar Matka results at 5:00 AM or + Gali Matka results at 11:30 PM, we've got you covered. Stay ahead of the game with our + live updates and expert strategies. +

+ +
*/} +
+

+
); }; diff --git a/src/pages/Header.js b/src/pages/Header.js index f911ab7..6f57257 100644 --- a/src/pages/Header.js +++ b/src/pages/Header.js @@ -5,40 +5,73 @@ import { Link } from "react-router-dom"; export default function Header() { const [isOpen, setIsOpen] = useState(false); + // Add this effect to your App.js or index.js instead + /* + useEffect(() => { + const script = document.createElement('script'); + script.src = "https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"; + script.async = true; + document.body.appendChild(script); + + window.googleTranslateElementInit = () => { + new window.google.translate.TranslateElement( + { pageLanguage: 'en', includedLanguages: 'en,hi' }, + 'google_translate_element' + ); + }; + + return () => { + document.body.removeChild(script); + }; + }, []); + */ + return ( -
-
-
- {/* Logo */} - Advertisement - - {/* Desktop Menu */} - - - {/* Mobile Menu Button */} - + <> + {/* Translation Bar */} + {/*
+
+
+
*/} - {/* Mobile Menu */} - {isOpen && ( - - )} -
-
+ {/* Header */} +
+
+
+ {/* Logo */} + + Advertisement + + + {/* Desktop Menu */} + + + {/* Mobile Menu Button */} + +
+ + {/* Mobile Menu */} + {isOpen && ( + + )} +
+
+ ); -} +} \ No newline at end of file diff --git a/src/pages/Home2.js b/src/pages/Home2.js index 6838f3f..95fe5cb 100644 --- a/src/pages/Home2.js +++ b/src/pages/Home2.js @@ -4,6 +4,7 @@ import axios from 'axios'; import TodaysMatch from './TodaysMatch'; import Footer from './Footer'; import Header from './Header'; +import Translate from '../Translate'; const Home2 = () => { const [teams, setTeams] = useState([]); @@ -304,7 +305,8 @@ const Home2 = () => { return (
-
+ +
{/* Header */} {/*

@@ -323,25 +325,26 @@ const Home2 = () => { className="w-auto max-w-4xl h-14" />

*/} + {/* Disclaimer */} +

+ Welcome to *Matka Satta Daily.com, your ultimate destination for accurate and timely Matka Satta results. We provide live updates, expert tips, and daily charts for all major Matka games, including **Desawar, **Delhi Bazar, **Shri Ganesh, **Faridabad, **Ghaziabad, and **Gali Matka*. Whether you're looking for results, guessing strategies, or historical data, we’ve got you covered. +

{/* Informational Text */} -

- Delhi Diamond Satta Result And Monthly Satta Chart of March 2025 With Combined Chart of Gali, Desawar, Ghaziabad, Faridabad And Shri Ganesh from Matka Satta Fast, Matka Satta Result, Matka Satta Chart, Black Matka Satta and Matka Satta 786. +

+ Matka Satta Daily Results 2025: Desawar, Delhi Bazar, Shri Ganesh, Faridabad, Ghaziabad, and Gali Matka Live Updates

- {/* Disclaimer */} -

- Matka-Satta .com is the most popular gaming discussion forum for players to use freely and we are not in partnership with any gaming company. -

+ {/* Warning Message */}

- कृपया ध्यान दें, लीक गेम के नाम पर किसी को कोई पैसा न दें, ना पहले ना बाद में - धन्यवाद + Please note, do not give any money to anyone in the name of leaked game, neither before nor after - Thank you

{/* Contact Link */}

- हमसे संपर्क करने के लिए ➡ यहाँ क्लिक करें + Click to contact us ➡ Click Here

{/* Timestamp */} @@ -354,7 +357,7 @@ const Home2 = () => {
-
+
); }; diff --git a/src/pages/Random.js b/src/pages/Random.js new file mode 100644 index 0000000..6756156 --- /dev/null +++ b/src/pages/Random.js @@ -0,0 +1,309 @@ +import React, { useState, useEffect } from 'react'; +import { RefreshCw, Clock, ChevronDown, ChevronUp, Calendar, AlertTriangle } from 'lucide-react'; + +const MatkaResultsDashboard = () => { + const [todaysResults, setTodaysResults] = useState([]); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + const [currentDate, setCurrentDate] = useState(''); + const [expandedTeams, setExpandedTeams] = useState({}); + + // Matka teams and their scheduled times + const matkaTeams = [ + { + team: "Desawar Matka", + time: "5:00 AM", + description: "Start your day with the latest Desawar Matka results at 5:00 AM. Our platform provides real-time updates and accurate results to help you stay ahead.", + tip: "Analyze the Desawar Matka chart to identify patterns and trends for better predictions." + }, + { + team: "Delhi Bazar Matka", + time: "3:00 PM", + description: "Get the Delhi Bazar Matka results at 3:00 PM every day. Our live updates ensure you never miss a result.", + tip: "Follow the Delhi Bazar Matka chart to track historical results and predict future outcomes." + }, + { + team: "Shri Ganesh Matka", + time: "4:30 PM", + description: "Stay updated with the Shri Ganesh Matka results at 4:30 PM. Our platform offers live updates, daily charts, and expert tips to help you make the right decisions.", + tip: "Use the Shri Ganesh Matka chart to analyze trends and improve your guessing accuracy." + }, + { + team: "Faridabad Matka", + time: "6:00 PM", + description: "The Faridabad Matka results are declared at 6:00 PM every day. Check our platform for live updates, daily charts, and expert tips.", + tip: "Combine historical data with our expert tips for better predictions." + }, + { + team: "Ghaziabad Matka", + time: "9:30 PM", + description: "Get the latest Ghaziabad Matka results at 9:30 PM. Our platform provides real-time updates, daily charts, and expert tips to help you stay ahead.", + tip: "Follow the Ghaziabad Matka chart to identify patterns and trends." + }, + { + team: "Gali Matka", + time: "11:30 PM", + description: "End your day with the Gali Matka results at 11:30 PM. Our platform offers live updates, daily charts, and expert tips to help you make informed decisions.", + tip: "Use the Gali Matka chart to track historical results and improve your guessing accuracy." + } + ]; + + // Format time + const formatTime = (timeString) => { + return timeString; + }; + + // Toggle team expansion + const toggleTeamExpansion = (team) => { + setExpandedTeams(prev => ({ + ...prev, + [team]: !prev[team] + })); + }; + + // Generate mock results based on current time + useEffect(() => { + const generateMockResults = () => { + try { + setLoading(true); + + // Get today's date for display + const today = new Date(); + setCurrentDate(today.toLocaleDateString('en-US', { + weekday: 'short', + month: 'long', + day: 'numeric', + year: 'numeric' + })); + + // Generate mock results for each team + const results = matkaTeams.map(teamData => { + // Parse the time + const [hours, minutes] = teamData.time.split(':'); + const ampm = teamData.time.includes('PM') ? 'PM' : 'AM'; + const hour = parseInt(hours) + (ampm === 'PM' && parseInt(hours) !== 12 ? 12 : 0); + + // Create timestamp for today with the result time + const resultTime = new Date(); + resultTime.setHours(hour, parseInt(minutes), 0); + + // Generate random result for completed games + const isUpcoming = resultTime > today; + const result = isUpcoming ? null : `${Math.floor(Math.random() * 100)}-${Math.floor(Math.random() * 10)}`; + + return { + team: teamData.team, + results: [{ + result, + time: teamData.time, + timestamp: resultTime, + upcoming: isUpcoming, + description: teamData.description, + tip: teamData.tip + }], + upcomingCount: isUpcoming ? 1 : 0, + completedCount: isUpcoming ? 0 : 1 + }; + }); + + // Set all teams expanded by default + const expandedState = {}; + matkaTeams.forEach(team => { + expandedState[team.team] = true; + }); + setExpandedTeams(expandedState); + + setTodaysResults(results); + setLoading(false); + } catch (err) { + console.error("Error generating mock results:", err); + setError("Failed to load today's match data. Please try again later."); + setLoading(false); + } + }; + + generateMockResults(); + }, []); + + // Refresh data + const handleRefresh = () => { + setLoading(true); + setError(null); + + // Generate new mock results + setTimeout(() => { + const today = new Date(); + + // Update results - simulate some changes + const updatedResults = todaysResults.map(teamData => { + const resultTime = new Date(teamData.results[0].timestamp); + const isUpcoming = resultTime > today; + const result = isUpcoming ? null : `${Math.floor(Math.random() * 100)}-${Math.floor(Math.random() * 10)}`; + + return { + ...teamData, + results: [{ + ...teamData.results[0], + result, + upcoming: isUpcoming + }], + upcomingCount: isUpcoming ? 1 : 0, + completedCount: isUpcoming ? 0 : 1 + }; + }); + + setTodaysResults(updatedResults); + setLoading(false); + }, 1000); + }; + + // Get status badge + const getStatusBadge = (result) => { + if (result.upcoming) { + return ( + + Upcoming + + ); + } + + return ( + + Completed + + ); + }; + + return ( +
+ {/* Header */} +
+
+

Today's Matka Results

+
+ + {currentDate} +
+
+
+ + {/* Controls */} +
+
+ {todaysResults.length > 0 ? + `${todaysResults.length} Matka results today` : + "No results scheduled"} +
+ +
+ + {/* Loading indicator */} + {loading && ( +
+
+ + Loading Matka results... +
+
+ )} + + {/* Error message */} + {error && ( +
+
+
+ +
+
+

{error}

+
+
+
+ )} + + {/* Results display */} + {!loading && !error && ( +
+ {todaysResults.length > 0 ? ( +
+ {todaysResults.map((teamData, index) => ( +
+ {/* Team header - clickable to expand/collapse */} +
toggleTeamExpansion(teamData.team)} + > +
{teamData.team}
+
+
+ {teamData.results[0].time} +
+ {expandedTeams[teamData.team] ? ( + + ) : ( + + )} +
+
+ + {/* Team results */} + {expandedTeams[teamData.team] && ( +
+ {teamData.results.map((result, idx) => ( +
+
+
+ + {result.time} + {getStatusBadge(result)} +
+
+ {result.upcoming ? ( + -- + ) : ( + {result.result} + )} +
+
+ + {/* Description */} +
+

{result.description}

+
+ + {/* Pro Tip */} +
+

+ Pro Tip: {result.tip} +

+
+
+ ))} +
+ )} +
+ ))} +
+ ) : ( +
+
+ +
+

No results today

+

There are no Matka results scheduled for today.

+
+ )} +
+ )} +
+ ); +}; + +export default MatkaResultsDashboard; \ No newline at end of file diff --git a/src/pages/Teams.js b/src/pages/Teams.js new file mode 100644 index 0000000..f19b30d --- /dev/null +++ b/src/pages/Teams.js @@ -0,0 +1,36 @@ +import { useState } from "react"; + +const TeamMatchTable = () => { + const [teams, setTeams] = useState([ + { name: "GALI MATKA", time: "6:00 PM" }, + { name: "GHAZIABAD MATKA", time: "4:00 PM" }, + { name: "FARIDABAD MATKA", time: "12:30 PM" }, + { name: "SHRI GANESH MATKA", time: "11:00 AM" }, + { name: "DELHI BAZAR MATKA", time: "9:30 AM" }, + { name: "DESAWAR MATKA", time: "5:00 AM" }, + ]); + + return ( +
+ {/*

Team Match Schedule

*/} +
{new Date(item.result_date).toLocaleDateString()}{formatTime(item.result_time)}{item.result}
+ {item.result_time ? new Date(item.result_time).toLocaleDateString() : "N/A"} + + {item.result_time ? formatTime(item.result_time) : "N/A"} + + {item.visible_result || item.result || "N/A"} +
No chart data available
{team.name}
-
at {team.time}
handleViewChart(team)}>Record Chart
+ + + + + + + + {teams.map((team, index) => ( + + + + + ))} + +
Team NameTiming
{team.name}{team.time}
+
+ ); +}; + +export default TeamMatchTable; diff --git a/src/pages/Today.js b/src/pages/Today.js index 5118fbe..cadd8cd 100644 --- a/src/pages/Today.js +++ b/src/pages/Today.js @@ -1,9 +1,9 @@ import React, { useState, useEffect } from 'react'; -import { RefreshCw, Clock, ChevronDown, ChevronUp, Calendar } from 'lucide-react'; +import { RefreshCw, Clock, ChevronDown, ChevronUp, Calendar, AlertTriangle } from 'lucide-react'; import axios from 'axios'; -const Today = () => { - const [todaysMatches, setTodaysMatches] = useState([]); +const MatkaResultsDashboard = () => { + const [todaysResults, setTodaysResults] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); const [currentDate, setCurrentDate] = useState(''); @@ -12,6 +12,34 @@ const Today = () => { // API URL const API_URL = 'http://localhost:5500/api'; + // Matka team descriptions and tips + const matkaTeamInfo = { + "Desawar Matka": { + description: "Start your day with the latest Desawar Matka results at 5:00 AM. Our platform provides real-time updates and accurate results to help you stay ahead.", + tip: "Analyze the Desawar Matka chart to identify patterns and trends for better predictions." + }, + "Delhi Bazar Matka": { + description: "Get the Delhi Bazar Matka results at 3:00 PM every day. Our live updates ensure you never miss a result.", + tip: "Follow the Delhi Bazar Matka chart to track historical results and predict future outcomes." + }, + "Shri Ganesh Matka": { + description: "Stay updated with the Shri Ganesh Matka results at 4:30 PM. Our platform offers live updates, daily charts, and expert tips to help you make the right decisions.", + tip: "Use the Shri Ganesh Matka chart to analyze trends and improve your guessing accuracy." + }, + "Faridabad Matka": { + description: "The Faridabad Matka results are declared at 6:00 PM every day. Check our platform for live updates, daily charts, and expert tips.", + tip: "Combine historical data with our expert tips for better predictions." + }, + "Ghaziabad Matka": { + description: "Get the latest Ghaziabad Matka results at 9:30 PM. Our platform provides real-time updates, daily charts, and expert tips to help you stay ahead.", + tip: "Follow the Ghaziabad Matka chart to identify patterns and trends." + }, + "Gali Matka": { + description: "End your day with the Gali Matka results at 11:30 PM. Our platform offers live updates, daily charts, and expert tips to help you make informed decisions.", + tip: "Use the Gali Matka chart to track historical results and improve your guessing accuracy." + } + }; + // Format time const formatTime = (timeString) => { try { @@ -30,9 +58,9 @@ const Today = () => { })); }; - // Fetch today's matches + // Fetch today's results useEffect(() => { - const fetchTodaysMatches = async () => { + const fetchTodaysResults = async () => { try { setLoading(true); @@ -45,7 +73,7 @@ const Today = () => { year: 'numeric' })); - // Get today's results + // Get today's results from API const todayResultsResponse = await axios.get(`${API_URL}/today`); const todayResults = todayResultsResponse.data; @@ -60,7 +88,9 @@ const Today = () => { result: result.visible_result, time: formatTime(result.result_time), timestamp: new Date(result.result_time), - upcoming: new Date(result.result_time) > new Date() + upcoming: new Date(result.result_time) > new Date(), + description: matkaTeamInfo[result.team]?.description || "Stay updated with the latest results.", + tip: matkaTeamInfo[result.team]?.tip || "Check regularly for updates and follow trends." }); }); @@ -83,16 +113,16 @@ const Today = () => { }; }); - setTodaysMatches(groupedResults); + setTodaysResults(groupedResults); setLoading(false); } catch (err) { - console.error("Error fetching today's matches:", err); - setError("Failed to load today's match data. Please try again later."); + console.error("Error fetching today's results:", err); + setError("Failed to load today's Matka data. Please try again later."); setLoading(false); } }; - fetchTodaysMatches(); + fetchTodaysResults(); }, []); // Refresh data @@ -102,7 +132,7 @@ const Today = () => { const fetchData = async () => { try { - // Get today's results + // Get today's results from API const todayResultsResponse = await axios.get(`${API_URL}/today`); const todayResults = todayResultsResponse.data; @@ -117,7 +147,9 @@ const Today = () => { result: result.visible_result, time: formatTime(result.result_time), timestamp: new Date(result.result_time), - upcoming: new Date(result.result_time) > new Date() + upcoming: new Date(result.result_time) > new Date(), + description: matkaTeamInfo[result.team]?.description || "Stay updated with the latest results.", + tip: matkaTeamInfo[result.team]?.tip || "Check regularly for updates and follow trends." }); }); @@ -134,10 +166,10 @@ const Today = () => { }; }); - setTodaysMatches(groupedResults); + setTodaysResults(groupedResults); setLoading(false); } catch (err) { - setError("Failed to refresh match data. Please try again later."); + setError("Failed to refresh Matka data. Please try again later."); setLoading(false); } }; @@ -155,8 +187,6 @@ const Today = () => { ); } - // You could add logic here to style different results differently - // For example, showing wins in green, losses in red return ( Completed @@ -169,7 +199,7 @@ const Today = () => { {/* Header */}
-

Today's Matches

+

Today's Matka Results

{currentDate} @@ -180,9 +210,9 @@ const Today = () => { {/* Controls */}
- {todaysMatches.length > 0 ? - `${todaysMatches.length} teams with matches today` : - "No matches scheduled"} + {todaysResults.length > 0 ? + `${todaysResults.length} teams with results today` : + "No results scheduled"}
+
+ {/* Header */} +
+
+

Today's Matka Results

+
+ + {currentDate}
- - {/* Chart View */} - {showChartView && selectedTeam && ( -
-

Monthly Chart: {selectedTeam.name}

-
- - - - - - - - - {generateChartData().map((item, index) => ( - - - - - ))} - -
DateResult
{new Date(item.date).toLocaleDateString()}{item.result}
+
+ + {/* Controls */} +
+
+ {todaysResults.length > 0 ? + `${todaysResults.length} teams with results today` : + "No results scheduled"} +
+ +
+ + {/* Loading indicator */} + {loading && ( +
+
+ + Loading Matka results... +
+
+ )} + + {/* Error message */} + {error && ( +
+
+
+
-
- +
+

{error}

- )} - - {/* Calendar View */} - {showCalendar && ( -
-

- Calendar View: {new Date().toLocaleDateString('en-US', { month: 'long', year: 'numeric' })} -

- -
- {['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'].map(day => ( -
{day}
- ))} -
- -
- {generateCalendarData().map((day, index) => ( -
- {day && ( - <> -
{day.day}
- {teams.map(team => ( -
- {team.name.split(' ')[0]}: {day.results[team.id]} +
+ )} + + {/* Results display */} + {!loading && !error && ( +
+ {todaysResults.length > 0 ? ( +
+ {todaysResults.map((teamData, index) => ( +
+ {/* Team header - clickable to expand/collapse */} +
toggleTeamExpansion(teamData.team)} + > +
{teamData.team}
+
+
+ {teamData.upcomingCount} upcoming • {teamData.completedCount} completed +
+ {expandedTeams[teamData.team] ? ( + + ) : ( + + )} +
+
+ + {/* Team results */} + {expandedTeams[teamData.team] && ( +
+ {teamData.results.map((result, idx) => ( +
+
+
+ + {result.time} + {getStatusBadge(result)} +
+
+ {result.upcoming ? ( + -- + ) : ( + {result.result} + )} +
+
+ + {/* Description */} +
+

{result.description}

+
+ + {/* Pro Tip */} +
+

+ Pro Tip: {result.tip} +

+
))} - +
)}
))}
- -
- + ) : ( +
+
+ +
+

No results today

+

There are no Matka results scheduled for today.

-
- )} - - {/* Teams Table */} - {!showCalendar && ( -
- - - - - - - - - - - {teams.map(team => ( - - - - - - - ))} - -
Games List - {new Date(dates[0]).toLocaleDateString('en-US', { weekday: 'short' })} {new Date(dates[0]).getDate()}th - - {new Date(dates[1]).toLocaleDateString('en-US', { weekday: 'short' })} {new Date(dates[1]).getDate()}th - Chart
-
{team.name}
-
at {team.time}
-
Record Chart
- 		{team.results[dates[0]] || 'XX'}{team.results[dates[1]] || 'XX'} -
- -
-
- -
- -
-
- )} - -
+ )} +
+ )}
- ) + ); }; + +export default MatkaResultsDashboard; \ No newline at end of file