Skip to content

[FEATURE] Link the query viewer to the explorer - #250

Open
gangadhar-res wants to merge 1 commit into
perses:mainfrom
gangadhar-res:feat/query-viewer-explore-link
Open

[FEATURE] Link the query viewer to the explorer#250
gangadhar-res wants to merge 1 commit into
perses:mainfrom
gangadhar-res:feat/query-viewer-explore-link

Conversation

@gangadhar-res

Copy link
Copy Markdown

Description

Closes perses/perses#4333.

Adds a "Go to Explorer" button to the query viewer, next to Close. The viewer stays read
only. Clicking the button opens the panel's queries in the explorer, and the queries ride
along in the link, so nothing gets saved and the dashboard isn't touched.

Picking the explorer: every explorer plugin already reads its starting queries from
data.queries, and a query plugin ships in the same module as the explorer that can open
it. So the module behind the first query is what selects the explorer. That needs no new
plugin API. If that module doesn't ship an explorer, the button doesn't render.

One move was needed to get there. useExplorerQueryParams lived in explore, but
explore depends on dashboards, which is where the query viewer is, so importing it
would've been a cycle. It's now in plugin-system and re-exported from its old path, so
nothing changes for anyone using it. It builds the query string with URLSearchParams
now instead of qs, to avoid adding a dependency to plugin-system. That leaves qs
unused in explore and I've left its package.json alone, happy to drop it if you want.

Screenshots

TODO

Testing

Four tests on the button: the link it builds, and the three cases where it stays hidden
(module has no explorer, no queries, explorer belongs to a different module). I checked
each one fails when the matching logic is broken.

lint, type-check, format:check, test, build and make checklicense all pass.
No new lint warnings.

The viewer stays read only. A "Go to Explorer" button opens the panel's queries
in the explorer that owns them, built at click time so nothing is saved.

Explorers read their starting queries from data.queries, and a query plugin
ships in the same module as the explorer that opens it, so the first query's
module picks the explorer. The button hides when that module has none.

useExplorerQueryParams moved to plugin-system because explore depends on
dashboards, where the viewer lives. It is re-exported from its old path.

Signed-off-by: Gangadhar Chalapaka <gangadhar@resolve.ai>
Comment thread dashboards/src/components/QueryViewerDialog/GoToExplorerButton.tsx
@gangadhar-res

Copy link
Copy Markdown
Author

@jgbernalp good news, that case already works. The button renders through react-router's Link via RouterComponent rather than building the URL itself, so the router's basename gets prepended. Perses sets that from api_prefix in Router.tsx. I ran it with basename="/perses" to be sure and the link came out as /perses/explore?explorer=... If you'd rather it didn't rely on that, I can take the route as a prop instead.

@jgbernalp

Copy link
Copy Markdown
Contributor

@gangadhar-res can you add some screenshots

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Adding a Query Play Ground to the Query Viewer

2 participants