flow icon indicating copy to clipboard operation
flow copied to clipboard

[Task]: Flow Playground Autocompletion

Open norberttech opened this issue 2 months ago • 0 comments

What needs to be done?

Right now Flow Playground can execute Flow pipelines easily, however creating them is not that easy.

The main missing feature that will improve DX significantly is autocompletion.

The goal is to create an autocompletion mechanism that will:

  • suggest methods of src/core/etl/src/Flow/ETL/DataFrame.php
  • suggest methods of src/core/etl/src/Flow/ETL/Function/ScalarFunctionChain.php
  • suggest DSL functions

Our playground is based on Ace Editor, and since it does not have any good documentation about how to build autocompleters, I created one with Claude autocompleters.md

This is going to be 2 steps mechanism.

  1. Through reflections we need to extract methods / functions from Flow codebase and convert them to json arrays like those below:
// Basic completion object
{
    value: "myFunction",
    caption: "myFunction()",
    meta: "function",
    score: 100
}

// Advanced completion with snippet and documentation
{
    value: "forEach",
    snippet: "forEach(function(${1:item}) {\n\t${2:// body}\n})",
    caption: "forEach(callback)",
    meta: "method",
    score: 1000,
    docText: "Executes a provided function once for each array element"
}
  1. Use those completions to create custom code completers and register them in web/landing/assets/controllers/code_editor_controller.js

norberttech avatar Nov 03 '25 21:11 norberttech