add extractedFiles state to MediaContext

client/src/Pages/ProcessingPage.tsx

@@ -8,7 +8,7 @@ import JSZip from "jszip";
 
 function ProcessingPage() {
   const navigate = useNavigate();
-  const { mediaFile, response } = useMediaContext();
+  const { mediaFile, response, setExtractedFiles } = useMediaContext();
   const [progress, setProgress] = useState(0);
   const [statusText, setStatusText] = useState("Analyzing media...");
 
@@ -70,11 +70,10 @@ function ProcessingPage() {
       if (!fileData.dir) {
         const fileBlob = await fileData.async("blob");
         const fileURL = URL.createObjectURL(fileBlob);
-        fileURLs.push({ filename, fileURL });
+        fileURLs.push({ name: filename, url: fileURL });
       }
     }
-
-    fileURLs.forEach(({ filename, fileURL }) => console.log(`File: ${filename}, URL: ${fileURL}`));
+    setExtractedFiles(fileURLs);
     setProgress(100);
   };
 

client/src/Pages/ResultsPage.tsx

@@ -21,7 +21,8 @@ import { useMediaContext } from '../contexts/MediaContext';
 
 function ResultsPage() {
   const navigate = useNavigate();
-  const { mediaFile, response } = useMediaContext();
+  const { mediaFile, response, extractedFiles } = useMediaContext();
+  console.log("Extracted files are", extractedFiles);
 //  const [isPlaying, setIsPlaying] = useState(false);
   const audioRefs = [useRef(null), useRef(null), useRef(null),useRef(null)];
   const audioClass = response.audio_class