From 81b28d9413c9e8fba6b28587fae9ce5716bd8208 Mon Sep 17 00:00:00 2001
From: Jason Madigan <jason@jasonmadigan.com>
Date: Fri, 11 Oct 2024 11:07:44 +0100
Subject: [PATCH] Fixed overlapping edit/delete actions in paginated resource
 lists. Also fixed a bug where HTTPRoutes that are accepted are in an Unknown
 status

Signed-off-by: Jason Madigan <jason@jasonmadigan.com>
---
 src/components/ResourceList.tsx | 45 ++++++++++++++++++---------------
 src/components/kuadrant.css     |  5 ++++
 2 files changed, 30 insertions(+), 20 deletions(-)

diff --git a/src/components/ResourceList.tsx b/src/components/ResourceList.tsx
index 343e654..a21d7dd 100644
--- a/src/components/ResourceList.tsx
+++ b/src/components/ResourceList.tsx
@@ -26,18 +26,20 @@ import {
 import DropdownWithKebab from './DropdownWithKebab';
 
 const getStatusLabel = (obj: any) => {
-  // Gateway or HTTPRoute
-  if (obj.kind === 'Gateway' || obj.kind === 'HTTPRoute') {
-    const acceptedCondition = obj.status?.conditions?.find(
+  // Check if status has parents and handle accordingly
+  const parentConditions = obj.status?.parents?.flatMap((parent: any) => parent.conditions) || [];
+
+  if (parentConditions.length > 0) {
+    const acceptedCondition = parentConditions.find(
       (cond: any) => cond.type === 'Accepted' && cond.status === 'True',
     );
-    const programmedCondition = obj.status?.conditions?.find(
+    const programmedCondition = parentConditions.find(
       (cond: any) => cond.type === 'Programmed' && cond.status === 'True',
     );
-    const conflictedCondition = obj.status?.conditions?.find(
+    const conflictedCondition = parentConditions.find(
       (cond: any) => cond.type === 'Conflicted' && cond.status === 'True',
     );
-    const resolvedRefsCondition = obj.status?.conditions?.find(
+    const resolvedRefsCondition = parentConditions.find(
       (cond: any) => cond.type === 'ResolvedRefs' && cond.status === 'True',
     );
 
@@ -74,14 +76,15 @@ const getStatusLabel = (obj: any) => {
     );
   }
 
+  // If no parent conditions, fallback to general condition checks
   if (!obj.status || !obj.status.conditions || obj.status.conditions.length === 0) {
-    // No status/conditions
     return (
       <Label isCompact icon={<OutlinedHourglassIcon />} color="cyan">
         Creating
       </Label>
     );
   }
+
   const enforcedCondition = obj.status.conditions.find(
     (cond: any) => cond.type === 'Enforced' && cond.status === 'True',
   );
@@ -348,19 +351,21 @@ const ResourceList: React.FC<ResourceListProps> = ({
             columns={usedColumns}
             Row={ResourceRow}
           />
-          <Pagination
-            itemCount={filteredData.length}
-            perPage={perPage}
-            page={currentPage}
-            onSetPage={onSetPage}
-            onPerPageSelect={onPerPageSelect}
-            variant="bottom"
-            perPageOptions={[
-              { title: '5', value: 5 },
-              { title: '10', value: 10 },
-              { title: '20', value: 20 },
-            ]}
-          />
+          <div className="kuadrant-pagination-left">
+            <Pagination
+              itemCount={filteredData.length}
+              perPage={perPage}
+              page={currentPage}
+              onSetPage={onSetPage}
+              onPerPageSelect={onPerPageSelect}
+              variant="bottom"
+              perPageOptions={[
+                { title: '5', value: 5 },
+                { title: '10', value: 10 },
+                { title: '20', value: 20 },
+              ]}
+            />
+          </div>
         </ListPageBody>
       </div>
     </>
diff --git a/src/components/kuadrant.css b/src/components/kuadrant.css
index bdee775..e4dc2b0 100644
--- a/src/components/kuadrant.css
+++ b/src/components/kuadrant.css
@@ -154,3 +154,8 @@
 .kuadrant-policy-list-body .co-m-pane__body {
   padding: 0;
 }
+
+.kuadrant-pagination-left {
+  display: flex;
+  justify-content: flex-start;
+}
\ No newline at end of file