From fb2540b4d803bd8f2387f04b919a0b832839009c Mon Sep 17 00:00:00 2001
From: Arpit <arpitnath42@gmail.com>
Date: Tue, 20 Sep 2022 10:14:24 +0530
Subject: [PATCH] [improvements] LeftSidebar Inspector (#4064)

* fixes: padding for inspector json

* fixes: padding for inspector json

* fixes: padding for inspector json

* adds {{}}: to copying the abs path
---
 frontend/src/Editor/LeftSidebar/SidebarInspector.jsx | 2 +-
 frontend/src/_styles/theme.scss                      | 6 ++++++
 frontend/src/_ui/JSONTreeViewer/JSONTreeViewer.jsx   | 2 +-
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/frontend/src/Editor/LeftSidebar/SidebarInspector.jsx b/frontend/src/Editor/LeftSidebar/SidebarInspector.jsx
index 8ca8b2cc07..1f4c87c330 100644
--- a/frontend/src/Editor/LeftSidebar/SidebarInspector.jsx
+++ b/frontend/src/Editor/LeftSidebar/SidebarInspector.jsx
@@ -162,7 +162,7 @@ export const LeftSidebarInspector = ({
       />
       <div
         {...content}
-        className={`card popover ${open || popoverPinned ? 'show' : 'hide'}`}
+        className={`card popover left-sidebar-inspector ${open || popoverPinned ? 'show' : 'hide'}`}
         style={{ resize: 'horizontal', maxWidth: '60%', minWidth: '422px' }}
       >
         <SidebarPinnedButton
diff --git a/frontend/src/_styles/theme.scss b/frontend/src/_styles/theme.scss
index 06cf6cd8d8..34fdc400a0 100644
--- a/frontend/src/_styles/theme.scss
+++ b/frontend/src/_styles/theme.scss
@@ -336,6 +336,12 @@ button {
         border-width: 0px 0px 1px 0px;
       }
     }
+
+    .left-sidebar-inspector {
+      .card-body {
+        padding: 1rem 0rem 1rem 1rem;
+      }
+    }
   }
 
   .editor-sidebar {
diff --git a/frontend/src/_ui/JSONTreeViewer/JSONTreeViewer.jsx b/frontend/src/_ui/JSONTreeViewer/JSONTreeViewer.jsx
index 0689ad83d0..8af49bffdc 100644
--- a/frontend/src/_ui/JSONTreeViewer/JSONTreeViewer.jsx
+++ b/frontend/src/_ui/JSONTreeViewer/JSONTreeViewer.jsx
@@ -193,7 +193,7 @@ export class JSONTreeViewer extends React.Component {
 
     buildMap(data);
 
-    return computeAbsolutePath(path);
+    return `{{${computeAbsolutePath(path)}}}`;
   };
 
   render() {