fix: rendering errors (missing key and h3 child of TableHeader)

free5gc · May 9, 2024 · 6c0002a · 6c0002a
1 parent 01623fb
commit 6c0002a
Showing 1 changed file with 8 additions and 4 deletions.
diff --git 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>