-
Notifications
You must be signed in to change notification settings - Fork 11.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Pyroscope: Template variable support #73572
Conversation
9944b38
to
30c7772
Compare
@@ -113,7 +115,7 @@ export class Cascader extends PureComponent<CascaderProps, CascaderState> { | |||
for (const option of searchableOptions) { | |||
const optionPath = option.value || []; | |||
|
|||
if (optionPath.indexOf(initValue) === optionPath.length - 1) { | |||
if (optionPath[optionPath.length - 1] === initValue) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@tskarhed 2 small fixes here. This could have failed to select option if main and child option have the same value. Seems easier to just test the leaf and compare that.
Also the separator had spaces around when used for custom values vs for other values so unified that.
@@ -0,0 +1,77 @@ | |||
import React, { useEffect, useMemo, useState } from 'react'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Most of this was just moved to separate component so it can be reused in variable editor
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice touch to allow variables within the VariableQueryEditor 👍
-
Clicking an item in the cascader updates the value even if it's incomplete. I would expect this for a leaf value such as
process_cpu-samples
but if I'm just clickingmemory
ormutex
for example, I may only be taking a look at the options, rather than wanting to actually change theprofileType
. I would have to navigate back to my previous selection after clicking on anything in the cascader, if my intent was not actually to change the value. Is there a specific reason we update the cascader when any option is clicked? If it's so users can see their selection/breadcrumb I wonder could we update the UI when they click an options but not update the actual state until they have finished their selection down to the leaf? -
Error if I don't select
Profile type
orLabel
. Error seems expected as no values to map but still should be handled gracefully.
public/app/plugins/datasource/grafana-pyroscope-datasource/QueryEditor/QueryEditor.tsx
Outdated
Show resolved
Hide resolved
public/app/plugins/datasource/grafana-pyroscope-datasource/VariableQueryEditor.test.tsx
Show resolved
Hide resolved
public/app/plugins/datasource/grafana-pyroscope-datasource/VariableQueryEditor.tsx
Outdated
Show resolved
Hide resolved
public/app/plugins/datasource/grafana-pyroscope-datasource/VariableQueryEditor.tsx
Show resolved
Hide resolved
Fixed.
Fixed. Seems like other data sources just don't run query if some data is missing so done the same. |
Adds template variable support for pyroscope. This includes
Variables in dashboard settings
![Screenshot 2023-08-23 at 17 29 37](https://private-user-images.githubusercontent.com/1014802/262721022-e5dc47b9-0259-4e3b-b9e1-a46203e3d945.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxODM1NDEsIm5iZiI6MTcyMjE4MzI0MSwicGF0aCI6Ii8xMDE0ODAyLzI2MjcyMTAyMi1lNWRjNDdiOS0wMjU5LTRlM2ItYjllMS1hNDYyMDNlM2Q5NDUucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyOCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjhUMTYxNDAxWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YjkzY2I0MWVlMjgwOWRjNDE1ZDhhZGM1NDNmZDRkZDFiNmM2MmJhYmVmZjI5ODRjMDgyNTVhNGZiYTkxYmVhOSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.eIhc4waQdjA36Gp02Qv8xqijEL-cHyI8t2g1x-BTJW0)
Variable editor
![Screenshot 2023-08-23 at 17 29 49](https://private-user-images.githubusercontent.com/1014802/262721030-f1727149-0267-4ed7-91bb-d251374e0fd4.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxODM1NDEsIm5iZiI6MTcyMjE4MzI0MSwicGF0aCI6Ii8xMDE0ODAyLzI2MjcyMTAzMC1mMTcyNzE0OS0wMjY3LTRlZDctOTFiYi1kMjUxMzc0ZTBmZDQucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyOCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjhUMTYxNDAxWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9ZWVlYTc1Yzk2ZGZmMDU4ZDgyNjQzODM3OWVkYTMxOGM2Y2Y1MjY4ZGNlNjY5MTBjN2ZjYjRiN2YwZmUwZGFlZCZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.y1gkYYsonjardMpwY6CQcVFglNtwIbh40mn3iuaddG4)
Dashbard with variables
![Screenshot 2023-08-23 at 17 30 00](https://private-user-images.githubusercontent.com/1014802/262721033-b4773295-5f8a-4a10-bc2d-0c5e2a30785a.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxODM1NDEsIm5iZiI6MTcyMjE4MzI0MSwicGF0aCI6Ii8xMDE0ODAyLzI2MjcyMTAzMy1iNDc3MzI5NS01ZjhhLTRhMTAtYmMyZC0wYzVlMmEzMDc4NWEucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyOCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjhUMTYxNDAxWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9OTdlMjcxYmZiNGEzODZjYzM2NDE0OTlmMGQ3MTQyMGU1MjJjZmZlY2IyNDcwNmY0MTUxNjA4MjU5YzdlNjg5YSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.5zJKSR7hGCLXEB9MsqouhzxeFMF4Q964UosVA8kfaNo)
Query editor
![Screenshot 2023-08-23 at 17 45 56](https://private-user-images.githubusercontent.com/1014802/262725713-1bfab7a3-9c0d-4694-9edf-127e2547880d.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjIxODM1NDEsIm5iZiI6MTcyMjE4MzI0MSwicGF0aCI6Ii8xMDE0ODAyLzI2MjcyNTcxMy0xYmZhYjdhMy05YzBkLTQ2OTQtOWVkZi0xMjdlMjU0Nzg4MGQucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyOCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjhUMTYxNDAxWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9MzQ5NWNmOTljYWQzNzBiODdkZjFkYzI2YTFhOWYxM2IzYWUwNzUwMDg1MjRiNDg4YzllNTQ2YzdhNWMzMTM4MSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.oWRx7_pWq9c-JUZH_YgbrzUOt309eu76s06xXAVz2h8)
Also one change to make this work was to make the profile selector in pyroscope query editor work with custom values:
testing
Use pyroscope or phlare dev env block and create dashboard creating variables similar to those in screenshots.