From 36347651df748ecac9088d43aec6ddb7f9f8ce07 Mon Sep 17 00:00:00 2001
From: Gandharv <gandharvkumargarg@gmail.com>
Date: Fri, 20 Aug 2021 18:41:49 +0530
Subject: [PATCH] Feature: toggle query pane visibility (#558)

* add sidebar hide/show

* remove sidebar toggle
---
 frontend/src/Editor/Editor.jsx | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

diff --git a/frontend/src/Editor/Editor.jsx b/frontend/src/Editor/Editor.jsx
index 2afa17c165..35ecb86480 100644
--- a/frontend/src/Editor/Editor.jsx
+++ b/frontend/src/Editor/Editor.jsx
@@ -527,14 +527,7 @@ class Editor extends React.Component {
                     value={this.state.app.name}
                   />
                 )}
-                {/* <div className="editor-buttons">
-                  <span
-                    className={`btn ${showLeftSidebar ? 'btn-light' : 'btn-default'} mx-2`}
-                    onClick={this.toggleLeftSidebar}
-                    data-tip={showLeftSidebar ? 'Hide left sidebar' : 'Show left sidebar'}
-                  >
-                    <img src="/assets/images/icons/editor/sidebar-toggle.svg" width="12" height="12" />
-                  </span>
+                <div className="editor-buttons">
                   <span
                     className={`btn ${showQueryEditor ? 'btn-light' : 'btn-default'} mx-2`}
                     onClick={this.toggleQueryEditor}
@@ -547,7 +540,7 @@ class Editor extends React.Component {
                       height="12"
                     />
                   </span>
-                </div> */}
+                </div>
                 {/* <div className="canvas-buttons">
                   <button
                     className="btn btn-light mx-2"
@@ -765,7 +758,10 @@ class Editor extends React.Component {
               </div>
             </Resizable> */}
             <div className="main">
-              <div className="canvas-container align-items-center" style={{ transform: `scale(${zoomLevel})` }}>
+              <div
+                className={`canvas-container align-items-center ${!showLeftSidebar && 'hide-sidebar'}`}
+                style={{ transform: `scale(${zoomLevel})` }}
+              >
                 <div className="canvas-area" style={{ width: currentLayout === 'desktop' ? '1292px' : '450px' }}>
                   <Container
                     appDefinition={appDefinition}