Provide SQLPage syntax for code completion / IDEs

[guspower]

What are you building with SQLPage ?

All sorts of little tools ;) The latest is a simple system for storing and sharing diagrams using mermaid.

What is your problem ? A description of the problem, not the solution you are proposing.

I use different variants of IntelliJ and CoC with vim. Thanks to all the progress with language servers, autocompletion has really come on in the past few years. If sqlpage could somehow provide additional code completion / language server bindings that would be a real improvement to the developer experience. For example:

sqlpage.run_sql('chart/shell.sql')

gives a nasty red error in IntelliJ.

What are you currently doing ? Since your solution is not implemented in SQLPage currently, what are you doing instead ?

Trying to ignore the editor warnings.

A clear and concise description of what you want to happen.

The editor shows autocomplete / hinting for sqlpage along with those for the SQL type in question (I usually use postgresql).

A clear and concise description of any alternative solutions or features you've considered.

Creating a separate sqlpage schema, creating mimic functions and adding it to the editor schema resolution path.

Additional context Intellij (rustrover) screenshot

[lovasoa]

Yes, a sqlpage language server would be great ! But it would also be a lot of work, with few people ready to sponsor such work, so it is not something I am currently prioritizing...

[accforgithubtest]

The latest is a simple system for storing and sharing diagrams using mermaid

@guspower - I would be very keen to see how this is working out. Any chance you will be sharing this project on github ?

[guspower]

@accforgithubtest it's not on github, and it's very simple. It uses mermaid along with svg-pan-zoom. Here are the bits:

SQL: Chart Table

CREATE TABLE chart
(
    id          bigserial
        PRIMARY KEY,
    code        varchar                                 NOT NULL,   # <= where the mermaid diagram text lives
    created     timestamp DEFAULT NOW(),
    updated     timestamp,
    deleted     boolean   DEFAULT FALSE,
    title       varchar   DEFAULT ''::character varying NOT NULL,
    version     integer   DEFAULT 0                     NOT NULL,
    description varchar
);

The chart view just uses the html component at the moment:

SELECT
    'html' AS component,
    '<pre class="mermaid">' || code || '</pre>' AS html
FROM
    chart.chart
WHERE
    id = $id::bigint;

and then a javascript module loads it via the shell:

import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs';

mermaid.run({
    querySelector: '.mermaid',
    postRenderCallback: (id) => {
        var chart = document.getElementById(id);
        var height = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
        chart.style.height = "" + height + "px";

        svgPanZoom('.mermaid svg', { controlIconsEnabled: true, fit: false, contain: false });
    }
});

Annoyingly you have to set the height explicitly when using svg-pan-zoom as you can see above.

There's not a whole lot more to it beyond that :)

[accforgithubtest]

Thank you for the share @guspower ! Gonna give this a try soon!

[guspower]

@accforgithubtest if you need more details let me know