proof of concept

Author: OskarDamkjaer

src/application/ApplicationThunks.ts

@@ -68,7 +68,8 @@ export const createConnectionThunk =
  const loggingSettings = applicationGetLoggingSettings(loggingState);
  const neodashMode = applicationIsStandalone(loggingState) ? 'Standalone' : 'Editor';
  try {
- const driver = createDriver(protocol, url, port, username, password, { userAgent: `neodash/v${version}` });
+ // TODO remember the 7474 port needs to be used
+ const driver = createDriver('http', url, port, username, password, { userAgent: `neodash/v${version}` });
  // eslint-disable-next-line no-console
  console.log('Attempting to connect...');
  const validateConnection = (records) => {

src/dashboard/Dashboard.tsx

@@ -7,7 +7,7 @@ import NeoPage from '../page/Page';
 import { forceRefreshPage } from '../page/PageActions';
 import { createNotificationThunk } from '../page/PageThunks';
 import { getPageNumber } from '../settings/SettingsSelectors';
-import { createDriver, Neo4jProvider } from '../use-neo4j';
+import { Neo4jProvider, createDriver } from '../use-neo4j';
 import NeoDashboardHeader from './header/DashboardHeader';
 import NeoDashboardHeaderPageList from './header/DashboardHeaderPageList';
 import NeoDashboardTitle from './header/DashboardTitle';
@@ -26,14 +26,9 @@ const Dashboard = ({
 
  // If no driver is yet instantiated, create a new one.
  if (driver == undefined) {
- const newDriver = createDriver(
- connection.protocol,
- connection.url,
- connection.port,
- connection.username,
- connection.password,
- { userAgent: `neodash/v${version}` }
- );
+ const newDriver = createDriver('http', connection.url, connection.port, connection.username, connection.password, {
+ userAgent: `neodash/v${version}`,
+ });
  setDriver(newDriver);
  }
  const content = (

src/report/ReportQueryRunner.ts

@@ -1,5 +1,5 @@
-import { extractNodePropertiesFromRecords, extractNodeAndRelPropertiesFromRecords } from './ReportRecordProcessing';
 import isEqual from 'lodash.isequal';
+import { extractNodeAndRelPropertiesFromRecords, extractNodePropertiesFromRecords } from './ReportRecordProcessing';
 
 export enum QueryStatus {
  NO_QUERY, // No query specified
@@ -66,8 +66,9 @@ export async function runCypherQuery(
  return;
  }
 
+ // we need to ensure the databse ame is set
  const session = database ? driver.session({ database: database }) : driver.session();
- const transaction = session.beginTransaction({ timeout: queryTimeLimit * 1000, connectionTimeout: 2000 });
+ // const transaction = session.beginTransaction({ timeout: queryTimeLimit * 1000, connectionTimeout: 2000 });
 
  // For usuability reasons, we can set a hard cap on the query result size by wrapping it a subquery (Neo4j 4.0 and later).
  // This unfortunately does not preserve ordering on the return fields.
@@ -79,17 +80,18 @@ export async function runCypherQuery(
  query = `CALL { ${query}} RETURN * LIMIT ${rowLimit + 1}`;
  }
  }
+ // we use async iteratiors in workspace to archieve this, pro tip!
 
- await transaction
- .run(query, parameters)
+ await session
+ // TODO seems the timeout doesn't work poreoprly eitehr
+ .run(query, parameters) // , { timeout: queryTimeLimit * 1000, connectionTimeout: 2000 })
  .then((res) => {
  // @ts-ignore
  const { records } = res;
  // TODO - check query summary to ensure that no writes are made in safe-mode.
  if (records.length == 0) {
  setStatus(QueryStatus.NO_DATA);
  // console.log("TODO remove this - QUERY RETURNED NO DATA!")
- transaction.commit();
  return;
  }
 
@@ -111,20 +113,16 @@ export async function runCypherQuery(
  if (records == null) {
  setStatus(QueryStatus.NO_DRAWABLE_DATA);
  // console.log("TODO remove this - QUERY RETURNED NO DRAWABLE DATA!")
- transaction.commit();
  return;
  } else if (records.length > rowLimit) {
  setStatus(QueryStatus.COMPLETE_TRUNCATED);
  setRecords(records.slice(0, rowLimit));
  // console.log("TODO remove this - QUERY RETURNED WAS TRUNCTURED!")
- transaction.commit();
  return;
  }
  setStatus(QueryStatus.COMPLETE);
  setRecords(records);
  // console.log("TODO remove this - QUERY WAS EXECUTED SUCCESFULLY!")
-
- transaction.commit();
  })
  .catch((e) => {
  // setFields([]);
@@ -139,7 +137,6 @@ export async function runCypherQuery(
  ) {
  setStatus(QueryStatus.TIMED_OUT);
  setRecords([{ error: e.message }]);
- transaction.rollback();
  return e.message;
  }
 
@@ -148,7 +145,6 @@ export async function runCypherQuery(
  if (setRecords) {
  setRecords([{ error: e.message }]);
  }
- transaction.rollback();
  return e.message;
  });
 }

src/report/ReportRecordProcessing.tsx

@@ -1,7 +1,7 @@
-import React from 'react';
 import { Chip, Tooltip } from '@mui/material';
-import { GraphLabel, TextLink } from '@neo4j-ndl/react';
 import { withStyles } from '@mui/styles';
+import { GraphLabel, TextLink } from '@neo4j-ndl/react';
+import React from 'react';
 import {
  getRecordType,
  toNumber,
@@ -129,6 +129,7 @@ const HtmlTooltip = withStyles(() => ({
  },
 }))(Tooltip);
 
+// TODO please antionio could you add elementId
 function addDirection(relationship, start) {
  relationship.direction = relationship.start.low == start.identity.low;
  return relationship;

src/use-neo4j/driver.ts

@@ -1,12 +1,19 @@
-import { Neo4jConfig, Neo4jScheme } from "./neo4j-config.interface"
+import { Neo4jScheme } from './neo4j-config.interface';
 
-import neo4j, { Config } from '../neo4j-driver-lite/neo4j-lite-web.esm'
+import neo4j, { Config } from '../neo4j-driver-lite/neo4j-lite-web.esm';
 
-export const createDriver = (scheme: Neo4jScheme, host: string, port: string | number, username?: string, password?: string, config?: Config) => {
- if ( !username || !password ) {
- return neo4j.driver(`${scheme}://${host}:${port}`)
- }
-
- return neo4j.driver(`${scheme}://${host}:${port}`, neo4j.auth.basic(username, password), config)
-}
+export const createDriver = (
+ scheme: Neo4jScheme,
+ host: string,
+ port: string | number,
+ username?: string,
+ password?: string,
+ config?: Config
+) => {
+ if (!username || !password) {
+ return neo4j.driver(`${scheme}://${host}:${port}`);
+ }
 
+ const url = `${scheme}://${host}:${port}`;
+ return neo4j.driver(url, neo4j.auth.basic(username, password), config);
+};

src/use-neo4j/neo4j-config.interface.ts

@@ -1,12 +1,22 @@
-export type Neo4jScheme = 'neo4j' | 'neo4j+s' | 'neo4j+scc' | 'bolt' | 'bolt+s' | 'bolt+scc'
+export type Neo4jScheme =
+ | 'neo4j'
+ | 'neo4j+s'
+ | 'neo4j+scc'
+ | 'bolt'
+ | 'bolt+s'
+ | 'bolt+scc'
+ | 'http'
+ | 'https'
+ | 'http+s'
+ | 'https+s';
 
 export interface Neo4jConfig {
-  scheme: Neo4jScheme;
-  host: string;
-  port: number | string;
-  username: string | undefined;
-  password: string | undefined;
-  database?: string | undefined;
+ scheme: Neo4jScheme;
+ host: string;
+ port: number | string;
+ username: string | undefined;
+ password: string | undefined;
+ database?: string | undefined;
 }
 
-export const LOCAL_STORAGE_KEY = '$$charts::config'
+export const LOCAL_STORAGE_KEY = '$$charts::config';

src/use-neo4j/neo4j.provider.tsx

@@ -42,7 +42,7 @@ export const Neo4jProvider: React.FC<Neo4jProviderProps> = (props: Neo4jProvider
  setDatabase(database);
  setAuthenticating(true);
 
- const newDriver = createDriver(config.scheme, config.host, config.port, config.username, config.password);
+ const newDriver = createDriver('http', config.host, config.port, config.username, config.password);
 
  newDriver
  .verifyConnectivity()