From 98db40387427eff234f42b28fe490fbb73e3f8ac Mon Sep 17 00:00:00 2001
From: Jack <jack20220723@gmail.com>
Date: Mon, 11 Dec 2023 17:18:44 +0800
Subject: [PATCH] Optionally turn-off properties table in (Default)DetailsPane
 (#52)

---
 .../PropertiesPanelContent/DetailsPane.tsx    | 27 ++++++++++--------
 .../DefaultDetailsPane.tsx                    | 28 +++++++++++--------
 .../GraphVisualizer/GraphVisualizer.tsx       |  5 +++-
 .../GraphVisualizer/NodeInspectorPanel.tsx    |  2 ++
 src/neo4j-arc/package.json                    |  2 +-
 5 files changed, 38 insertions(+), 26 deletions(-)

diff --git a/src/browser/modules/Stream/CypherFrame/VisualizationView/PropertiesPanelContent/DetailsPane.tsx b/src/browser/modules/Stream/CypherFrame/VisualizationView/PropertiesPanelContent/DetailsPane.tsx
index 2ce0099c8cb..58c366f53e1 100644
--- a/src/browser/modules/Stream/CypherFrame/VisualizationView/PropertiesPanelContent/DetailsPane.tsx
+++ b/src/browser/modules/Stream/CypherFrame/VisualizationView/PropertiesPanelContent/DetailsPane.tsx
@@ -33,7 +33,8 @@ export function DetailsPane({
   vizItem,
   graphStyle,
   nodeInspectorWidth,
-  onGraphInteraction = () => undefined
+  onGraphInteraction = () => undefined,
+  showPropertiesTable = true
 }: DetailsPaneProps): JSX.Element {
   const [maxPropertiesCount, setMaxPropertiesCount] = useState(
     DETAILS_PANE_STEP_SIZE
@@ -135,17 +136,19 @@ export function DetailsPane({
             )
           })}
       </PaneHeader>
-      <PaneBody data-testid="viz-details-pane-body">
-        <PropertiesTable
-          isNode={vizItem.type === 'node'}
-          visibleProperties={visibleItemProperties}
-          onMoreClick={handleMorePropertiesClick}
-          moreStep={DETAILS_PANE_STEP_SIZE}
-          totalNumItems={allItemProperties.length}
-          nodeInspectorWidth={nodeInspectorWidth}
-          onGraphInteraction={onGraphInteraction}
-        />
-      </PaneBody>
+      {showPropertiesTable && (
+        <PaneBody data-testid="viz-details-pane-body">
+          <PropertiesTable
+            isNode={vizItem.type === 'node'}
+            visibleProperties={visibleItemProperties}
+            onMoreClick={handleMorePropertiesClick}
+            moreStep={DETAILS_PANE_STEP_SIZE}
+            totalNumItems={allItemProperties.length}
+            nodeInspectorWidth={nodeInspectorWidth}
+            onGraphInteraction={onGraphInteraction}
+          />
+        </PaneBody>
+      )}
     </PaneWrapper>
   )
 }
diff --git a/src/neo4j-arc/graph-visualization/GraphVisualizer/DefaultPanelContent/DefaultDetailsPane.tsx b/src/neo4j-arc/graph-visualization/GraphVisualizer/DefaultPanelContent/DefaultDetailsPane.tsx
index 15f2e2df234..8e90e9db650 100644
--- a/src/neo4j-arc/graph-visualization/GraphVisualizer/DefaultPanelContent/DefaultDetailsPane.tsx
+++ b/src/neo4j-arc/graph-visualization/GraphVisualizer/DefaultPanelContent/DefaultDetailsPane.tsx
@@ -37,12 +37,14 @@ export type DetailsPaneProps = {
   graphStyle: GraphStyleModel
   nodeInspectorWidth: number
   onGraphInteraction?: GraphInteractionCallBack
+  showPropertiesTable?: boolean
 }
 export function DefaultDetailsPane({
   vizItem,
   graphStyle,
   nodeInspectorWidth,
-  onGraphInteraction = () => undefined
+  onGraphInteraction = () => undefined,
+  showPropertiesTable = true
 }: DetailsPaneProps): JSX.Element {
   const [maxPropertiesCount, setMaxPropertiesCount] = useState(
     DETAILS_PANE_STEP_SIZE
@@ -142,17 +144,19 @@ export function DefaultDetailsPane({
             )
           })}
       </PaneHeader>
