fix: remove filter unknown nodes

Signed-off-by: James <[email protected]>
flyteorg · Oct 6, 2022 · 2cdf784 · 2cdf784
1 parent 0b40fab
commit 2cdf784
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 30 deletions.
diff --git a/packages/zapp/console/src/components/Executions/ExecutionDetails/ExecutionNodeViews.tsx b/packages/zapp/console/src/components/Executions/ExecutionDetails/ExecutionNodeViews.tsx
@@ -58,6 +58,7 @@ export const ExecutionNodeViews: React.FC<ExecutionNodeViewsProps> = ({ executio
   const tabState = useTabState(tabs, defaultTab);
   const queryClient = useQueryClient();
   const requestConfig = useContext(NodeExecutionsRequestConfigContext);
+  const [nodeExecutionsLoading, setNodeExecutionsLoading] = useState<boolean>(true);
 
   const {
     closure: { abortMetadata, workflowId },
@@ -83,6 +84,7 @@ export const ExecutionNodeViews: React.FC<ExecutionNodeViewsProps> = ({ executio
     let isCurrent = true;
 
     async function fetchData(baseNodeExecutions, queryClient) {
+      setNodeExecutionsLoading(true);
       const newValue = await Promise.all(
         baseNodeExecutions.map(async (baseNodeExecution) => {
           const taskExecutions = await fetchTaskExecutionList(queryClient, baseNodeExecution.id);
@@ -113,11 +115,16 @@ export const ExecutionNodeViews: React.FC<ExecutionNodeViewsProps> = ({ executio
 
       if (isCurrent) {
         setNodeExecutionsWithResources(newValue);
+        setNodeExecutionsLoading(false);
       }
     }
 
     if (nodeExecutions.length > 0) {
       fetchData(nodeExecutions, queryClient);
+    } else {
+      if (isCurrent) {
+        setNodeExecutionsLoading(false);
+      }
     }
     return () => {
       isCurrent = false;
@@ -144,6 +151,9 @@ export const ExecutionNodeViews: React.FC<ExecutionNodeViewsProps> = ({ executio
   };
 
   const renderTab = (tabType) => {
+    if (nodeExecutionsLoading) {
+      return <LoadingComponent />;
+    }
     return (
       <WaitForQuery
         errorComponent={DataError}

diff --git a/...zapp/console/src/components/Executions/ExecutionDetails/test/ExecutionTabContent.test.tsx b/...zapp/console/src/components/Executions/ExecutionDetails/test/ExecutionTabContent.test.tsx
@@ -37,7 +37,7 @@ jest.mock('components/WorkflowGraph/WorkflowGraph', () => ({
   WorkflowGraph: jest.fn(({ children }) => <div data-testid="workflow-graph">{children}</div>),
 }));
 
-describe('ExecutionTabContent', () => {
+describe('Executions > ExecutionDetails > ExecutionTabContent', () => {
   let queryClient: QueryClient;
 
   beforeEach(() => {

diff --git a/packages/zapp/console/src/components/Executions/Tables/NodeExecutionsTable.tsx b/packages/zapp/console/src/components/Executions/Tables/NodeExecutionsTable.tsx
@@ -43,26 +43,13 @@ export const NodeExecutionsTable: React.FC<NodeExecutionsTableProps> = ({
   const commonStyles = useCommonStyles();
   const tableStyles = useExecutionTableStyles();
   const nodeExecutionsById = useContext(NodeExecutionsByIdContext);
-  const filterState = useNodeExecutionFiltersState();
-
-  const showUnknownNodes = useMemo<Boolean>(() => {
-    if (
-      filterState.filters[0].active &&
-      !(filterState.filters[0] as MultiFilterState<any, any>).selectedStates[
-        NodeExecutionPhase.UNDEFINED
-      ]
-    ) {
-      return false;
-    }
-    return !filterState.filters[1].active && !filterState.filters[2].active;
-  }, [filterState]);
 
   useEffect(() => {
     if (nodeExecutionsById) {
       const executions: NodeExecution[] = [];
       initialNodes.map((node) => {
         if (nodeExecutionsById[node.scopedId]) executions.push(nodeExecutionsById[node.scopedId]);
-        else if (showUnknownNodes)
+        else
           executions.push({
             closure: {
               createdAt: dateToTimestamp(new Date()),
@@ -83,7 +70,7 @@ export const NodeExecutionsTable: React.FC<NodeExecutionsTableProps> = ({
       });
       setNodeExecutions(executions);
     }
-  }, [nodeExecutionsById, initialNodes, showUnknownNodes]);
+  }, [nodeExecutionsById, initialNodes]);
 
   const executionsWithKeys = useMemo(
     () =>

diff --git a/packages/zapp/console/src/components/Executions/Tables/test/NodeExecutionsTable.test.tsx b/packages/zapp/console/src/components/Executions/Tables/test/NodeExecutionsTable.test.tsx
@@ -1,4 +1,4 @@
-import { render, waitFor } from '@testing-library/react';
+import { render } from '@testing-library/react';
 import { NodeExecutionDetailsContextProvider } from 'components/Executions/contextProvider/NodeExecutionDetails';
 import {
   NodeExecutionsByIdContext,
@@ -74,6 +74,8 @@ describe('NodeExecutionsTableExecutions > Tables > NodeExecutionsTable', () => {
   let queryClient: QueryClient;
   let requestConfig: RequestConfig;
   const initialNodes = mockNodes(2);
+  const selectedExecution = null;
+  const setSelectedExecution = jest.fn();
 
   beforeEach(() => {
     requestConfig = {};
@@ -112,53 +114,43 @@ describe('NodeExecutionsTableExecutions > Tables > NodeExecutionsTable', () => {
     });
 
     it('renders empty content when there are no nodes', async () => {
-      const selectedExecution = null;
-      const setSelectedExecution = jest.fn();
-
-      const { container, getByText } = renderTable({
+      const { getByText } = renderTable({
         initialNodes: [],
         selectedExecution,
         setSelectedExecution,
         nodeExecutionsById: {},
       });
 
-      await waitFor(() => container);
       expect(getByText(noExecutionsFoundString)).toBeInTheDocument();
     });
 
     it('renders NodeExecutionRows with proper nodeExecutions', async () => {
-      const selectedExecution = null;
-      const setSelectedExecution = jest.fn();
       const phases = [NodeExecutionPhase.FAILED, NodeExecutionPhase.SUCCEEDED];
       const nodeExecutionsById = mockExecutionsById(2, phases);
 
-      const { container, getByText } = renderTable({
+      const { getByText } = renderTable({
         initialNodes,
         selectedExecution,
         setSelectedExecution,
         nodeExecutionsById,
       });
 
-      await waitFor(() => container);
       for (const i in initialNodes) {
         expect(getByText(`node-execution-${initialNodes[i].id}-${phases[i]}`)).toBeInTheDocument();
       }
     });
 
     it('renders future nodes with UNDEFINED phase', async () => {
-      const selectedExecution = null;
-      const setSelectedExecution = jest.fn();
       const phases = [NodeExecutionPhase.SUCCEEDED, NodeExecutionPhase.UNDEFINED];
       const nodeExecutionsById = mockExecutionsById(1, phases);
 
-      const { container, getByText } = renderTable({
+      const { getByText } = renderTable({
         initialNodes,
         selectedExecution,
         setSelectedExecution,
         nodeExecutionsById,
       });
 
-      await waitFor(() => container);
       for (const i in initialNodes) {
         expect(getByText(`node-execution-${initialNodes[i].id}-${phases[i]}`)).toBeInTheDocument();
       }