### Install and Run NeoDash Locally

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/adding-visualizations

Clone the NeoDash repository, install dependencies, and start the development server to begin adding custom visualizations.

```bash
git clone git@github.com:neo4j-labs/neodash.git
git checkout develop
yarn install
yarn run dev
```

--------------------------------

### Install Dependencies and Run Dev Server with Yarn

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Use these commands to install project dependencies and start the NeoDash application in development mode. Ensure you have yarn and node installed.

```bash
yarn install
yarn run dev
```

--------------------------------

### Build NeoDash from Source

Source: https://neo4j.com/labs/neodash/2.4/quickstart

Clone the NeoDash repository, install dependencies with yarn, and start the development server.

```bash
git clone https://github.com/neo4j-labs/neodash
yarn install
yarn run dev
```

--------------------------------

### Example NeoDash Style Configuration JSON

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/style-configuration

This JSON object demonstrates an example configuration for NeoDash, specifying various header and page list colors, as well as a custom CSS variable for the background color.

```json
{
  "DASHBOARD_HEADER_BRAND_LOGO": "logo_lightsand.png",
  "DASHBOARD_HEADER_COLOR" : "#F3F3F0",
  "DASHBOARD_HEADER_BUTTON_COLOR" : "#009999",
  "DASHBOARD_HEADER_TITLE_COLOR" : "#00C1B6",
  "DASHBOARD_PAGE_LIST_COLOR" : "#F3F3F0",
  "DASHBOARD_PAGE_LIST_ACTIVE_COLOR": "#009999",
  "style": {
    "--palette-light-neutral-bg-weak" : "243, 243, 240"
  }
}
```

--------------------------------

### NeoDash File Structure Example

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/design

Illustrates the typical directory structure and key files within the NeoDash project for organizing source code and configurations.

```plaintext
conf: nginx configuration for Docker image.
dist: directory for generated webpack files.
node_modules: downloaded dependencies
public: style files/images. Runtime app config.
scripts: utility scripts for deployment.
src: source code.
target: compiled package as tgz file.
.babelrc: javascript compiled settings.
.gitignore: gitignore files.
Dockerfile: docker image definition.
```

--------------------------------

### NeoDash Dashboard State Example

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/state-management

An example of the 'dashboard' state object, detailing a simple dashboard with a title, version, settings, and a single page containing a report.

```json
{
  "dashboard": {
    "title": "A Simple Dashboard",
    "version": "2.4",
    "settings": {
      "pagenumber": 0,
      "editable": true,
      "fullscreenEnabled": true,
      "parameters": {
          "neodash_person_name": "Bob"
       }
    },
    "pages": [
        {
          title: “My Page”
          reports: [
            {
                "title": "My Report",
                "query": "MATCH (n)-[e]->(m) RETURN n,e,m",
                "type": "graph",
                "x": "1",
                "y": "2",
                "width": "6",
                "height": "3",
                "settings": {
                    "nodeColorSchmeme": "blue"
                }
            }
        ]
     }
    ]
  }
}
```

--------------------------------

### Basic Markdown Report Example

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/markdown

This snippet demonstrates basic Markdown formatting, including headings, bold text, and embedding an image using a URL.

```markdown
## Hello there!
I'm a **Markdown** file.

Check out this cool image:

![image](https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/how-to-keep-ducks-call-ducks-1615457181.jpg?resize=240:*)
```

--------------------------------

### Default NeoDash Configuration Example

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/configuration

This JSON object shows the default configuration for NeoDash when running in editor mode. It includes settings for SSO, Standalone Mode, and logging.

```json
{
    "ssoEnabled": false,
    "ssoProviders": [],
    "ssoDiscoveryUrl": "https://example.com",
    "standalone": false,
    "standaloneProtocol": "neo4j+s",
    "standaloneHost": "localhost",
    "standalonePort": "7687",
    "standaloneDatabase": "neo4j",
    "standaloneDashboardName": "My Dashboard",
    "standaloneDashboardDatabase": "dashboards",
    "standaloneDashboardURL": "",
    "standaloneAllowLoad": false,
    "standaloneLoadFromOtherDatabases": false,
    "standaloneMultiDatabase": false,
    "standaloneDatabaseList": "neo4j"
    "loggingMode": "0",
    "loggingDatabase": "logs",
    "customHeader": ""
}
```

--------------------------------

