Development

At a high level, the Editor box is like a smart <TextArea> for typing queries/code with assistance. It is composed of a visual code editor (currently based on Ace), with visuals and interactions handled in Vue.js, and relies on pluggable Autocompletes (e.g. Ace, Hue).

The execution and result table are optional and can be the ones already in your application.

Architecture

“Editor Architecture”

File Structure

ComposeEditor.vue, AceEditor.vue, AceAutocomplete.vue are the “glue” and visual components.

SyntaxAutocompleter.ts, sqlParseSupport.js, AceLocationHandler.ts, js/sql/workers are the key logic points for the suggestions.

  • dist/: compiled parsers, workers, and web components
  • docs/: documentation source for what you’re reading right now
    • content/: raw markdown for documentation
    • other files required to render documentation
  • js/: the main code for the editor
    • api/
    • apps/editor/
      • components/: Vue components that make up the editor
    • catalog/: objects and helpers related to the catalog schema, for parsing and autocomplete
    • components/: reusable components, icons, and styles
    • ext/ace2/: the Ace editor, compiled from tools/ace-editor/ (do NOT edit directly)
    • parse/: files related to parsers
      • jison/: jison files used to generate SQL syntax parsers
      • sql/dbsql/: auto-generated parsers from jison files
    • sql/
      • reference/: reference files for functions, keywords etc related to each dialect
        • dbsql/: generated from Databricks docs repo (do NOT edit directly)
    • utils/
    • webComponents/
  • tools/: non-source code files such as scripts for CI, examples, etc
    • ace-editor/ : library source for Ace editor, modded from the vanilla version
    • ci/
    • examples/: lightweight example applications you can use to test or demo the compose editor
      • editor/: a wrapper around the compose editor
      • sql-scratchpad/: demo of the full scratchpad
    • jison/generateParsers.js: script to generate Javascript parser from jison files for a dialect
    • references/dbsql/: scripts to generate DBSQL references
  • other miscellaneous config files