-      <PaneBody>
-        <PropertiesTable
-          isNode={vizItem.type === 'node'}
-          visibleProperties={visibleItemProperties}
-          onMoreClick={handleMorePropertiesClick}
-          moreStep={DETAILS_PANE_STEP_SIZE}
-          totalNumItems={allItemProperties.length}
-          nodeInspectorWidth={nodeInspectorWidth}
-          onGraphInteraction={onGraphInteraction}
-        />
-      </PaneBody>
+      {showPropertiesTable && (
+        <PaneBody>
+          <PropertiesTable
+            isNode={vizItem.type === 'node'}
+            visibleProperties={visibleItemProperties}
+            onMoreClick={handleMorePropertiesClick}
+            moreStep={DETAILS_PANE_STEP_SIZE}
+            totalNumItems={allItemProperties.length}
+            nodeInspectorWidth={nodeInspectorWidth}
+            onGraphInteraction={onGraphInteraction}
+          />
+        </PaneBody>
+      )}
     </PaneWrapper>
   )
 }
diff --git a/src/neo4j-arc/graph-visualization/GraphVisualizer/GraphVisualizer.tsx b/src/neo4j-arc/graph-visualization/GraphVisualizer/GraphVisualizer.tsx
index c10ffac4c93..fa65abeb4bc 100644
--- a/src/neo4j-arc/graph-visualization/GraphVisualizer/GraphVisualizer.tsx
+++ b/src/neo4j-arc/graph-visualization/GraphVisualizer/GraphVisualizer.tsx
@@ -57,6 +57,7 @@ type GraphVisualizerDefaultProps = {
   disableWheelZoomInfoMessage: () => void
   useGeneratedDefaultColors: boolean
   showNodeInspectorPanel: boolean
+  showPropertiesTable: boolean
 }
 type GraphVisualizerProps = GraphVisualizerDefaultProps & {
   relationships: BasicRelationship[]
@@ -120,7 +121,8 @@ export class GraphVisualizer extends Component<
     wheelZoomInfoMessageEnabled: false,
     disableWheelZoomInfoMessage: () => undefined,
     useGeneratedDefaultColors: true,
-    showNodeInspectorPanel: true
+    showNodeInspectorPanel: true,
+    showPropertiesTable: true
   }
 
   constructor(props: GraphVisualizerProps) {
@@ -309,6 +311,7 @@ export class GraphVisualizer extends Component<
             DetailsPaneOverride={this.props.DetailsPaneOverride}
             OverviewPaneOverride={this.props.OverviewPaneOverride}
             onGraphInteraction={this.props.onGraphInteraction}
+            showPropertiesTable={this.props.showPropertiesTable}
           />
         )}
       </StyledFullSizeContainer>
diff --git a/src/neo4j-arc/graph-visualization/GraphVisualizer/NodeInspectorPanel.tsx b/src/neo4j-arc/graph-visualization/GraphVisualizer/NodeInspectorPanel.tsx
index 12d9572c1e7..92495390e89 100644
--- a/src/neo4j-arc/graph-visualization/GraphVisualizer/NodeInspectorPanel.tsx
+++ b/src/neo4j-arc/graph-visualization/GraphVisualizer/NodeInspectorPanel.tsx
@@ -53,6 +53,7 @@ interface NodeInspectorPanelProps {
   DetailsPaneOverride?: React.FC<DetailsPaneProps>
   OverviewPaneOverride?: React.FC<OverviewPaneProps>
   onGraphInteraction?: GraphInteractionCallBack
+  showPropertiesTable?: boolean
 }
 
 export const defaultPanelWidth = (): number =>
@@ -120,6 +121,7 @@ export class NodeInspectorPanel extends Component<NodeInspectorPanelProps> {
             <PaneContainer paneWidth={width}>
               {shownEl.type === 'node' || shownEl.type === 'relationship' ? (
                 <DetailsPane
+                  showPropertiesTable={this.props.showPropertiesTable}
                   vizItem={shownEl}
                   graphStyle={graphStyle}
                   nodeInspectorWidth={width}
diff --git a/src/neo4j-arc/package.json b/src/neo4j-arc/package.json
index d58da8eb18a..176c457081c 100644
--- a/src/neo4j-arc/package.json
+++ b/src/neo4j-arc/package.json
@@ -1,6 +1,6 @@
 {
   "name": "neo4j-devtools-arc",
-  "version": "0.0.81",
+  "version": "0.0.82",
   "main": "dist/neo4j-arc.js",
   "author": "Neo4j Inc.",
   "license": "GPL-3.0",