@neo4j-cypher/react-codemirror 2.0.0-next.4 → 2.0.0-next.41

package/src/lang-cypher/parser-adapter.ts

@@ -0,0 +1,146 @@
+import type { Facet } from '@codemirror/state';
+import type { Input, NodeType, PartialParse } from '@lezer/common';
+import { Parser, Tree } from '@lezer/common';
+import type { ParsedCypherToken } from '@neo4j-cypher/language-support';
+
+import Prism from 'prismjs';
+import type { CodemirrorParseTokenType } from './constants';
+import { cypherTokenTypeToNode, parserAdapterNodeSet } from './constants';
+// Must come before prism-cypher: it publishes the global `Prism` that the
+// component script assigns onto.
+import './prism-global.js';
+// This import will load the cypher support in prisma
+import 'prismjs/components/prism-cypher';
+import type { CypherConfig } from './langCypher';
+
+const DEFAULT_NODE_GROUP_SIZE = 4;
+Prism.manual = true;
+
+export class ParserAdapter extends Parser {
+  cypherTokenTypeToNode: Record<CodemirrorParseTokenType, NodeType>;
+
+  constructor(
+    facet: Facet<unknown>,
+    private config: CypherConfig,
+  ) {
+    super();
+    this.cypherTokenTypeToNode = cypherTokenTypeToNode(facet);
+  }
+
+  createParse(input: Input): PartialParse {
+    return this.startParse(input);
+  }
+
+  /* There are more arguments, but since we don't do any incremental parsing, they are not useful */
+  startParse(input: string | Input): PartialParse {
+    const document =
+      typeof input === 'string' ? input : input.read(0, input.length);
+
+    const tree = this.buildTree(document);
+
+    return {
+      stoppedAt: input.length,
+      parsedPos: input.length,
+      stopAt: () => {
+        return undefined;
+      },
+      advance: () => tree,
+    };
+  }
+
+  private buildTree(document: string) {
+    const parse = this.config.useLightVersion
+      ? this.prismParse(document)
+      : this.antlrParse(document);
+
+    if (parse.tokens.length === 0) {
+      return this.createEmptyTree(document);
+    }
+
+    const buffer =
+      parse.type === 'prism'
+        ? this.createBufferForPrismTokens(parse.tokens)
+        : this.createBufferForAntlrTokens(parse.tokens);
+
+    this.addTopNodeToBuffer(buffer, document);
+
+    return Tree.build({
+      buffer: buffer.flat(),
+      nodeSet: parserAdapterNodeSet(this.cypherTokenTypeToNode),
+      topID: this.cypherTokenTypeToNode.topNode.id,
+    });
+  }
+
+  private antlrParse(document: string) {
+    const startTime = performance.now();
+    const tokens = this.config.languageService.highlightSyntax(document);
+    const timeTaken = performance.now() - startTime;
+    if (timeTaken > 300) {
+      this.config.setUseLightVersion?.(true);
+    }
+    return { type: 'antlr' as const, tokens };
+  }
+
+  private prismParse(document: string) {
+    if (document.length === 0) {
+      this.config.setUseLightVersion?.(false);
+    }
+    const tokens = Prism.tokenize(document, Prism.languages.cypher);
+    return {
+      type: 'prism' as const,
+      tokens,
+    };
+  }
+  private createBufferForAntlrTokens(tokens: ParsedCypherToken[]) {
+    return tokens.map((token) => {
+      const nodeTypeId = this.cypherTokenTypeToNode[token.tokenType].id;
+      const startOffset = token.position.startOffset;
+      const endOffset = token.position.startOffset + token.length;
+
+      return [nodeTypeId, startOffset, endOffset, DEFAULT_NODE_GROUP_SIZE];
+    });
+  }
+
+  private createBufferForPrismTokens(tokens: (string | Prism.Token)[]) {
+    let totalOffset = 0;
+    return tokens.map((token) => {
+      const tokenType = (
+        typeof token === 'string' ? 'variable' : token.type
+      ) as CodemirrorParseTokenType;
+
+      const nodeTypeId = this.cypherTokenTypeToNode[tokenType].id;
+      const startOffset = totalOffset;
+      const endOffset = startOffset + token.length;
+      totalOffset = endOffset;
+
+      return [nodeTypeId, startOffset, endOffset, DEFAULT_NODE_GROUP_SIZE];
+    });
+  }
+
+  private createEmptyTree(document: string) {
+    return Tree.build({
+      buffer: [
+        this.cypherTokenTypeToNode.topNode.id,
+        0,
+        document.length,
+        DEFAULT_NODE_GROUP_SIZE,
+      ],
+      nodeSet: parserAdapterNodeSet(this.cypherTokenTypeToNode),
+      topID: this.cypherTokenTypeToNode.topNode.id,
+    });
+  }
+
+  private addTopNodeToBuffer(buffer: number[][], document: string) {
+    const id = this.cypherTokenTypeToNode.topNode.id;
+    const startOffset = 0;
+    const endOffset = document.length;
+    const totalBufferLength = buffer.length * DEFAULT_NODE_GROUP_SIZE;
+
+    buffer.push([
+      id,
+      startOffset,
+      endOffset,
+      totalBufferLength + DEFAULT_NODE_GROUP_SIZE,
+    ]);
+  }
+}

