grafana / grafana

The open and composable observability and data visualization platform. Visualize metrics, logs, and traces from multiple sources like Prometheus, Loki, Elasticsearch, InfluxDB, Postgres and many more.
https://grafana.com
GNU Affero General Public License v3.0
64.05k stars 11.99k forks source link

App Extensions: Add app extension point to QueryEditorRow #93224

Open aocenas opened 1 week ago

aocenas commented 1 week ago

As part of work on Query Library which in the end should be an app plugin we want to create an extension point in the QueryEditorRow to support the need to act upon queries (import/export query to/from Query Library).

Image

This seems like a natural place to put it as it is a wrapper for queries in Dasboards, Alerting and Explore which are the main usecases for Query Library.

The extension point will need context of the current query, possibly with template variables and data source info.

There is already a separate way to add actions there https://github.com/grafana/grafana/blob/40157111336615a85440f990dd584c93c42600b6/public/app/features/explore/ExplorePage.tsx#L78 which was needed as Query Library is currently a part of core Explore but that can be later replaces with the extension point API.

UI considerations

We already have a predefined set of actions here represented by the icons. Question is if want the extensions to be visibly different or not. Also as extension count will be dynamic we have to have either a menu with multiple options right away or have a responsive UI for case there are more actions than is possible to render.

Another consideration is that we may want to specially promote some of the actions based on business needs to capture attention to specific new/interesting extensions (which we do with Query Library in it's current UI interation). Not sure if that should be somehow addressed here or be a separate concern to extend the app extension API in some way to allow highlighting of some extensions for a period of time.

torkelo commented 1 week ago

this this requires some ux changes to query row, turning the actions into a menu. A save icon there could be very misleading from a dashboard panel edit perspective. think duplicate & delete icons are ok, but rest should be in a panel menu. This is something we have talked about for years (as it opens up other query actions / options) .

aocenas commented 1 week ago

@torkelo the icons there are "native" for explore, with exception of the save icon which is already from query library (just not implemented as an app extension). So the UI should be clear about there being a 2 sets of action, one section the "native" ones (which can be different depending on the context ie explore/dashboard) and section for app extension actions.