### Copy NeoDash Build to Nginx Webserver

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/deploy-a-build

Example command to copy the NeoDash build files to an nginx webserver's HTML directory using scp. Ensure the webserver user has read permissions.

```bash
scp neodash-2.4.11-labs username@host:/usr/share/nginx/html
```

--------------------------------

### Helm Chart values.yaml for NeoDash

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Example values.yaml file for deploying NeoDash using a Helm chart on Kubernetes. It configures image details, replica count, and environment variables for standalone mode.

```yaml
# Name override or full name override
nameOverride: ''
fullnameOverride: neodash-test

# Number of pods
replicaCount: 1

# Image Details
image:
  repository: neo4jlabs/neodash
  pullPolicy: IfNotPresent
  tag: 'latest'
imagePullSecrets: [] # Image pull secret if any

# Pod annotations, labels and security context
podAnnotations: {}
podLabels: {}
podSecurityContext: {}

# Mode configuration using environment variables
# Set reader mode environment variables when enable_reader_mode is true
enable_reader_mode: true
env:
  - name: "ssoEnabled"
    value: "false"
  - name: "standalone"
    value: "true"
  - name: "standaloneProtocol"
    value: "neo4j+s"
  - name: "standaloneHost"
    value: "localhost"
  - name: "standalonePort"
    value: "7687"
  - name: "standaloneDatabase"
    value: neo4j
  - name: "standaloneDashboardName"
    value: "test"
  - name: "standaloneDashboardDatabase"
    value: neo4j
  - name: "standaloneAllowLoad"
    value: "false"
  - name: "standaloneLoadFromOtherDatabases"
    value: "false"
  - name: "standaloneMultiDatabase"
    value: "false"

# Environment variable from secret
envFromSecrets: []
  # standaloneUsername:
      # secretName: "neo4j-connection-secrets"
      # key: "username"
  # standalonePassword:
      # secretName: "neo4j-connection-secrets"
      # key: "password"

# Service details
service:
  type: LoadBalancer # Can also be ClusterIP or NodePort
  port: 5005 # For the service to listen in for Traffic
  targetPort: 5005 # Target port is the container port
  annotations: {} # Service annotations for the LoadBalance

```

--------------------------------

### Example Raw JSON Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/raw-json

This Cypher query demonstrates a basic example of what can be returned by the Raw JSON report. It is typically used for debugging purposes.

```cypher
MATCH (n)
RETURN COUNT(n)
```

--------------------------------

### Configure NeoDash with Environment Variables (Docker)

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/style-configuration

When using the NeoDash Docker image, custom style configurations can be passed as environment variables. This example shows how to set a custom brand logo.

```bash
docker run -p 5005:5005 \
 -e DASHBOARD_HEADER_BRAND_LOGO=https://picsum.photos/500/100 \
 neo4jlabs/neodash
```

--------------------------------

### Kubernetes Service Definition for NeoDash

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Example YAML configuration for creating a Kubernetes Service to expose the NeoDash application. This sets up a LoadBalancer to make the service accessible externally.

```yaml
apiVersion: v1
kind: Service
metadata:
    name: neodash-svc
spec:
    type: LoadBalancer
    ports:
    - port: 5005
      targetPort: 5005
    selector:
      project: neodash
```

--------------------------------

### Kubernetes Pod Definition for NeoDash

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Example YAML configuration for creating a NeoDash pod in a Kubernetes cluster. It specifies the image and container port.

```yaml
apiVersion: v1
kind: Pod
metadata:
  name: neodash
  labels:
    project: neodash
spec:
  containers:
    - name: neodash
      image: neo4jlabs/neodash:latest
      ports:
        - containerPort: 5005
```

--------------------------------

### Rule-Based Styling Condition Example

Source: https://neo4j.com/labs/neodash/2.4/user-guide/extensions/rule-based-styling

Defines a rule to set the color of 'Warning' nodes to red when their 'level' property is 'critical'. This demonstrates the basic IF-THEN syntax for rule-based styling.

```text
IF Warning.level = "critical" THEN 'Node Color' = "red"
```

--------------------------------

### Basic Table Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/table

A simple Cypher query to return movie titles, release years, and the count of actors for each movie. This is a fundamental example for populating a table report.

```cypher
MATCH (n:Movie)<-[:ACTED_IN]-(p:Person)
RETURN n.title AS Title, n.released AS Released, count(p) as Actors
```

