From 6c0002a43990a2d41a0637e42a211e7035df2d54 Mon Sep 17 00:00:00 2001
From: Laura Henning <laura-marie.henning@stud.tu-darmstadt.de>
Date: Mon, 6 May 2024 08:59:32 +0000
Subject: [PATCH] fix: rendering errors (missing key and h3 child of
 TableHeader)

---
 frontend/src/pages/Charging/ChargingList.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/Charging/ChargingList.tsx b/frontend/src/pages/Charging/ChargingList.tsx
index fecb0d03..b7820060 100644
--- a/frontend/src/pages/Charging/ChargingList.tsx
+++ b/frontend/src/pages/Charging/ChargingList.tsx
@@ -79,7 +79,11 @@ const ChargingList: React.FC<{
   return (
     <Table>
       <TableHead>
-        <h3>{props.chargingMethod} Charging</h3>
+        <TableRow>
+          <TableCell colSpan={tableColumnNames.length}>
+            <h3>{props.chargingMethod} Charging</h3>
+          </TableCell>
+        </TableRow>
         <TableRow>
           {tableColumnNames.map((colName, idx) => {
             return <TableCell key={idx}>{colName}</TableCell>;
@@ -91,8 +95,8 @@ const ChargingList: React.FC<{
           .filter((a) => a!.filter === "" && a!.dnn === "")
           .map((cd, idx) => {
             return (
-              <>
-                <TableRow key={idx}>
+              <React.Fragment key={idx}>
+                <TableRow>
                   <TableCell>{cd.ueId}</TableCell>
                   <TableCell>{cd.snssai}</TableCell>
                   <TableCell>{cd.dnn}</TableCell>
@@ -105,7 +109,7 @@ const ChargingList: React.FC<{
                   />
                 </TableRow>
                 {<PerFlowTableView Supi={cd.ueId!} Snssai={cd.snssai!} />}
-              </>
+              </React.Fragment>
             );
           })}
       </TableBody>