optimize fetching of some vars in header

Signed-off-by: Tyler Ohlsen <[email protected]>

public/pages/workflow_detail/components/header.tsx

@@ -78,8 +78,16 @@ export function WorkflowDetailHeader(props: WorkflowDetailHeaderProps) {
   >();
 
   // workflow state
-  const [workflowName, setWorkflowName] = useState<string>('');
-  const [workflowLastUpdated, setWorkflowLastUpdated] = useState<string>('');
+  //const [workflowName, setWorkflowName] = useState<string>('');
+  const workflowName = getCharacterLimitedString(
+    props.workflow?.name,
+    MAX_WORKFLOW_NAME_TO_DISPLAY
+  );
+  const workflowLastUpdated = toFormattedDate(
+    // @ts-ignore
+    props.workflow?.lastUpdated
+  ).toString();
+  // const [workflowLastUpdated, setWorkflowLastUpdated] = useState<string>('');
 
   // export modal state
   const [isExportModalOpen, setIsExportModalOpen] = useState<boolean>(false);
@@ -92,27 +100,6 @@ export function WorkflowDetailHeader(props: WorkflowDetailHeaderProps) {
     chrome: { setHeaderVariant },
   } = getCore();
 
-  // get some workflow details
-  useEffect(() => {
-    if (props.workflow) {
-      setWorkflowName(
-        getCharacterLimitedString(
-          props.workflow.name,
-          MAX_WORKFLOW_NAME_TO_DISPLAY
-        )
-      );
-      try {
-        const formattedDate = toFormattedDate(
-          // @ts-ignore
-          props.workflow.lastUpdated
-        ).toString();
-        setWorkflowLastUpdated(formattedDate);
-      } catch (err) {
-        setWorkflowLastUpdated('');
-      }
-    }
-  }, [props.workflow]);
-
   // When NewHomePage is enabled, use 'application' HeaderVariant; otherwise, use 'page' HeaderVariant (default).
   useEffect(() => {
     if (SHOW_ACTIONS_IN_HEADER) {