{matches.map((match, idx) => (
-
{
set ? set.opponentTiebreak : null
)}
isUnfinished={false}
- isTagged={match.isTagged}
+ isTagged={match.published}
/>
))}
diff --git a/app/components/Dashboard.js b/app/components/Dashboard.js
index 2d4f82f..e8fe404 100644
--- a/app/components/Dashboard.js
+++ b/app/components/Dashboard.js
@@ -2,18 +2,18 @@
import React, { useState, useMemo } from 'react'
import { useRouter } from 'next/navigation'
-import { useData } from './DataProvider'
-import styles from '../styles/Dashboard.module.css'
-import DashTileContainer from './DashTileContainer'
-// import getTeams from '@/app/services/getTeams.js'
-// import RosterList from './RosterList.js'
import Fuse from 'fuse.js'
+
+import { useData } from '@/app/DataProvider'
+import styles from '@/app/styles/Dashboard.module.css'
+
+import DashTileContainer from '@/app/components/DashTileContainer'
+// import getTeams from '@/app/services/getTeams.js'
+import RosterList from '@/app/components/RosterList.js'
+
import { searchableProperties } from '@/app/services/searchableProperties.js'
import SearchIcon from '@/public/search'
-// for log out
-import { useAuth } from './AuthWrapper'
-
const formatMatches = (matches) => {
return matches
.filter((match) => match.version === 'v1') // Filter for version 'v1'
@@ -25,19 +25,9 @@ const Dashboard = () => {
const { matches, logos } = useData()
const [searchTerm, setSearchTerm] = useState('')
const [selectedMatchSets, setSelectedMatchSets] = useState([])
-
+ console.log(matches)
const formattedMatches = formatMatches(matches)
-
- // for log out
- const { handleSignOut } = useAuth()
-
- // default show latest match: TODO BUG causes infinite re-rendering
- // useEffect(() => {
- // if (formattedMatches.length > 0) {
- // const latestMatchKey = `${formattedMatches[0].matchDate}#${formattedMatches[0].teams.opponentTeam}`
- // setSelectedMatchSets([latestMatchKey])
- // }
- // }, [formattedMatches])
+ console.log(formattedMatches)
// Fuzzy search
const fuse = useMemo(() => {
@@ -77,17 +67,28 @@ const Dashboard = () => {
)
}
- const displayMatchSets = searchTerm ? filteredMatchSets : selectedMatchSets
+ // A: Search Results
+ // B: Carousel Results
+ // Default: All
+ const displayMatchSets = useMemo(() => {
+ if (searchTerm) return filteredMatchSets
+ if (selectedMatchSets.length > 0) return selectedMatchSets
+
+ // fetch all, arr(set(matches))
+ return [
+ ...new Set(
+ formattedMatches.map((match) =>
+ match.matchDetails.duel
+ ? `${match.matchDate}#${match.teams.opponentTeam}`
+ : `_#${match.matchDetails.event}`
+ )
+ )
+ ]
+ }, [searchTerm, filteredMatchSets, selectedMatchSets, formattedMatches])
return (
-
BSA | Tennis Consulting
-
-
-
- Dashboard
@@ -119,7 +120,11 @@ const Dashboard = () => {
{formattedMatches.map((match, index) => {
- const matchKey = `${match.matchDate}#${match.teams.opponentTeam}`
+ let matchKey = `${match.matchDate}#${match.teams.opponentTeam}`
+ if (!match.matchDetails.duel) {
+ console.log('EVENT')
+ matchKey = `_#${match.matchDetails.event}`
+ }
return (
{
const singlesMatches = formattedMatches.filter(
(match) =>
match.singles &&
- matchKey === `${match.matchDate}#${match.teams.opponentTeam}`
+ ((match.matchDetails.duel &&
+ matchKey ===
+ `${match.matchDate}#${match.teams.opponentTeam}`) ||
+ (!match.matchDetails.duel &&
+ matchKey === `_#${match.matchDetails.event}`))
)
const doublesMatches = formattedMatches.filter(
(match) =>
!match.singles &&
- matchKey === `${match.matchDate}#${match.teams.opponentTeam}`
+ ((match.matchDetails.duel &&
+ matchKey ===
+ `${match.matchDate}#${match.teams.opponentTeam}`) ||
+ (!match.matchDetails.duel &&
+ matchKey === `_#${match.matchDetails.event}`))
)
+ console.log(matchKey)
const [matchDate, matchName] = matchKey.split('#')
return (
{
diff --git a/app/components/DashboardMatch.js b/app/components/DashboardMatch.js
index 5f508c5..3d6a7b8 100644
--- a/app/components/DashboardMatch.js
+++ b/app/components/DashboardMatch.js
@@ -1,7 +1,8 @@
import React from 'react'
-import MatchTiles from './MatchTiles'
+
+import MatchTiles from '@/app/components/MatchTiles'
import extractSetScores from '@/app/services/extractSetScores'
-import styles from '../styles/DashboardMatch.module.css' // Import the CSS module
+import styles from '@/app/styles/DashboardMatch.module.css' // Import the CSS module
const calculateMatchDate = (matchInfo) => {
if (matchInfo && matchInfo.length > 0 && matchInfo[0].matchDate) {
diff --git a/app/components/DashboardTile.js b/app/components/DashboardTile.js
index 8a6b970..0bd741a 100644
--- a/app/components/DashboardTile.js
+++ b/app/components/DashboardTile.js
@@ -1,6 +1,21 @@
-import React, { useEffect, useState } from 'react';
-import styles from '../styles/DashboardTile.module.css';
-import { useData } from './DataProvider';
+import React, { useEffect, useState } from 'react'
+
+import styles from '@/app/styles/DashboardTile.module.css'
+
+import { useData } from '@/app/DataProvider'
+
+// Calculate winner of match
+const calculateWinner = (player1, player2) => {
+ const player1Total = player1.reduce(
+ (total, current) => (!isNaN(current.score) ? total + current.score : total),
+ 0
+ )
+ const player2Total = player2.reduce(
+ (total, current) => (!isNaN(current.score) ? total + current.score : total),
+ 0
+ )
+ return player1Total > player2Total
+}
const DashboardTile = ({
clientTeam,
diff --git a/app/components/ExtendedList.js b/app/components/ExtendedList.js
index 84b6b6d..9e0d775 100644
--- a/app/components/ExtendedList.js
+++ b/app/components/ExtendedList.js
@@ -1,10 +1,12 @@
import React, { useEffect, useState } from 'react'
-import styles from '../styles/ExtendedList.module.css'
+
+import styles from '@/app/styles/ExtendedList.module.css'
import getTeams from '@/app/services/getTeams.js'
-import Winner from '../../public/Winner.js'
-import Error from '../../public/Error.js'
-import DoubleFault from '../../public/DoubleFault'
-import PlayButton from '../../public/PlayButton'
+
+import Winner from '@/public/Winner.js'
+import Error from '@/public/Error.js'
+import DoubleFault from '@/public/DoubleFault'
+import PlayButton from '@/public/PlayButton'
const ExtendedList = ({
pointsData,
diff --git a/app/components/FilterList.js b/app/components/FilterList.js
index ed215dc..e7100e8 100644
--- a/app/components/FilterList.js
+++ b/app/components/FilterList.js
@@ -1,9 +1,8 @@
-// components/FilterList.js
-
import React, { useEffect, useState } from 'react'
-import styles from '../styles/FilterList.module.css'
-// This file renammes columns to more human-readable names
-import nameMap from '../services/nameMap.js'
+
+import styles from '@/app/styles/FilterList.module.css'
+// This file renames columns to more human-readable names
+import nameMap from '@/app/services/nameMap.js'
const exclusiveGroups = {
player1ReturnFhBh: ['Forehand', 'Backhand'],
diff --git a/app/components/Footer.js b/app/components/Footer.js
index 9f0933d..6e9781b 100644
--- a/app/components/Footer.js
+++ b/app/components/Footer.js
@@ -1,5 +1,5 @@
-import styles from '../styles/Footer.module.css'
-import '../styles/global.css'
+import styles from '@/app/styles/Footer.module.css'
+import '@/app/styles/globals.css'
const Footer = () => {
return (
diff --git a/app/components/LandingPage.js b/app/components/LandingPage.js
index 4380db9..091cf3d 100644
--- a/app/components/LandingPage.js
+++ b/app/components/LandingPage.js
@@ -1,86 +1,91 @@
import Image from 'next/image'
import { useState } from 'react'
-import { useAuth } from '../components/AuthWrapper'
+import styles from '@/app/styles/LandingPage.module.css'
+import navStyles from '@/app/styles/Navbar.module.css'
import SignIn from './SignIn'
-import styles from '../styles/LandingPage.module.css'
-export default function LandingPage() {
- const [showSignIn, setShowSignIn] = useState(false)
- const { authUser } = useAuth()
+const Land = () => {
+ return (
+
-
{`v ${matchName}`}
+{matchName}
{matchDate}
- {/*
Roster being fixed ...
+ {Roster being fixed ...
*/}
+
+ )
+}
- const handleSignIn = () => {
- setShowSignIn(true) // Show SignIn component when Sign In button is clicked
- }
+const LandingPage = () => {
+ const [showSignIn, setShowSignIn] = useState(false)
return (
+
+ BRUIN
+SPORTS
+ANALYTICS
+
+
+ Empowering Tennis Excellence
+through Data-Driven Insights
+ +
+
+
+
+
+
- {!showSignIn ? (
- <>
-
- {player1GameScore}
+ {player1GameScore}
{pointScore ? player1PointScore : player1TiebreakScore}
@@ -97,7 +95,7 @@ const ScoreBoard = ({
key={index}
style={{
position: 'relative',
- opacity: score.score > player2FinalScores[index]?.score ? '100%' : '40%'
+ opacity: score.score > player1FinalScores[index].score ? 1 : 0.4
}}
>
{player2TieScores[index] ? (
@@ -121,9 +119,7 @@ const ScoreBoard = ({
) : null
)}
- {player2GameScore}
+ {player2GameScore}
{pointScore ? player2PointScore : player2TiebreakScore}
diff --git a/app/components/SignIn.js b/app/components/SignIn.js
index 2f1a33b..30573c7 100644
--- a/app/components/SignIn.js
+++ b/app/components/SignIn.js
@@ -1,16 +1,12 @@
-// components/SignIn.js
import React, { useState } from 'react'
import { getAuth, signInWithEmailAndPassword } from 'firebase/auth'
-import styles from '../styles/SignIn.module.css'
-import { useAuth } from './AuthWrapper'
+import styles from '@/app/styles/SignIn.module.css'
-const SignInPage = () => {
+const SignIn = () => {
const [credentials, setCredentials] = useState({ username: '', password: '' })
const [error, setError] = useState(null)
- const { authUser, userProfile, handleSignOut } = useAuth() // Use useAuth hook to get the user and sign-out function
console.log(error)
- console.log(userProfile)
const handleSignIn = async (e) => {
e.preventDefault()
@@ -32,18 +28,6 @@ const SignInPage = () => {
return (
-
- BSA | Tennis Consulting
-
- {!authUser && (
- // Show Sign In button
+ {/* STATIC NAVBAR: FOR SIGNIN */}
+
)
}
+
+export default LandingPage
diff --git a/app/components/MatchTiles.js b/app/components/MatchTiles.js
index 0d6b7fe..d2340f2 100644
--- a/app/components/MatchTiles.js
+++ b/app/components/MatchTiles.js
@@ -1,5 +1,6 @@
import React, { useEffect, useState } from 'react'
-import styles from '../styles/MatchTiles.module.css'
+
+import styles from '@/app/styles/MatchTiles.module.css'
import getTeams from '@/app/services/getTeams.js'
// Calculate winner of match
@@ -16,7 +17,7 @@ const calculateWinner = (player1, player2) => {
}
const MatchTiles = ({
- matchName,
+ // matchName,
clientTeam,
opponentTeam,
matchDetails,
diff --git a/app/components/Navbar.js b/app/components/Navbar.js
new file mode 100644
index 0000000..c7c4c64
--- /dev/null
+++ b/app/components/Navbar.js
@@ -0,0 +1,29 @@
+'use client'
+import Link from 'next/link'
+
+import { useAuth } from '@/app/AuthWrapper'
+import styles from '@/app/styles/Navbar.module.css'
+
+// Navbar is wrapped by Auth: show this when signed in
+const Navbar = () => {
+ const { handleSignOut } = useAuth()
+
+ return (
+
+
+
+
+ {/* show LandingPage or SignIn Page */}
+ {!showSignIn ?
+
- BSA | Tennis Consulting
+
+ {!showSignIn ? (
+
+ ) : (
+
)}
-
- BRUIN
-SPORTS
-ANALYTICS
-
-
- Empowering Tennis Excellence
-through Data-Driven Insights
- -
-
-
-
-
-
- ) : (
-
+
+
+
+ )
+}
+
+export default Navbar
diff --git a/app/components/PlayerProfileHeader.js b/app/components/PlayerProfileHeader.js
new file mode 100644
index 0000000..7d61ce8
--- /dev/null
+++ b/app/components/PlayerProfileHeader.js
@@ -0,0 +1,59 @@
+import React from 'react'
+import Image from 'next/image'
+
+import styles from '@/app/styles/PlayerProfileHeader.module.css' // Assuming you have CSS module for styling
+import govinImage from '@/public/images/govin.png'
+import StatBox from '@/app/components/StatBox'
+
+const PlayerProfileHeader = ({ playerData }) => {
+ return (
+
+
+ + + BSA | Tennis Consulting + +
+
+
+
+
+ {/* Player Basic Information */}
+
+ )
+}
+
+export default PlayerProfileHeader
diff --git a/app/components/PointsList.js b/app/components/PointsList.js
index b79e77f..179d45c 100644
--- a/app/components/PointsList.js
+++ b/app/components/PointsList.js
@@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react'
-import styles from '../styles/PointsList.module.css'
+import styles from '@/app/styles/PointsList.module.css'
import getTeams from '@/app/services/getTeams.js'
const PointsList = ({
diff --git a/app/components/RosterList.js b/app/components/RosterList.js
index 540ccb9..005e933 100644
--- a/app/components/RosterList.js
+++ b/app/components/RosterList.js
@@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react'
-import RosterTile from './RosterTile'
-import { db } from '../services/initializeFirebase.js' // Ensure storage is exported from initializeFirebase.js
+import RosterTile from '@/app/components/RosterTile'
+import { db } from '@/app/services/initializeFirebase.js' // Ensure storage is exported from initializeFirebase.js
import { collection, getDocs } from 'firebase/firestore'
const RosterList = () => {
@@ -25,7 +25,7 @@ const RosterList = () => {
}
fetchTeams()
- }, [mensRoster])
+ }, [])
return (
// entire container
diff --git a/app/components/RosterTile.js b/app/components/RosterTile.js
index 43e2378..9deb935 100644
--- a/app/components/RosterTile.js
+++ b/app/components/RosterTile.js
@@ -1,6 +1,6 @@
import React, { useState } from 'react'
-import styles from '../styles/Roster.module.css'
+import styles from '@/app/styles/Roster.module.css'
const RosterTile = ({ firstName, lastName, playerPhoto }) => {
const [playerClicked, setPlayerClicked] = useState(false)
diff --git a/app/components/ScoreBoard.js b/app/components/ScoreBoard.js
index 3cebd19..f31ece2 100644
--- a/app/components/ScoreBoard.js
+++ b/app/components/ScoreBoard.js
@@ -24,11 +24,11 @@ const ScoreBoard = ({
const [localPlayData, setLocalPlayData] = useState(playData);
- useEffect(() => { //smooth transition effect when scores change
+ useEffect(() => {
if (playData) {
const timeout = setTimeout(() => {
setLocalPlayData(playData);
- }, 100);
+ }, 500);
return () => clearTimeout(timeout);
}
}, [playData]);
@@ -55,7 +55,7 @@ const ScoreBoard = ({
key={index}
style={{
position: 'relative',
- opacity: score.score > player2FinalScores[index]?.score ? '100%' : '40%'
+ opacity: score.score > player2FinalScores[index].score ? 1 : 0.4
}}
>
{player1TieScores[index] ? (
@@ -80,9 +80,7 @@ const ScoreBoard = ({
) : null
)}
-
+
+
+ {/* Profile Picture */}
+
+
+ {playerData.name.toUpperCase()}
++ Class : {playerData.class} | Height :{' '} + {playerData.height} + | Age : {playerData.age} +
+ + {/* Player Bio */} +
+
+ {playerData.bio}
+
+ {/* Win Counters */}
+
+
+ 
+
+ Filter
+
+
+
+
+
+
-
-
-
- BSA | Tennis Consulting
-
- {authUser ? (
-
- ) : (
-
- )}
-
-