From a0b47cb84c85d0bdf4d494c5af83f3d629e0d6f8 Mon Sep 17 00:00:00 2001
From: Isaac <isaackim1412@gmail.com>
Date: Sun, 15 Dec 2024 13:20:23 +1100
Subject: [PATCH] lists events

---
 backend/src/config/storage.ts                 |  4 +-
 backend/src/index.ts                          |  9 +--
 .../EventManagementPage.tsx                   | 66 ++++++++++++-------
 .../SocietyDropdown.module.css                |  4 --
 4 files changed, 47 insertions(+), 36 deletions(-)

diff --git a/backend/src/config/storage.ts b/backend/src/config/storage.ts
index cd5ba3d..7198837 100644
--- a/backend/src/config/storage.ts
+++ b/backend/src/config/storage.ts
@@ -42,7 +42,7 @@ export const uploadFile = async (
     throw new Error(error.message);
   }
   console.log(data);
-  return data.path;
+  return (await getFileUrl(data.path)).publicUrl;
 };
 
 export const getFile = async (path: string) => {
@@ -62,7 +62,7 @@ export const getFileUrl = async (path: string) => {
     throw new Error('Storage client not initialised.');
   }
 
-  const { data } = await storageClient.from('images').getPublicUrl(path);
+  const { data } = storageClient.from('images').getPublicUrl(path);
 
   return data;
 };
diff --git a/backend/src/index.ts b/backend/src/index.ts
index 0ef8f80..8d4bb80 100644
--- a/backend/src/index.ts
+++ b/backend/src/index.ts
@@ -745,15 +745,8 @@ app.put('/event', async (req: TypedRequest<UpdateEventBody>, res: Response) => {
         description: req.body.description,
       },
     });
-    // we are choosing to send the image back as a url
-    let imageFile;
-    try {
-      imageFile = await getFileUrl(event.banner); // getFile(event.banner) if we wanted raw file
-    } catch (error) {
-      return res.status(400).json({ error: (error as Error).message });
-    }
 
-    return res.status(200).json({ ...event, banner: imageFile });
+    return res.status(200).json(eventRes);
   } catch (e) {
     return res.status(400).json({ message: 'Invalid event input' });
   }
diff --git a/frontend/src/Settings/SettingsPage/EventManagementPage/EventManagementPage.tsx b/frontend/src/Settings/SettingsPage/EventManagementPage/EventManagementPage.tsx
index 1f3f9c0..7c49aa7 100644
--- a/frontend/src/Settings/SettingsPage/EventManagementPage/EventManagementPage.tsx
+++ b/frontend/src/Settings/SettingsPage/EventManagementPage/EventManagementPage.tsx
@@ -2,33 +2,47 @@ import { Link, useLocation } from 'react-router';
 import Button from '../../../Button/Button';
 import { ButtonIcons, ButtonVariants } from '../../../Button/ButtonTypes';
 import { SettingsPage } from '../SettingsPage';
-import { useEffect } from 'react';
+import { useContext, useEffect, useState } from 'react';
 import classes from './EventManagementPage.module.css';
+import { UserContext } from '../../../UserContext/UserContext';
+
+interface SocietyEvent {
+  banner: string,
+  description: string,
+  id: number,
+  startDateTime: Date,
+  endDateTime: Date,
+  location: string,
+  name: string,
+  societyId: number,
+}
 
 export function EventManagementPage() {
   const location = useLocation();
-  const { creationSuccess } = location.state;
+  const { creationSuccess } = location.state ? location.state : { creationSuccess: false };
+  const { society } = useContext(UserContext);
+  const [events, setEvents] = useState<SocietyEvent[]>([]);
 
   useEffect(() => {
-    const getEvents = async () => {
-      const events = await fetch(
-        'http://localhost:5180/society/events?' +
-          new URLSearchParams({
-            id: '1',
-          }),
-        {
-          method: 'GET',
-          credentials: 'include',
-        }
-      );
-
-      if (events.ok) {
-        const eventsJson = await events.json();
-        console.log(eventsJson);
-      }
-    };
-    getEvents();
-  }, []);
+    if(society) {
+      const getEvents = async () => {
+        const events = await fetch(
+          'http://localhost:5180/society/events?' +
+            new URLSearchParams({
+              id: String(society?.id),
+            }),
+          {
+            method: 'GET',
+            credentials: 'include',
+          }
+        );
+  
+          const eventsJson: SocietyEvent[] = await events.json();
+          setEvents(eventsJson.map((event) => {return {...event, startDateTime: new Date(event.startDateTime), endDateTime: new Date(event.endDateTime)}}));
+      };
+      getEvents();
+    }
+  }, [society]);
 
   return (
     <SettingsPage
@@ -57,7 +71,15 @@ export function EventManagementPage() {
             <th>Where</th>
           </tr>
         </thead>
-        <tbody></tbody>
+        <tbody>
+          {events && events.map((event) => 
+            <tr>
+              <td>{event.name}</td>
+              <td>{event.endDateTime.toLocaleDateString('en-GB')}</td>
+              <td>{event.location}</td>
+            </tr>
+          )}
+        </tbody>
       </table>
     </SettingsPage>
   );
diff --git a/frontend/src/Settings/SocietyDropdown/SocietyDropdown.module.css b/frontend/src/Settings/SocietyDropdown/SocietyDropdown.module.css
index 4337ab3..5af634e 100644
--- a/frontend/src/Settings/SocietyDropdown/SocietyDropdown.module.css
+++ b/frontend/src/Settings/SocietyDropdown/SocietyDropdown.module.css
@@ -1,7 +1,3 @@
-.dropdown {
-
-}
-
 .container {
     position: absolute;
     right: 0;