Show empty sidebar when no node is selected

Summary: ^

Reviewed By: LukeDefeo

Differential Revision: D41549165

fbshipit-source-id: 7f6324c8e04b8c7db3afe1e4cc5e1cbe0c023b7c

desktop/plugins/public/ui-debugger/components/main.tsx

@@ -34,20 +34,6 @@ export function Component() {
 
   const {ctrlPressed} = useKeyboardModifiers();
 
-  function renderSidebar(
-    node: UINode | undefined,
-    metadata: Map<MetadataId, Metadata>,
-  ) {
-    if (!node) {
-      return;
-    }
-    return (
-      <DetailSidebar width={350}>
-        <Inspector metadata={metadata} node={node} />
-      </DetailSidebar>
-    );
-  }
-
   if (showPerfStats) return <PerfStats events={instance.perfEvents} />;
 
   if (rootId) {
@@ -74,8 +60,12 @@ export function Component() {
             onSelectNode={setSelectedNode}
             modifierPressed={ctrlPressed}
           />
-
-          {selectedNode && renderSidebar(nodes.get(selectedNode), metadata)}
+          <DetailSidebar width={350}>
+            <Inspector
+              metadata={metadata}
+              node={selectedNode ? nodes.get(selectedNode) : undefined}
+            />
+          </DetailSidebar>
         </Layout.Horizontal>
       </Layout.Container>
     );