Optionally turn-off properties table in (Default)DetailsPane (#52)

QubitPi · Dec 11, 2023 · 07ccacb · 07ccacb
1 parent 69891c0
commit 07ccacb
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 26 deletions.
diff --git a/...owser/modules/Stream/CypherFrame/VisualizationView/PropertiesPanelContent/DetailsPane.tsx b/...owser/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
@@ -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
@@ -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
@@ -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
@@ -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",