--------------------------------

### Run Cypress Tests (GUI)

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/testing

Use this command to open the Cypress GUI for interactive testing. Ensure a local NeoDash instance is running.

```bash
yarn run test
```

--------------------------------

### Build NeoDash for Production with Yarn

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Execute this command to build the NeoDash application for production deployment. This creates a 'build' folder containing the deployable assets.

```bash
yarn run build
```

--------------------------------

### Build NeoDash Docker Image on Windows

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Build the NeoDash Docker image locally on Windows systems. You may need to prefix the docker command with 'winpty'.

```bash
winpty docker build . -t neodash
```

--------------------------------

### Run NeoDash with Docker

Source: https://neo4j.com/labs/neodash/2.4/quickstart

Pull the latest NeoDash Docker image and run it. The container is exposed on port 5005.

```bash
docker pull neo4jlabs/neodash:latest
docker run -it --rm -p 5005:5005 neo4jlabs/neodash
```

--------------------------------

### Run Cypress Tests (Headless)

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/testing

Execute this command to run Cypress tests in headless mode, suitable for CI/CD pipelines. A local NeoDash instance must be running.

```bash
yarn run test-headless
```

--------------------------------

### Build NeoDash Docker Image

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Build the NeoDash Docker image locally using the provided Dockerfile. This command is for Unix-based systems (Mac/Linux).

```bash
docker build . -t neodash
```

--------------------------------

### Run Locally Built Docker Image

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Run the NeoDash Docker image that you have built locally. The application will be accessible at http://localhost:5005.

```bash
docker run -it –rm -p 5005:5005 neodash
```

--------------------------------

### Configure Multi-Database Access in Standalone Mode

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/configuration

When allowing users to load dashboards dynamically in Standalone Mode, enable multi-database connections by setting `standaloneMultiDatabase` to true and providing a comma-separated list of allowed database names in `standaloneDatabaseList`.

```yaml
standaloneMultiDatabase: true
standaloneDatabaseList: "neo4j,users,metrics"
```

--------------------------------

### Run NeoDash Locally with Docker

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/build-and-run

Pull the latest NeoDash Docker image and run it locally. The application will be accessible at http://localhost:5005. Customize the port using the NGINX_PORT environment variable.

```bash
# Run the application on http://localhost:5005
docker pull neo4jlabs/neodash:latest
docker run -it --rm -p 5005:5005 neo4jlabs/neodash

# If you want to run on a custom port, set an environment variable
export NGINX_PORT=5008
docker run -it --rm -e NGINX_PORT=5008 -p 5008:5008 neo4jlabs/neodash
```

--------------------------------

### Create a Basic List Visualization Component

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/adding-visualizations

A simple React component that renders Neo4j records as a list. It utilizes `renderValueByType` for displaying field values.

```typescript
import React from 'react';
import { ChartProps } from './Chart';
import { renderValueByType } from '../report/ReportRecordProcessing';

const NeoListReport = (props: ChartProps) => {
   const records = props.records;
   return records.map(r => {
       return <div>{
           r["_fields"].map(value => {
               return <>{renderValueByType(value)},</>
           })
       }
       </div>
   })
}

export default NeoListReport;
```

--------------------------------

### Configure NeoDash for Standalone Mode (Docker)

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/standalone-mode

Run NeoDash in Docker, passing environment variables to configure standalone mode and Neo4j connection details. Ensure all variables are set correctly.

```bash
docker run  -it --rm -p 5005:5005 \
    -e ssoEnabled=false \
    -e ssoProviders=[] \
    -e ssoDiscoveryUrl="https://example.com" \
    -e standalone=true \
    -e standaloneProtocol="neo4j+s" \
    -e standaloneHost="localhost" \
    -e standalonePort="7687" \
    -e standaloneDatabase="neo4j" \
    -e standaloneDashboardName="My Dashboard" \
    -e standaloneDashboardDatabase="dashboards" \
    -e standaloneDashboardURL="dashboards" \
    -e standaloneAllowLoad=false \
    -e standaloneLoadFromOtherDatabases=false \
    -e standaloneMultiDatabase=false \
    -e standaloneDatabaseList="neo4j" \
    neo4jlabs/neodash
```

--------------------------------

### Configure Neo4j Dashboard in Standalone Mode

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/configuration

