From 9be2ac1f5a3df801179c93bfb2f35f85e57cfa22 Mon Sep 17 00:00:00 2001
From: Ian Bolton <ibolton@redhat.com>
Date: Fri, 16 Feb 2024 13:23:08 -0500
Subject: [PATCH] :bug: Fix wave subtable pagination (#1689)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Resolves https://issues.redhat.com/browse/MTA-1790

<img width="1613" alt="Screenshot 2024-02-15 at 2 09 40 PM"
src="https://github.com/konveyor/tackle2-ui/assets/11218376/ce001d5f-24b5-49fc-b4ea-a879b4839308">
<img width="1630" alt="Screenshot 2024-02-15 at 2 09 08 PM"
src="https://github.com/konveyor/tackle2-ui/assets/11218376/8a46de3e-5025-4648-aab6-2dd1f6e899cb">
<img width="1618" alt="Screenshot 2024-02-15 at 2 09 01 PM"
src="https://github.com/konveyor/tackle2-ui/assets/11218376/a0f7c3c4-0879-465b-8e51-a0c92750bb7a">

Signed-off-by: Ian Bolton <ibolton@redhat.com>
---
 .../components/stakeholders-table.tsx         | 21 ++++++++++++++-----
 .../components/wave-applications-table.tsx    | 21 ++++++++++++++-----
 2 files changed, 32 insertions(+), 10 deletions(-)

diff --git a/client/src/app/pages/migration-waves/components/stakeholders-table.tsx b/client/src/app/pages/migration-waves/components/stakeholders-table.tsx
index 7aeae65abf..e40eac74e3 100644
--- a/client/src/app/pages/migration-waves/components/stakeholders-table.tsx
+++ b/client/src/app/pages/migration-waves/components/stakeholders-table.tsx
@@ -58,11 +58,14 @@ export const WaveStakeholdersTable: React.FC<IWaveStakeholdersTableProps> = ({
       <Toolbar {...toolbarProps}>
         <ToolbarContent>
           <ToolbarItem {...paginationToolbarItemProps}>
-            <SimplePagination
-              idPrefix={`expanded-migration-wave-${migrationWave.name}-apps-table`}
-              isTop
-              paginationProps={paginationProps}
-            />
+            {migrationWave.allStakeholders.length > 9 && (
+              <SimplePagination
+                idPrefix={`expanded-migration-wave-${migrationWave.name}-apps-table`}
+                isTop
+                paginationProps={paginationProps}
+                isCompact
+              />
+            )}
           </ToolbarItem>
         </ToolbarContent>
       </Toolbar>
@@ -116,6 +119,14 @@ export const WaveStakeholdersTable: React.FC<IWaveStakeholdersTableProps> = ({
           </Tbody>
         </ConditionalTableBody>
       </Table>
+      {migrationWave.allStakeholders.length > 9 && (
+        <SimplePagination
+          idPrefix={`expanded-migration-wave-${migrationWave.name}-apps-table`}
+          isTop={false}
+          paginationProps={paginationProps}
+          isCompact
+        />
+      )}
     </>
   );
 };
diff --git a/client/src/app/pages/migration-waves/components/wave-applications-table.tsx b/client/src/app/pages/migration-waves/components/wave-applications-table.tsx
index 94b645a1f1..f56baa1a09 100644
--- a/client/src/app/pages/migration-waves/components/wave-applications-table.tsx
+++ b/client/src/app/pages/migration-waves/components/wave-applications-table.tsx
@@ -73,11 +73,14 @@ export const WaveApplicationsTable: React.FC<IWaveApplicationsTableProps> = ({
       <Toolbar {...toolbarProps}>
         <ToolbarContent>
           <ToolbarItem {...paginationToolbarItemProps}>
-            <SimplePagination
-              idPrefix={`expanded-migration-wave-${migrationWave.name}-apps-table`}
-              isTop
-              paginationProps={paginationProps}
-            />
+            {migrationWave.fullApplications.length > 9 && (
+              <SimplePagination
+                idPrefix={`expanded-migration-wave-${migrationWave.name}-apps-table`}
+                isTop
+                paginationProps={paginationProps}
+                isCompact
+              />
+            )}
           </ToolbarItem>
         </ToolbarContent>
       </Toolbar>
@@ -155,6 +158,14 @@ export const WaveApplicationsTable: React.FC<IWaveApplicationsTableProps> = ({
           </Tbody>
         </ConditionalTableBody>
       </Table>
+      {migrationWave.fullApplications.length > 9 && (
+        <SimplePagination
+          idPrefix={`expanded-migration-wave-${migrationWave.name}-apps-table`}
+          isTop={false}
+          paginationProps={paginationProps}
+          isCompact
+        />
+      )}
     </>
   );
 };