From 23e3cdb193ab1d7193ccf8450fe9ca32ca1fa64e Mon Sep 17 00:00:00 2001
From: Chaim Lev-Ari <chiptus@users.noreply.github.com>
Date: Tue, 16 May 2023 10:30:34 +0700
Subject: [PATCH] fix(stacks): show containers table [EE-5487] (#8935)

---
 .../ItemView/StackContainersDatatable.tsx     | 99 ++++++++++---------
 1 file changed, 52 insertions(+), 47 deletions(-)

diff --git a/app/react/docker/stacks/ItemView/StackContainersDatatable.tsx b/app/react/docker/stacks/ItemView/StackContainersDatatable.tsx
index e8ef361f7..5f9fed674 100644
--- a/app/react/docker/stacks/ItemView/StackContainersDatatable.tsx
+++ b/app/react/docker/stacks/ItemView/StackContainersDatatable.tsx
@@ -18,6 +18,7 @@ import { TableSettingsProvider } from '@@/datatables/useTableSettings';
 import { useTableState } from '@@/datatables/useTableState';
 
 import { useContainers } from '../../containers/queries/containers';
+import { RowProvider } from '../../containers/ListView/ContainersDatatable/RowContext';
 
 const storageKey = 'stack-containers';
 const settingsStore = createStore(storageKey);
@@ -51,53 +52,57 @@ export function StackContainersDatatable({ environment, stackName }: Props) {
   );
 
   return (
-    <TableSettingsProvider settings={settingsStore}>
-      <Datatable
-        title="Containers"
-        titleIcon={Box}
-        settingsManager={tableState}
-        columns={columns}
-        renderTableActions={(selectedRows) => (
-          <ContainersDatatableActions
-            selectedItems={selectedRows}
-            isAddActionVisible={false}
-            endpointId={environment.Id}
-          />
-        )}
-        initialTableState={{
-          columnVisibility: Object.fromEntries(
-            tableState.hiddenColumns.map((col) => [col, false])
-          ),
-        }}
-        renderTableSettings={(tableInstance) => {
-          const columnsToHide = tableInstance
-            .getAllColumns()
-            .filter((col) => col.getCanHide());
+    <RowProvider context={{ environment }}>
+      <TableSettingsProvider settings={settingsStore}>
+        <Datatable
+          title="Containers"
+          titleIcon={Box}
+          settingsManager={tableState}
+          columns={columns}
+          renderTableActions={(selectedRows) => (
+            <ContainersDatatableActions
+              selectedItems={selectedRows}
+              isAddActionVisible={false}
+              endpointId={environment.Id}
+            />
+          )}
+          initialTableState={{
+            columnVisibility: Object.fromEntries(
+              tableState.hiddenColumns.map((col) => [col, false])
+            ),
+          }}
+          renderTableSettings={(tableInstance) => {
+            const columnsToHide = tableInstance
+              .getAllColumns()
+              .filter((col) => col.getCanHide());
 
-          return (
-            <>
-              <ColumnVisibilityMenu<DockerContainer>
-                columns={columnsToHide}
-                onChange={(hiddenColumns) => {
-                  tableState.setHiddenColumns(hiddenColumns);
-                  tableInstance.setColumnVisibility(
-                    Object.fromEntries(hiddenColumns.map((col) => [col, false]))
-                  );
-                }}
-                value={tableState.hiddenColumns}
-              />
-              <Table.SettingsMenu
-                quickActions={<QuickActionsSettings actions={actions} />}
-              >
-                <ContainersDatatableSettings settings={tableState} />
-              </Table.SettingsMenu>
-            </>
-          );
-        }}
-        dataset={containersQuery.data || []}
-        isLoading={containersQuery.isLoading}
-        emptyContentLabel="No containers found"
-      />
-    </TableSettingsProvider>
+            return (
+              <>
+                <ColumnVisibilityMenu<DockerContainer>
+                  columns={columnsToHide}
+                  onChange={(hiddenColumns) => {
+                    tableState.setHiddenColumns(hiddenColumns);
+                    tableInstance.setColumnVisibility(
+                      Object.fromEntries(
+                        hiddenColumns.map((col) => [col, false])
+                      )
+                    );
+                  }}
+                  value={tableState.hiddenColumns}
+                />
+                <Table.SettingsMenu
+                  quickActions={<QuickActionsSettings actions={actions} />}
+                >
+                  <ContainersDatatableSettings settings={tableState} />
+                </Table.SettingsMenu>
+              </>
+            );
+          }}
+          dataset={containersQuery.data || []}
+          isLoading={containersQuery.isLoading}
+          emptyContentLabel="No containers found"
+        />
+      </TableSettingsProvider>
+    </RowProvider>
   );
 }