add LogList

Author: andresdlt03

ethernet-view/src/pages/LoggerPage/LogsColumn/LogLoader/LogList/LogItem/LogItem.tsx

@@ -0,0 +1 @@
+

ethernet-view/src/pages/LoggerPage/LogsColumn/LogLoader/LogList/LogList.tsx

@@ -0,0 +1,14 @@
+
+interface Props {
+    logNames: string[];
+}
+
+export const LogList = ({logNames}: Props) => {
+    return (
+        <div>
+            {logNames.map((logName) => (
+                <div key={logName}>{logName}</div>
+            ))}
+        </div>
+    )
+}

ethernet-view/src/pages/LoggerPage/LogsColumn/LogLoader/LogLoader.module.scss

@@ -2,5 +2,5 @@
     height: 100%;
     display: flex;
     flex-direction: column;
-    justify-content: end;
+    justify-content: space-between;
 }

ethernet-view/src/pages/LoggerPage/LogsColumn/LogLoader/LogLoader.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from "react"
 import { Dropzone } from "./Dropzone/Dropzone"
 import styles from "./LogLoader.module.scss"
+import { LogList } from "./LogList/LogList";
 
 export enum UploadState {
     IDLE = "idle",
@@ -31,11 +32,15 @@ export const LogLoader = () => {
 
     return (
         <div className={styles.logLoaderWrapper}>
+
+            <LogList logNames={logSessions.map((logSession) => logSession.name)} />
+
             <Dropzone 
                 uploadInformation={uploadInformation}
                 setUploadInformation={setUploadInformation}
                 addLogSession={(logSession: LogSession) => setLogSessions([...logSessions, logSession])}
             />
+            
         </div>
     )
 }