Specify the Neo4j database and dashboard name to be loaded when Standalone Mode is enabled and the dashboard is hosted within Neo4j.

```yaml
standaloneDashboardName: "MyDashboard"
standaloneDashboardDatabase: "neo4j"
```

--------------------------------

### Configure URL Dashboard in Standalone Mode

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/configuration

Specify the URL from which to load the fixed dashboard when Standalone Mode is enabled.

```yaml
standaloneDashboardURL: "http://example.com/dashboard.json"
```

--------------------------------

### Basic Gauge Chart Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/gauge-chart

This Cypher query retrieves the CPU load percentage, scaled to be between 0 and 100, suitable for direct use with a gauge chart.

```cypher
MATCH (c:CPU)
WHERE c.id = 1
RETURN c.load_percentage * 100
```

--------------------------------

### Deep Linking with Dashboard Parameters

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/standalone-mode

Use URL parameters to set default values for dashboard parameters. Multiple parameters can be concatenated.

```url
https://myneodashdeployment.com/?page=1&neodash_person_name=Tom&neodash_movie_name=The%20Matrix
```

--------------------------------

### Allow Loading Dashboards in Standalone Mode

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/configuration

Enable users to load different dashboards after the initial predefined one is loaded in Standalone Mode. `standaloneAllowLoad` controls this feature, and `standaloneLoadFromOtherDatabases` allows loading from different databases.

```yaml
standaloneAllowLoad: true
standaloneLoadFromOtherDatabases: true
```

--------------------------------

### Configure NeoDash for Standalone Mode (Non-Docker)

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/standalone-mode

Edit `dist/config.json` to enable standalone mode by setting `standalone` to `true`. Configure other variables to match your Neo4j instance details.

```json
{
  "standalone": true,
  "neo4j": {
    "protocol": "neo4j",
    "host": "localhost",
    "port": 7687,
    "database": "neo4j"
  },
  "dashboard": {
    "name": "My Dashboard",
    "database": "dashboards"
  }
}
```

--------------------------------

### Unzip NeoDash Build

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/deploy-a-build

Use this command to extract NeoDash files from a zip archive in your terminal.

```bash
unzip neodash-2.X.X.zip
```

--------------------------------

### Set up Nginx Auth Provider for NeoDash

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/configuration

Configure an Nginx location block to handle authentication requests for NeoDash, routing them to an external identity provider. This is useful for integrating with OIDC providers.

```nginx
location /auth_provider {
        default_type application/json;
        return 200 '{
                        "auth_config" : {
                            "oidc_providers" : [ ... ]
                        }
                    }';
    }
```

--------------------------------

### Enable Standalone Mode in NeoDash

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/configuration

Enable Standalone Mode by setting the `standalone` config parameter to `true`. This mode allows deploying a fixed dashboard and overrides editor functionality. Other configuration parameters are ignored if `standalone` is `false`.

```yaml
standalone: true
```

--------------------------------

### NeoDash Application State Details

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/state-management

The 'application' state object contains UI-related information, connection details, and operational settings for the NeoDash application.

```json
"application": {
    "notificationTitle": null,
    "notificationMessage": null,
    "connectionModalOpen": false,
    "welcomeScreenOpen": true,
    "aboutModalOpen": true,
    "connection": {
      "protocol": "neo4j+s",
      "url": "localhost",
      "port": "",
      "database": "",
      "username": "neo4j",
      "password": "************"
    },
    "desktopConnection": null,
    "connected": false,
    "dashboardToLoadAfterConnecting": null,
    "waitForSSO": false,
    "standalone": false,
    "oldDashboard": null,
    "ssoEnabled": false,
    "ssoProviders": [],
    "ssoDiscoveryUrl": "https://example.com",
    "standaloneProtocol": "neo4j+s",
    "standaloneHost": "localhost",
    "standalonePort": "7687",
    "standaloneDatabase": "neo4j",
    "standaloneDashboardName": "My Dashboard",
    "standaloneDashboardDatabase": "dashboards",
    "standaloneDashboardURL": "dashboards",
    "loggingMode": "0",
    "loggingDatabase": "logging",
    "standaloneAllowLoad": false,
    "standaloneLoadFromOtherDatabases ": false,
    "standaloneMultiDatabase": false,
    "standaloneDatabaseList": "neo4j",
    "notificationIsDismissable": null
}
```