package/src/lang-cypher/prism-global.ts

@@ -0,0 +1,7 @@
+import Prism from 'prismjs';
+
+// `prismjs/components/prism-cypher` (used in parser-adapter) is a plain script that mutates the global
+// `Prism`. Bundlers keep prismjs' CJS core lazy and may evaluate the component
+// before the core has run, so force the core to initialise (and publish the
+// global) from a module that is imported first.
+(globalThis as { Prism?: typeof Prism }).Prism = Prism;

package/src/lang-cypher/signatureHelp.ts

@@ -0,0 +1,154 @@
+import type { EditorState } from '@codemirror/state';
+import { StateField } from '@codemirror/state';
+import type { Tooltip } from '@codemirror/view';
+import { showTooltip } from '@codemirror/view';
+import type { SignatureInformation } from 'vscode-languageserver-types';
+import { MarkupContent } from 'vscode-languageserver-types';
+import type { CypherConfig } from './langCypher';
+import { getDocString } from './utils';
+
+function getTriggerCharacter(query: string, caretPosition: number) {
+  let i = caretPosition - 1;
+  let triggerCharacter = query.at(i);
+
+  // Discard all space characters. Note that a space can be more than just a ' '
+  while (/\s/.test(triggerCharacter) && i > 0) {
+    i -= 1;
+    triggerCharacter = query.at(i);
+  }
+
+  return triggerCharacter;
+}
+
+const createSignatureHelpElement =
+  ({
+    signature,
+    activeParameter,
+  }: {
+    signature: SignatureInformation;
+    activeParameter: number;
+  }) =>
+  () => {
+    const parameters = signature.parameters;
+    const doc = getDocString(signature.documentation);
+    const dom = document.createElement('div');
+    dom.className = 'cm-signature-help-panel';
+
+    const contents = document.createElement('div');
+    contents.className = 'cm-signature-help-panel-contents';
+    dom.appendChild(contents);
+
+    const signatureLabel = document.createElement('div');
+    signatureLabel.className = 'cm-signature-help-panel-name';
+    const methodName = signature.label.slice(0, signature.label.indexOf('('));
+    const returnType = signature.label.slice(signature.label.indexOf(')') + 1);
+    signatureLabel.appendChild(document.createTextNode(`${methodName}(`));
+    let currentParamDescription: string | undefined = undefined;
+
+    parameters.forEach((param, index) => {
+      if (typeof param.label === 'string') {
+        const span = document.createElement('span');
+        span.appendChild(document.createTextNode(param.label));
+        if (index !== parameters.length - 1) {
+          span.appendChild(document.createTextNode(', '));
+        }
+
+        if (index === activeParameter) {
+          span.className = 'cm-signature-help-panel-current-argument';
+          const paramDoc = param.documentation;
+          currentParamDescription = MarkupContent.is(paramDoc)
+            ? paramDoc.value
+            : paramDoc;
+        }
+        signatureLabel.appendChild(span);
+      }
+    });
+
+    signatureLabel.appendChild(document.createTextNode(')'));
+    signatureLabel.appendChild(document.createTextNode(returnType));
+
+    contents.appendChild(signatureLabel);
+
+    const separator = document.createElement('div');
+    separator.className = 'cm-signature-help-panel-separator';
+
+    contents.appendChild(separator);
+
+    if (currentParamDescription !== undefined) {
+      const argDescription = document.createElement('div');
+      argDescription.className = 'cm-signature-help-panel-arg-description';
+      argDescription.appendChild(
+        document.createTextNode(currentParamDescription),
+      );
+      contents.appendChild(argDescription);
+    }
+    const methodDescription = document.createElement('div');
+    methodDescription.className = 'cm-signature-help-panel-description';
+    methodDescription.appendChild(document.createTextNode(doc));
+    contents.appendChild(methodDescription);
+
+    return { dom };
+  };
+
+function getSignatureHelpTooltip(
+  state: EditorState,
+  config: CypherConfig,
+): Tooltip[] {
+  let result: Tooltip[] = [];
+  const schema = config.schema;
+  const ranges = state.selection.ranges;
+  const range = ranges.at(0);
+
+  if (schema && ranges.length === 1 && range.from === range.to) {
+    const caretPosition = range.from;
+    const query = state.doc.toString();
+
+    const triggerCharacter = getTriggerCharacter(query, caretPosition);
+
+    if (triggerCharacter === '(' || triggerCharacter === ',') {
+      const signatureHelpInfo = config.languageService.getSignatureHelp(
+        query,
+        schema,
+        { caretPosition },
+      );
+      const activeSignature = signatureHelpInfo.activeSignature;
+      const signatures = signatureHelpInfo.signatures;
+      const activeParameter = signatureHelpInfo.activeParameter;
+
+      if (
+        activeSignature !== undefined &&
+        activeSignature >= 0 &&
+        activeSignature < signatures.length &&
+        signatures[activeSignature].documentation !== undefined
+      ) {
+        const signature = signatures[activeSignature];
+        const showSignatureTooltipBelow =
+          config.showSignatureTooltipBelow ?? true;
+
+        result = [
+          {
+            pos: caretPosition,
+            above: !showSignatureTooltipBelow,
+            arrow: true,
+            create: createSignatureHelpElement({ signature, activeParameter }),
+          },
+        ];
+      }
+    }
+  }
+
+  return result;
+}
+
+export function signatureHelpTooltip(config: CypherConfig) {
+  return StateField.define<readonly Tooltip[]>({
+    create: (state) => getSignatureHelpTooltip(state, config),
+
+    update(tooltips, tr) {
+      if (!tr.docChanged && !tr.selection) return tooltips;
+      return getSignatureHelpTooltip(tr.state, config);
+    },
+
+    provide: (f) => showTooltip.computeN([f], (state) => state.field(f)),
+  });
+}

