Don't display a table in the popover if no tasks exist

Signed-off-by: Scott J Dickerson <[email protected]>
konveyor · Jul 1, 2024 · 8cf2f5e · 8cf2f5e
1 parent 9de8187
commit 8cf2f5e
Showing 1 changed file with 37 additions and 34 deletions.
diff --git a/client/src/app/pages/applications/applications-table/components/column-application-name.tsx b/client/src/app/pages/applications/applications-table/components/column-application-name.tsx
@@ -98,40 +98,43 @@ export const ColumnApplicationName: React.FC<{
   const status = statusMap[application.tasksStatus];
   const StatusIcon = status.icon;
 
-  const bodyContent = (
-    <Table variant="compact" borders={false}>
-      <Thead>
-        <Tr>
-          <Td>Id</Td>
-          <Td>Kind</Td>
-          <Td>Started</Td>
-        </Tr>
-      </Thead>
-      <Tbody>
-        {Object.entries(application.tasksByKind)
-          .sort((a, b) => universalComparator(a[0], b[0]))
-          .map(([kind, [task]]) => {
-            const startTime = dayjs(task.started ?? task.createTime);
-            return (
-              <Tr key={`popover-a${application.id}-k${kind}`}>
-                <Td>{task.id}</Td>
-                <Td>
-                  <IconWithLabel
-                    icon={<TaskStateIcon state={task.state} />}
-                    label={<Link to={linkToDetails(task)}>{kind}</Link>}
-                  />
-                </Td>
-                <Td>
-                  <Tooltip content={startTime.format("ll, LTS")}>
-                    <span>{startTime.fromNow()}</span>
-                  </Tooltip>
-                </Td>
-              </Tr>
-            );
-          })}
-      </Tbody>
-    </Table>
-  );
+  const bodyContent =
+    application.tasksStatus === "None" ? (
+      <></>
+    ) : (
+      <Table variant="compact" borders={false}>
+        <Thead>
+          <Tr>
+            <Td>Id</Td>
+            <Td>Kind</Td>
+            <Td>Started</Td>
+          </Tr>
+        </Thead>
+        <Tbody>
+          {Object.entries(application.tasksByKind)
+            .sort((a, b) => universalComparator(a[0], b[0]))
+            .map(([kind, [task]]) => {
+              const startTime = dayjs(task.started ?? task.createTime);
+              return (
+                <Tr key={`popover-a${application.id}-k${kind}`}>
+                  <Td>{task.id}</Td>
+                  <Td>
+                    <IconWithLabel
+                      icon={<TaskStateIcon state={task.state} />}
+                      label={<Link to={linkToDetails(task)}>{kind}</Link>}
+                    />
+                  </Td>
+                  <Td>
+                    <Tooltip content={startTime.format("ll, LTS")}>
+                      <span>{startTime.fromNow()}</span>
+                    </Tooltip>
+                  </Td>
+                </Tr>
+              );
+            })}
+        </Tbody>
+      </Table>
+    );
 
   return (
     <Popover