fix: failing/empty graph and timeline tabs upon relaunch data updates

packages/zapp/console/src/components/Executions/ExecutionDetails/Timeline/ExecutionTimeline.tsx

@@ -83,6 +83,10 @@ export const ExecutionTimeline: React.FC<ExProps> = ({ chartTimezone, initialNod
   const nodeExecutionsById = useContext(NodeExecutionsByIdContext);
   const { chartInterval: chartTimeInterval } = useScaleContext();
 
+  useEffect(() => {
+    setOriginalNodes(initialNodes);
+  }, [initialNodes]);
+
   useEffect(() => {
     const plainNodes = convertToPlainNodes(originalNodes);
     const updatedShownNodesMap = plainNodes.map((node) => {

packages/zapp/console/src/components/WorkflowGraph/WorkflowGraph.tsx

@@ -5,6 +5,7 @@ import { NonIdealState } from 'components/common/NonIdealState';
 import { CompiledNode } from 'models/Node/types';
 import { TaskExecutionPhase } from 'models/Execution/enums';
 import { dNode } from 'models/Graph/types';
+import t from './strings';
 
 export interface WorkflowGraphProps {
   onNodeSelectionChanged: (selectedNodes: string[]) => void;
@@ -32,7 +33,12 @@ export const WorkflowGraph: React.FC<WorkflowGraphProps> = ({
   initialNodes,
 }) => {
   if (error) {
-    return <NonIdealState title="Cannot render Workflow graph" description={error.message} />;
+    return <NonIdealState title={t('graphErrorTitle')} description={error.message} />;
+  }
+
+  // If the dag is empty, show the message, instead of trying to display it
+  if (!mergedDag) {
+    return <NonIdealState title={t('graphErrorTitle')} description={t('graphErrorEmptyGraph')} />;
   }
 
   return (

packages/zapp/console/src/components/WorkflowGraph/strings.ts

@@ -0,0 +1,9 @@
+import { createLocalizedString } from '@flyteconsole/locale';
+
+const str = {
+  graphErrorTitle: 'Cannot render Workflow graph',
+  graphErrorEmptyGraph: 'The graph is empty',
+};
+
+export { patternKey } from '@flyteconsole/locale';
+export default createLocalizedString(str);

packages/zapp/console/src/components/flytegraph/ReactFlow/transformDAGToReactFlowV2.tsx

@@ -236,6 +236,11 @@ export const buildGraphMapping = (props): ReactFlowGraphMapping => {
   const parse = (props: ParseProps) => {
     const { contextNode, contextParent, rootParentNode, nodeDataProps } = props;
     let context: ReactFlowGraph | null = null;
+    if (!contextNode) {
+      debug('\t graph parse: contextNode is ', contextNode);
+      return;
+    }
+
     contextNode.nodes
       .filter((n) => !!n)
       .map((node: dNode) => {