package/src/lang-cypher/syntaxValidation.ts

@@ -0,0 +1,81 @@
+import type { Diagnostic } from '@codemirror/lint';
+import { linter } from '@codemirror/lint';
+import type { Extension } from '@codemirror/state';
+import { DiagnosticSeverity, DiagnosticTag } from 'vscode-languageserver-types';
+import workerpool from 'workerpool';
+import type { CypherConfig } from './langCypher';
+import type { LintWorker } from '@neo4j-cypher/lint-worker';
+import { isNotParamError } from '@neo4j-cypher/language-support';
+
+const WorkerURL = new URL('./lintWorker.mjs', import.meta.url).pathname;
+
+const pool = workerpool.pool(WorkerURL, {
+  minWorkers: 1,
+  workerOpts: { type: 'module' },
+  workerTerminateTimeout: 2000,
+});
+
+export const cypherLinter: (config: CypherConfig) => Extension = (config) =>
+  linter(async (view) => {
+    if (!config.lint) {
+      return [];
+    }
+    const query = view.state.doc.toString();
+    if (query.length === 0) {
+      return [];
+    }
+
+    try {
+      if (pool.stats().busyWorkers > 0) {
+        await pool.terminate(true);
+      }
+
+      const proxyWorker = (await pool.proxy()) as unknown as LintWorker;
+      const result = await proxyWorker.lintCypherQuery(
+        query,
+        config.schema ?? {},
+        config.featureFlags ?? {},
+      );
+
+      if (result.symbolTables) {
+        config.languageService.setSymbolsInfo({
+          query,
+          symbolTables: result.symbolTables,
+        });
+      }
+
+      const a: Diagnostic[] = result.diagnostics.map((diagnostic) => {
+        return {
+          from: diagnostic.offsets.start >= 0 ? diagnostic.offsets.start : 0,
+          to:
+            diagnostic.offsets.end >= 0 ? diagnostic.offsets.end : query.length,
+          severity:
+            diagnostic.severity === DiagnosticSeverity.Error
+              ? 'error'
+              : 'warning',
+          message: diagnostic.message,
+          ...(diagnostic.tags !== undefined &&
+          diagnostic.tags.includes(DiagnosticTag.Deprecated)
+            ? { markClass: 'cm-deprecated-element' }
+            : {}),
+        };
+      });
+      if (!config.schema?.databaseNames?.length) {
+        return a.filter(isNotParamError);
+      }
+      return a;
+    } catch (err) {
+      if (err instanceof Error) {
+        if (!err.message.includes('Worker terminated')) {
+          console.error(String(err) + ' ' + query);
+        }
+      } else {
+        console.error(JSON.stringify(err));
+      }
+    }
+    return [];
+  });
+
+export const cleanupWorkers = () => {
+  void pool.terminate();
+};

package/src/lang-cypher/utils.ts

@@ -0,0 +1,9 @@
+import { MarkupContent } from 'vscode-languageserver-types';
+
+export function getDocString(result: string | MarkupContent): string {
+  if (MarkupContent.is(result)) {
+    return result.value;
+  } else {
+    return result;
+  }
+}

package/src/{ndl-tokens-copy.test.ts → ndlTokensCopy.test.ts}

@@ -1,5 +1,6 @@
 import { tokens } from '@neo4j-ndl/base';
-import { tokens as tokensCopy } from './ndl-tokens-copy';
+import { expect, test } from 'vitest';
+import { tokens as tokensCopy } from './ndlTokensCopy';
 
 /*
  * Needle has some odd package configuration that made playwright stop working