1 files changed, 34 insertions, 18 deletions

diff --git a/src/pages/File.tsx b/src/pages/File.tsx
index bbbdac2..f9f1a73 100644
--- a/src/pages/File.tsx
+++ b/src/pages/File.tsx
@@ -5,13 +5,12 @@ import { FSTracerFile } from "../lib/types";
 
 export default function File(props: any) {
   const navigate = useNavigate()
-  let { filepath } = useParams();
+  let { fileID } = useParams();
 
-  console.log("FILEPATH: ", filepath)
+  console.log("FILEID: ", fileID)
 
   const [files, setFiles] = useState([])
-
-  const latestFile = files[0] as FSTracerFile | undefined
+  const [file, setFile] = useState<FSTracerFile>()
 
   const maxFilesToShow = 20;
 
@@ -22,19 +21,36 @@ export default function File(props: any) {
   }, [props.session])
 
   const fetchFiles = useCallback(async () => {
-    console.log("FETCHIN FILES")
-    const { data, error } = await props.supabase
+    console.log("FETCHING FILE")
+    const { data: data1, error: err1 } = await props.supabase
       .from('file')
       .select()
-      .eq('absolute_path', filepath)
+      .eq('id', fileID)
+    if (err1) {
+      console.error(err1)
+      return
+    }
+
+    if (data1.length === 0) {
+      return
+    }
+
+    let fetchedFile = data1[0] as FSTracerFile;
+    setFile(fetchedFile)
+
+    console.log("FETCHIN FILES", JSON.stringify(fetchedFile))
+    const { data: data2, error: err2 } = await props.supabase
+      .from('file')
+      .select()
+      .eq('absolute_path', fetchedFile.absolute_path)
       .order('timestamp', { ascending: false })
       .range(0, maxFilesToShow)
-    if (error) {
-      console.error(error)
+    if (err2) {
+      console.error(err2)
       return
     }
-    console.log("RAW FILES: ", data)
-    setFiles(data.map((file: any) => {
+    console.log("RAW FILES: ", data2)
+    setFiles(data2.map((file: any) => {
       return file as File
     }))
     console.log("FETCHED FILES")
@@ -42,7 +58,7 @@ export default function File(props: any) {
 
   useEffect(() => {
     fetchFiles()
-  }, [])
+  }, [props.supabase])
 
   const formatFilePathAsName = (filepath: string) => {
     const parts = filepath.split('/')
@@ -54,22 +70,22 @@ export default function File(props: any) {
       <div className="flex h-screen">
         <SideBar />
         <main className="flex-1 overflow-y-auto my-4">
-          {filepath && latestFile ? <>
+          {fileID && file !== undefined ? <>
             <div className="flex flex-col items-center">
               {
-                formatFilePathAsName(filepath)
+                formatFilePathAsName(file.absolute_path)
               }
             </div>
             <div className="mt-5 flex flex-col items-center">
               <div className="block border rounded shadowpy-5 px-5 bg-blue">
-                {latestFile && <FileInfo file={latestFile} />}
+                <FileInfo file={file} />
               </div>
             </div>
             <div className="mt-5 flex flex-col items-center">
               <div className="block border rounded shadow py-5 px-5 bg-blue">
-                {files.map((file: FSTracerFile) => (
-                  <div key={file.id}>
-                    <p>{file.absolute_path} - {file.timestamp}</p>
+                {files.map((currFile: FSTracerFile) => (
+                  <div key={currFile.id}>
+                    <p>{currFile.absolute_path} - {currFile.timestamp} {currFile.id === file.id && "*"}</p>
                   </div>
                 ))
                 }