reorganize code to need fewer null checks and qualified state accesse…

…s (like `state.property` instead of `property` after having destructured `state`)

src/components/ide/Ide/Ide.js

@@ -754,12 +754,21 @@ function Ide({ projectName }: Props) {
     }
   }
 
-  function factory(node: any): React.Node {
-    // eslint-disable-next-line no-throw-literal
-    if (projectInfo === null || state === null) throw 'unreachable';
+  const projectSettingsPopupState = usePopupState({
+    variant: 'popover',
+    popupId: 'project-controls-menu',
+  });
+
+  useStyles(FlexLayoutTheme);
+  const classes = useStylesMaterial();
+
+  if (projectInfo === null || state === null) return null;
+
+  const { fileTreeState, editorStates, showMetadataFolder } = state;
 
+  function factory(node: any): React.Node {
     const getEditorState = (path: string, editorType: string) => {
-      const editorState = state.editorStates[path];
+      const editorState = editorStates[path];
       return editorState ? editorState[editorType] : null;
     };
 
@@ -828,24 +837,12 @@ function Ide({ projectName }: Props) {
     }
   }
 
-  const projectSettingsPopupState = usePopupState({
-    variant: 'popover',
-    popupId: 'project-controls-menu',
-  });
-
-  useStyles(FlexLayoutTheme);
-  const classes = useStylesMaterial();
-
-  if (projectInfo === null || state === null) return null;
-
   function filter(path: string, child: FilerRecursiveStatInfo): boolean {
-    if (path === '.' && child.name === '.metadata' && !state.showMetadataFolder)
+    if (path === '.' && child.name === '.metadata' && !showMetadataFolder)
       return false;
     return true;
   }
 
-  const { fileTreeState, showMetadataFolder } = state;
-
   return (
     <Grid className={classes.root} container direction="row" wrap="nowrap">
       <Grid