From f27338819520c9ab3d81c61cd27dc22fae582281 Mon Sep 17 00:00:00 2001
From: Aria Minaei <aria.minaei@gmail.com>
Date: Fri, 1 Oct 2021 21:35:51 +0200
Subject: [PATCH] GraphEditor automatically hides if no props are selected

---
 .../SequenceEditorPanel/SequenceEditorPanel.tsx   |  4 +++-
 .../panels/SequenceEditorPanel/layout/layout.ts   | 15 +++++++++++++--
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/theatre/studio/src/panels/SequenceEditorPanel/SequenceEditorPanel.tsx b/theatre/studio/src/panels/SequenceEditorPanel/SequenceEditorPanel.tsx
index 21c8466..871053d 100644
--- a/theatre/studio/src/panels/SequenceEditorPanel/SequenceEditorPanel.tsx
+++ b/theatre/studio/src/panels/SequenceEditorPanel/SequenceEditorPanel.tsx
@@ -155,7 +155,9 @@ const Content: React.FC<{}> = () => {
       [],
     )
 
+    const graphEditorAvailable = val(layoutP.graphEditorDims.isAvailable)
     const graphEditorOpen = val(layoutP.graphEditorDims.isOpen)
+
     return (
       <Container ref={containerRef}>
         <LeftBackground style={{width: `${val(layoutP.leftDims.width)}px`}} />
@@ -165,7 +167,7 @@ const Content: React.FC<{}> = () => {
           {graphEditorOpen && (
             <GraphEditor key={key + '-graphEditor'} layoutP={layoutP} />
           )}
-          <GraphEditorToggle layoutP={layoutP} />
+          {graphEditorAvailable && <GraphEditorToggle layoutP={layoutP} />}
           <RightOverlay layoutP={layoutP} />
         </FrameStampPositionProvider>
       </Container>
diff --git a/theatre/studio/src/panels/SequenceEditorPanel/layout/layout.ts b/theatre/studio/src/panels/SequenceEditorPanel/layout/layout.ts
index be43bb7..1117657 100644
--- a/theatre/studio/src/panels/SequenceEditorPanel/layout/layout.ts
+++ b/theatre/studio/src/panels/SequenceEditorPanel/layout/layout.ts
@@ -70,6 +70,7 @@ export type SequenceEditorPanelLayout = {
   rightDims: DimsOfPanelPart
   dopeSheetDims: DimsOfPanelPart
   graphEditorDims: DimsOfPanelPart & {
+    isAvailable: boolean
     isOpen: boolean
     padding: {top: number; bottom: number}
   }
@@ -135,6 +136,13 @@ export function sequenceEditorPanelLayout(
       studio.atomP.historic.panels.sequenceEditor.graphEditor,
     )
 
+    const selectedPropsByObject = val(
+      historicStateP.sequenceEditor.selectedPropsByObject,
+    )
+
+    const graphEditorAvailable =
+      !!selectedPropsByObject && Object.keys(selectedPropsByObject).length > 0
+
     const {
       leftDims,
       rightDims,
@@ -158,7 +166,9 @@ export function sequenceEditorPanelLayout(
           screenY: panelDims.screenY,
         }
 
-        const graphEditorOpen = graphEditorState?.isOpen === true
+        const graphEditorOpen =
+          graphEditorAvailable && graphEditorState?.isOpen === true
+
         const graphEditorHeight = Math.floor(
           (graphEditorOpen
             ? clamp(graphEditorState?.height ?? 0.5, 0.1, 0.7)
@@ -177,6 +187,7 @@ export function sequenceEditorPanelLayout(
 
         // const graphEditorHeight = panelDims.height - dopeSheetDims.height
         const graphEditorDims: SequenceEditorPanelLayout['graphEditorDims'] = {
+          isAvailable: graphEditorAvailable,
           isOpen: graphEditorOpen,
           width: rightDims.width,
           height: graphEditorHeight,
@@ -201,7 +212,7 @@ export function sequenceEditorPanelLayout(
           horizontalScrollbarDims,
         }
       },
-      [panelDims, graphEditorState],
+      [panelDims, graphEditorState, graphEditorAvailable],
     )
 
     const graphEditorVerticalSpace = prism.memo(