--------------------------------

### Configure SSO in NeoDash

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/configuration

Enable Single Sign-On by setting `ssoEnabled` to true and providing the `ssoDiscoveryUrl` for your Neo4j database's discovery.json. SSO is only available when Standalone Mode is enabled.

```yaml
ssoEnabled: true
ssoDiscoveryUrl: "http://your-neo4j-host:7474/discovery.json"
```

--------------------------------

### Simple Button Form Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/form

Use this Cypher query for a form that acts as a simple button to perform an operation, like incrementing a counter.

```cypher
MERGE (c:Counter)
SET c.count = c.count+1
```

--------------------------------

### Basic Line Chart (Actors born by decade)

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/line-chart

Use this Cypher query to create a basic line chart showing the count of people born in each decade. Ensure the X-axis values (Decade) are sorted in ascending order.

```cypher
MATCH (p:Person)
RETURN  (p.born/10)*10 as Decade, COUNT(p) as People
ORDER BY Decade ASC
```

--------------------------------

### Form Query with Parameter

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/form

This Cypher query demonstrates how to use a parameter to dynamically delete nodes from the graph based on user input.

```cypher
MATCH (p:Person)
WHERE p.name = $neodash_person_name
DETACH DELETE p
```

--------------------------------

### Display Nodes and Relationships on Map - Cypher

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/map

Visualize both nodes and the relationships between them on the map. This query returns breweries and the connections between them.

```cypher
MATCH (b:Brewery)-[e]->(b2:Brewery)
RETURN b, e, b2
```

--------------------------------

### Basic Radar Chart Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/radar

This Cypher query retrieves skill data for multiple players to be visualized in a radar chart. Ensure the player names and skill relationships match your graph schema.

```cypher
MATCH (s:Skill)
MATCH (:Player{name:"Messi"})-[h1:HAS_SKILL]->(s)
MATCH (:Player{name:"Mbappe"})-[h2:HAS_SKILL]->(s)
MATCH (:Player{name:"Benzema"})-[h3:HAS_SKILL]->(s)
MATCH (:Player{name:"C Ronaldo"})-[h4:HAS_SKILL]->(s)
MATCH (:Player{name:"Lewandowski"})-[h5:HAS_SKILL]->(s)
RETURN s.name as Skill, h1.value as Messi, h2.value as Mbappe, h3.value as Benzema,
                        h4.value as `C Ronaldo`, h5.value as Lewandowski
```

--------------------------------

### Basic Circle Packing Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/circle-packing

This Cypher query retrieves hierarchical data suitable for a circle packing chart. It defines a path from a 'Company' to 'Department' nodes and calculates the total employees for each department.

```cypher
MATCH path=(:Company{name:'NeoDash'})-[:HAS_DEPARTMENT*]->(:Department)
WITH nodes(path) as no
WITH  no, last(no) as leaf
WITH  [n IN no[..-1] | n.name] AS result, sum(leaf.employees) as val
RETURN result, val
```

--------------------------------

### Setting NeoDash Parameters via URL Deep-Linking

Source: https://neo4j.com/labs/neodash/2.4/user-guide/dashboards

This URL shows how to set NeoDash parameters directly through URL query parameters. When a user visits this URL, the parameter '$neodash_person_name' will be set to 'Adam' for the dashboard.

```url
https://neodash.graphapp.io/?neodash_person_name=Adam
```

--------------------------------

### Using Dashboard Parameters in Cypher Queries

Source: https://neo4j.com/labs/neodash/2.4/user-guide/dashboards

This query demonstrates how to use a dashboard parameter, prefixed with '$neodash_', within a Cypher query to filter results. Ensure the parameter is set in NeoDash for the query to function correctly.

```cypher
MATCH (m:Movie)<-[a:ACTED_IN]-(p:Person)
WHERE m.title = $neodash_movie_title
RETURN m, a, p
```

--------------------------------

### Simple Bar Chart Cypher Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/bar-chart

Use this Cypher query to create a simple bar chart. It returns a title for the bars and a count of associated people.

```cypher
MATCH (p:Person)-[e]->(m:Movie)
RETURN m.title as Title, COUNT(p) as People
```

--------------------------------

### Extract NeoDash Tarball

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/deploy-a-build

Use this command to extract NeoDash files from a tar.gz archive in your terminal.

