get basic results page working

frontend/src/screens/Results.tsx

@@ -1,15 +1,8 @@
 import React, { useState, useEffect } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
 import styles from '../styles/Results.module.css'; // Make sure this path is correct
-
-interface File {
-  id: string;
-  name: string; // do we even use id and name?
-  professor: string;
-  course: string;
-  type?: string; // Assumed type is optional
-  // what other properties to add?semester?
-}
+import { getAuthHeaders } from '../utils/getAuthHeaders';
+import { File } from '../types/types';
 
 const Results: React.FC = () => {
   const [files, setFiles] = useState<File[]>([]);
@@ -23,7 +16,8 @@ const Results: React.FC = () => {
       try {
         // Need to double check this
         const queryString = location.search; // Includes the '?' prefix
-        const response = await fetch(`/api/path-to-filefilterview${queryString}`);
+        console.log(queryString)
+        const response = await fetch(`http://localhost:8000/api/files/filter${queryString}`, {headers: getAuthHeaders()});
         if (!response.ok) {
           throw new Error(`HTTP error! status: ${response.status}`);
         }
@@ -55,9 +49,26 @@ const Results: React.FC = () => {
         {isLoading ? (
           <p>Loading...</p>
         ) : files.length ? (
-          <table className={styles.resultsTable}>
-            {/* Table structure here */}
-          </table>
+            files.map((file) => (
+            <>
+            <div key={file.id} className={styles.fileCard}>
+              <h3>{file.filename}</h3>
+              <p>Course: {file.course.name} {file.course.number}</p>
+              <p>Professor: {file.professor.name}</p>
+              <p>Semester: {file.semester.name}</p>
+              <p>Upvotes: {file.upvotes.length}</p>
+              <p>Downvotes: {file.downvotes.length}</p>
+            </div>
+            <div key={file.id} className={styles.fileCard}>
+              <h3>{file.filename}</h3>
+              <p>Course: {file.course.name} {file.course.number}</p>
+              <p>Professor: {file.professor.name}</p>
+              <p>Semester: {file.semester.name}</p>
+              <p>Upvotes: {file.upvotes.length}</p>
+              <p>Downvotes: {file.downvotes.length}</p>
+                </div>
+                </>
+          ))
         ) : (
           <p>No results found.</p>
         )}