fr-ser / grafana-sqlite-datasource

Grafana Plugin to enable SQLite as a Datasource
Apache License 2.0
124 stars 17 forks source link

Enable syntax highlighting in the query editor #84

Closed chaitan94 closed 2 years ago

chaitan94 commented 2 years ago

Firstly, thanks for the great plugin :)

I was wondering if is possible to make the query editor use syntax highlighting for SQL. I am not sure how grafana plugins work in general, but after a brief glance at the code, I think maybe just using the CodeEditor component instead of TextArea might fix this.

fr-ser commented 2 years ago

I tried ages ago when the plugin was first released and failed due to a lack of documentation (see link).

I haven't tried the CodeEditor component, though. I'll give it a try soon 👌🏻 If you have any links to documentation or examples that would definitely be welcome.

chaitan94 commented 2 years ago

I am not sure if it is documented. The way I found it is I looked at the code for how the official postgres datasource does syntax highlighting. Here is the code for that - it uses the CodeEditor component. Of course this is not the correct example, however, as it is still using the old angular based code of grafana instead of react. But a react version of the component seems to exist too as can be seen here.

fr-ser commented 2 years ago

I used the code editor component here but sadly lost the ability to resize. I personally think it is still worth it but I would love some additional thoughts.

Can someone try out the pre-release and see how it looks for them: https://github.com/fr-ser/grafana-sqlite-datasource/releases/tag/v3.1.0-rc.1 FYI @chaitan94

chaitan94 commented 2 years ago

I happened to be free right now, so I just tried it - and I must say it looks much better now! :smile:

I think resize is not a big deal. I use postgres data source in grafana all the time and I never worried too much about not being able to resize. Syntax highlighting, however, at least to me, is much more important.

image

fr-ser commented 2 years ago

Makes sense. I think I'll see if I can add an option to choose the old or new query editor to get a better feeling about adoption.

rayures commented 2 years ago

This is already implemented right?

I. e I have code highlighting wit latest in grafana

fr-ser commented 2 years ago

Yes, the latest release has code highlighting with the option to use the old editor.