```bash
tar -xf neodash-2.X.X.tar.gz
```

--------------------------------

### Virtual Graph Query for 3D Visualization

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/graph3d

This Cypher query demonstrates creating virtual relationships for a 3D graph visualization, connecting two persons who acted in the same movie.

```cypher
MATCH (p:Person)-[:ACTED_IN]->(m:Movie)<-[:ACTED_IN]-(p2:Person)
WHERE m.title = "The Matrix"
RETURN p, p2, apoc.create.vRelationship(p, "KNOWS", {}, p2)
```

--------------------------------

### Generate Artificial Map Data - Cypher

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/map

Create artificial nodes and relationships by returning dictionaries. This is useful when the visualization expects nodes/relationships but you are providing custom data structures.

```cypher
MATCH (l1:Location)<--(a:Person),
      (a:Person)-[:KNOWS]-(b:Person),
      (b:Person)-->(l2:Location)
RETURN {id: a.name, label: "Person", point: l1.point},
       {id: b.name, label: "Person", point: l2.point},
       {start: a.name, end: b.name, type: "KNOWS", id: 1}
```

--------------------------------

### NeoDash Application State Structure

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/state-management

The top-level JSON structure encapsulating the entire application state, including dashboard and application-specific data.

```json
{
  "dashboard": {
    "title": "My Dashboard Name",
    "version": "2.4",
    "settings": {
      "pagenumber": 0,
      "editable": true,
      "parameters": {
          "...": "..."
       }
    },
    "pages": [
        ...
    ]
  },
  "application": {
        ...
   },
  "version": "2.1.0"
}
```

--------------------------------

### Basic 3D Graph Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/graph3d

Use this Cypher query to return nodes and relationships for a basic 3D graph visualization, filtering by movie title.

```cypher
MATCH (p:Person)-[a:ACTED_IN]->(m:Movie)
WHERE m.title = 'The Matrix'
RETURN p, a, m
```

--------------------------------

### Register New Visualization Type in Configuration

Source: https://neo4j.com/labs/neodash/2.4/developer-guide/adding-visualizations

Adds a new 'list' visualization type to the `REPORT_TYPES` dictionary in `config/ReportConfig.tsx`, making it available in the NeoDash interface.

```typescript
export const REPORT_TYPES = {
   ...
   "list": {
       label: "List",
       helperText: "I'm a list",
       component: NeoListReport,
       maxRecords: 10,
       settings: {}
   },
   ...
```

--------------------------------

### Display Nodes on Map - Cypher

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/map

Return nodes with spatial properties to visualize them on the map. Ensure nodes have location data stored.

```cypher
MATCH (b:Brewery)
RETURN b
```

--------------------------------

### Basic Sunburst Chart Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/sunburst

This Cypher query retrieves hierarchical data suitable for a Sunburst chart. It defines a path from a 'Company' to 'Department' nodes and aggregates employee counts.

```cypher
MATCH path=(:Company{name:'NeoDash'})-[:HAS_DEPARTMENT*]->(:Department)
WITH nodes(path) as no
WITH no, last(no) as leaf
WITH  [n IN no[..-1] | n.name] AS result, sum(leaf.employees) as val
RETURN result, val
```

--------------------------------

### Report Action Rule Structure

Source: https://neo4j.com/labs/neodash/2.4/user-guide/extensions/report-actions

Defines the basic structure for creating a report action rule. This format is used within the rule definition window to specify conditions and actions.

```plaintext
IF [CONDITION] SET [OBJECT] TO [VALUE]
```

--------------------------------

### Basic Pie Chart Cypher Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/pie-chart

Use this Cypher query to return categories and their associated counts for a basic pie chart. Ensure your query returns a text field for the category and a numeric field for the value.

```cypher
Match (p:Person)-[e]->(m:Movie)
RETURN m.title as Title, COUNT(p) as People
LIMIT 8
```

--------------------------------

### Donut Chart Cypher Query

Source: https://neo4j.com/labs/neodash/2.4/user-guide/reports/pie-chart

This Cypher query demonstrates how to create data suitable for a donut chart by filtering for a specific movie and returning the count of different roles. This query is useful for showing the distribution of a specific category.

```cypher
MATCH (p:Person)-[e]->(m:Movie)
WHERE m.title = "Cloud Atlas"
WITH TYPE(e) as Role
RETURN Role, COUNT(Role) as Count
```