download functinoality for match-list

bruin-tennis-consulting · May 30, 2024 · f55eca4 · f55eca4
1 parent 0997e4d
commit f55eca4
Showing 1 changed file with 29 additions and 1 deletion.
diff --git a/app/(interactive)/match-list/page.js b/app/(interactive)/match-list/page.js
@@ -3,7 +3,7 @@
 import React, { useEffect, useState } from 'react';
 import Link from 'next/link';
 import { db } from '../../services/initializeFirebase.js';
-import { collection, getDocs, deleteDoc, setDoc, doc } from 'firebase/firestore';
+import { collection, getDoc, getDocs, deleteDoc, setDoc, doc } from 'firebase/firestore';
 
 export default function MatchList() {
   const [matchData, setMatchData] = useState([]);
@@ -24,6 +24,33 @@ export default function MatchList() {
     await deleteDoc(doc(db, "matches", id));
     setMatchData(matchData.filter(match => match.id !== id));
   };
+  const handleDownload = async (id) => {
+    try {
+      const matchDoc = await getDoc(doc(db, "matches", id));
+      if (matchDoc.exists()) {
+        const matchData = matchDoc.data();
+        const points = matchData.points;
+        if (points) {
+          const jsonString = JSON.stringify(points, null, 2);
+          const blob = new Blob([jsonString], { type: 'application/json' });
+          const url = URL.createObjectURL(blob);
+          const a = document.createElement('a');
+          a.href = url;
+          a.download = `${matchDoc.id}_points.json`;
+          document.body.appendChild(a);
+          a.click();
+          document.body.removeChild(a);
+          URL.revokeObjectURL(url);
+        } else {
+          console.error("No points field found in document!");
+        }
+      } else {
+        console.error("No such document!");
+      }
+    } catch (error) {
+      console.error("Error fetching document: ", error);
+    }
+  };
   const handleRename = async (id) => {
     const docRef = doc(db, "matches", id);
     setDoc(docRef, {name:newName}, { merge: true })
@@ -45,6 +72,7 @@ export default function MatchList() {
             <div key={match.id}>
               <li>
                 <span>{match.name}<button onClick={() => handleDelete(match.id)}>Delete</button></span>
+                <span><button onClick={() => handleDownload(match.id)}>Download</button></span>
                 <Link href={`/tag-match/${match.id}`}><button>Tag Match</button></Link>
                 <br/>
                 <input onChange={(e) => setNewName(e.target.value)}/>