From f2e9aefde3525fd2e3769a39e91abdb5e5db2202 Mon Sep 17 00:00:00 2001
From: Frederick Zhang <frederickzhang@ucla.edu>
Date: Thu, 18 Apr 2024 09:52:51 -0700
Subject: [PATCH] transformData bug and update dynamicURL

- when points[0].Position is integer 0, we incorrectly set the version to 1.
    instead, just check if it exists
- change dynamic url to document id so we can upload multiple matches of the same video id (debugging/partial tagged stuff)
---
 app/(interactive)/matches/[slug]/page.js | 13 ++++++-------
 app/components/SearchDropdown.js         |  2 +-
 app/services/transformData.js            |  2 +-
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/app/(interactive)/matches/[slug]/page.js b/app/(interactive)/matches/[slug]/page.js
index f5a92e5..35aadf7 100644
--- a/app/(interactive)/matches/[slug]/page.js
+++ b/app/(interactive)/matches/[slug]/page.js
@@ -11,7 +11,7 @@ import PointsList from '../../../components/PointsList';
 import ScoreBoard from '../../../components/ScoreBoard';
 import MatchTiles from '@/app/components/MatchTiles'; // delete later just for testing
 
-import { collection, getDocs } from 'firebase/firestore';
+import { doc, getDoc } from 'firebase/firestore';
 import { db } from '../../../services/initializeFirebase';
 import transformData from '../../../services/transformData';
 import nameMap from '../../../services/nameMap';
@@ -36,7 +36,7 @@ const MatchPage = () => {
 
   // const router = useRouter();
   const pathname = usePathname()
-  const videoId = pathname.substring(pathname.lastIndexOf('/') + 1);
+  const docId = pathname.substring(pathname.lastIndexOf('/') + 1);
 
   // Function to jump to a specific time in the video, given in milliseconds, via the YouTube Player API
   const handleJumpToTime = (time) => {
@@ -48,11 +48,10 @@ const MatchPage = () => {
   useEffect(() => {
     const fetchData = async () => {
       try {
-        const querySnapshot = await getDocs(collection(db, 'matches'));
-        const matches = querySnapshot.docs.map((doc) => doc.data());
-        const match = matches.find((match) => match.videoId === videoId);
-        const matchv2 = transformData(match);
-        setMatchData(matchv2);
+        const documentRef = doc(db, 'matches', docId);
+        const documentSnapshot = await getDoc(documentRef);
+        const transformedData = transformData(documentSnapshot.data());
+        setMatchData(transformedData)
       } catch (error) {
         console.error('Error fetching data:', error);
       }
diff --git a/app/components/SearchDropdown.js b/app/components/SearchDropdown.js
index 972dcd6..0d4868c 100644
--- a/app/components/SearchDropdown.js
+++ b/app/components/SearchDropdown.js
@@ -23,7 +23,7 @@ const SearchDropdown = () => {
         .map((doc) => {
           const data = doc.data();
           return {
-            value: data.videoId, // Use 'value' to adhere to react-select convention
+            value: doc.id, // Use 'value' to adhere to react-select convention
             label: data.name
           };
         });
diff --git a/app/services/transformData.js b/app/services/transformData.js
index ee25a50..ab9f14c 100644
--- a/app/services/transformData.js
+++ b/app/services/transformData.js
@@ -4,7 +4,7 @@ function transformData(matchData) {
   let dataVersion = -1;
     
   // This is the original Dartfish format we used.
-  if (pointsData[0].Position) {
+  if (pointsData[0].hasOwnProperty('Position')) {
     dataVersion = 0;
   }
   // This is the new format Leo made.