@grafana/scenes 6.5.0--canary.1062.13949528214.0 → 6.5.0--canary.1062.13950464645.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/dist/esm/components/VizPanel/VizPanelExploreButton.js +6 -4
- package/dist/esm/components/VizPanel/VizPanelExploreButton.js.map +1 -1
- package/dist/esm/utils/explore.js +5 -1
- package/dist/esm/utils/explore.js.map +1 -1
- package/dist/index.js +11 -5
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,27 @@
|
|
|
1
|
+
# v6.4.1 (Wed Mar 19 2025)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- AdhocVariable: Inject scopes in baseFilters [#1073](https://github.com/grafana/scenes/pull/1073) ([@mdvictor](https://github.com/mdvictor))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- Victor Marin ([@mdvictor](https://github.com/mdvictor))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
# v6.4.0 (Wed Mar 19 2025)
|
|
14
|
+
|
|
15
|
+
#### 🚀 Enhancement
|
|
16
|
+
|
|
17
|
+
- fix: explore button to preserve datasource selection in mixed datasource panels [#1074](https://github.com/grafana/scenes/pull/1074) ([@joannaWebDev](https://github.com/joannaWebDev))
|
|
18
|
+
|
|
19
|
+
#### Authors: 1
|
|
20
|
+
|
|
21
|
+
- Joanna ([@joannaWebDev](https://github.com/joannaWebDev))
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
1
25
|
# v6.3.1 (Tue Mar 11 2025)
|
|
2
26
|
|
|
3
27
|
#### 🐛 Bug Fix
|
|
@@ -16,10 +16,12 @@ function VizPanelExploreButtonComponent({ model }) {
|
|
|
16
16
|
const { options } = model.useState();
|
|
17
17
|
const { data } = sceneGraph.getData(model).useState();
|
|
18
18
|
const { from, to } = sceneGraph.getTimeRange(model).useState();
|
|
19
|
-
const { value: exploreLink } = useAsync(
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
19
|
+
const { value: exploreLink } = useAsync(async () => {
|
|
20
|
+
if (!data) {
|
|
21
|
+
return "";
|
|
22
|
+
}
|
|
23
|
+
return getExploreURL(data, model, { from, to }, options.transform);
|
|
24
|
+
}, [data, model, from, to]);
|
|
23
25
|
const returnToPrevious = useReturnToPrevious();
|
|
24
26
|
if (exploreLink) {
|
|
25
27
|
return /* @__PURE__ */ React.createElement(LinkButton, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VizPanelExploreButton.js","sources":["../../../../src/components/VizPanel/VizPanelExploreButton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { LinkButton } from '@grafana/ui';\nimport { DataQuery } from '@grafana/schema';\nimport { useAsync } from 'react-use';\nimport { SceneComponentProps, SceneObjectState } from '../../core/types';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { getExploreURL } from '../../utils/explore';\nimport { useReturnToPrevious } from '@grafana/runtime';\n\nexport interface ExploreButtonOptions {\n // Callback to hook in tracking / analytics\n onClick?: () => void;\n\n // Callback to modify interpolated query before passing it to explore\n transform?: (query: DataQuery) => DataQuery;\n\n // Title and href for the return to previous button\n returnToPrevious?: {\n title: string;\n href?: string;\n };\n}\n\ninterface ExploreButtonState extends SceneObjectState {\n options: ExploreButtonOptions;\n}\n\nexport class VizPanelExploreButton extends SceneObjectBase<ExploreButtonState> {\n static Component = VizPanelExploreButtonComponent;\n\n public constructor(options: ExploreButtonOptions = {}) {\n super({ options });\n }\n}\n\nfunction VizPanelExploreButtonComponent({ model }: SceneComponentProps<VizPanelExploreButton>) {\n const { options } = model.useState();\n\n const { data } = sceneGraph.getData(model).useState();\n\n const { from, to } = sceneGraph.getTimeRange(model).useState();\n\n const { value: exploreLink } = useAsync(
|
|
1
|
+
{"version":3,"file":"VizPanelExploreButton.js","sources":["../../../../src/components/VizPanel/VizPanelExploreButton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { LinkButton } from '@grafana/ui';\nimport { DataQuery } from '@grafana/schema';\nimport { useAsync } from 'react-use';\nimport { SceneComponentProps, SceneObjectState } from '../../core/types';\nimport { SceneObjectBase } from '../../core/SceneObjectBase';\nimport { sceneGraph } from '../../core/sceneGraph';\nimport { getExploreURL } from '../../utils/explore';\nimport { useReturnToPrevious } from '@grafana/runtime';\n\nexport interface ExploreButtonOptions {\n // Callback to hook in tracking / analytics\n onClick?: () => void;\n\n // Callback to modify interpolated query before passing it to explore\n transform?: (query: DataQuery) => DataQuery;\n\n // Title and href for the return to previous button\n returnToPrevious?: {\n title: string;\n href?: string;\n };\n}\n\ninterface ExploreButtonState extends SceneObjectState {\n options: ExploreButtonOptions;\n}\n\nexport class VizPanelExploreButton extends SceneObjectBase<ExploreButtonState> {\n static Component = VizPanelExploreButtonComponent;\n\n public constructor(options: ExploreButtonOptions = {}) {\n super({ options });\n }\n}\n\nfunction VizPanelExploreButtonComponent({ model }: SceneComponentProps<VizPanelExploreButton>) {\n const { options } = model.useState();\n\n const { data } = sceneGraph.getData(model).useState();\n\n const { from, to } = sceneGraph.getTimeRange(model).useState();\n\n const { value: exploreLink } = useAsync(async () => {\n if (!data) {\n return '';\n }\n\n return getExploreURL(data, model, { from, to }, options.transform);\n }, [data, model, from, to]);\n\n const returnToPrevious = useReturnToPrevious();\n\n if (exploreLink) {\n return (\n <LinkButton\n key=\"explore\"\n icon=\"compass\"\n size=\"sm\"\n variant=\"secondary\"\n href={exploreLink}\n onClick={() => {\n if (options.returnToPrevious) {\n returnToPrevious(options.returnToPrevious.title, options.returnToPrevious.href);\n }\n options.onClick?.();\n }}\n >\n Explore\n </LinkButton>\n );\n }\n return null;\n}\n"],"names":[],"mappings":";;;;;;;;AA6BO,MAAM,8BAA8B,eAAoC,CAAA;AAAA,EAGtE,WAAA,CAAY,OAAgC,GAAA,EAAI,EAAA;AACrD,IAAM,KAAA,CAAA,EAAE,SAAS,CAAA,CAAA;AAAA,GACnB;AACF,CAAA;AANa,qBAAA,CACJ,SAAY,GAAA,8BAAA,CAAA;AAOrB,SAAS,8BAAA,CAA+B,EAAE,KAAA,EAAqD,EAAA;AAC7F,EAAA,MAAM,EAAE,OAAA,EAAY,GAAA,KAAA,CAAM,QAAS,EAAA,CAAA;AAEnC,EAAA,MAAM,EAAE,IAAK,EAAA,GAAI,WAAW,OAAQ,CAAA,KAAK,EAAE,QAAS,EAAA,CAAA;AAEpD,EAAM,MAAA,EAAE,MAAM,EAAG,EAAA,GAAI,WAAW,YAAa,CAAA,KAAK,EAAE,QAAS,EAAA,CAAA;AAE7D,EAAA,MAAM,EAAE,KAAA,EAAO,WAAY,EAAA,GAAI,SAAS,YAAY;AAClD,IAAA,IAAI,CAAC,IAAM,EAAA;AACT,MAAO,OAAA,EAAA,CAAA;AAAA,KACT;AAEA,IAAO,OAAA,aAAA,CAAc,MAAM,KAAO,EAAA,EAAE,MAAM,EAAG,EAAA,EAAG,QAAQ,SAAS,CAAA,CAAA;AAAA,KAChE,CAAC,IAAA,EAAM,KAAO,EAAA,IAAA,EAAM,EAAE,CAAC,CAAA,CAAA;AAE1B,EAAA,MAAM,mBAAmB,mBAAoB,EAAA,CAAA;AAE7C,EAAA,IAAI,WAAa,EAAA;AACf,IAAA,uBACG,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,MACC,GAAI,EAAA,SAAA;AAAA,MACJ,IAAK,EAAA,SAAA;AAAA,MACL,IAAK,EAAA,IAAA;AAAA,MACL,OAAQ,EAAA,WAAA;AAAA,MACR,IAAM,EAAA,WAAA;AAAA,MACN,SAAS,MAAM;AA9DvB,QAAA,IAAA,EAAA,CAAA;AA+DU,QAAA,IAAI,QAAQ,gBAAkB,EAAA;AAC5B,UAAA,gBAAA,CAAiB,OAAQ,CAAA,gBAAA,CAAiB,KAAO,EAAA,OAAA,CAAQ,iBAAiB,IAAI,CAAA,CAAA;AAAA,SAChF;AACA,QAAA,CAAA,EAAA,GAAA,OAAA,CAAQ,OAAR,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,OAAA,CAAA,CAAA;AAAA,OACF;AAAA,KAAA,EACD,SAED,CAAA,CAAA;AAAA,GAEJ;AACA,EAAO,OAAA,IAAA,CAAA;AACT;;;;"}
|
|
@@ -23,7 +23,11 @@ async function getExploreURL(data, model, timeRange, transform) {
|
|
|
23
23
|
return (_a2 = transform == null ? void 0 : transform(q)) != null ? _a2 : q;
|
|
24
24
|
});
|
|
25
25
|
const queries = interpolatedQueries != null ? interpolatedQueries : [];
|
|
26
|
-
const
|
|
26
|
+
const hasMixedDatasources = new Set(queries.map((q) => {
|
|
27
|
+
var _a2;
|
|
28
|
+
return (_a2 = q.datasource) == null ? void 0 : _a2.uid;
|
|
29
|
+
})).size > 1;
|
|
30
|
+
let datasource = hasMixedDatasources ? "-- Mixed --" : (_d = (_c = queries.find((query) => {
|
|
27
31
|
var _a2;
|
|
28
32
|
return !!((_a2 = query.datasource) == null ? void 0 : _a2.uid);
|
|
29
33
|
})) == null ? void 0 : _c.datasource) == null ? void 0 : _d.uid;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"explore.js","sources":["../../../src/utils/explore.ts"],"sourcesContent":["import { PanelData, RawTimeRange, ScopedVars } from '@grafana/data';\nimport { SceneObject } from '../core/types';\nimport { wrapInSafeSerializableSceneObject } from './wrapInSafeSerializableSceneObject';\nimport { getDataSourceSrv } from '@grafana/runtime';\nimport { DataQuery } from '@grafana/schema';\n\n/**\n * Returns URL to Grafana explore for the queries in the given panel data and time range.\n */\nexport async function getExploreURL(\n data: PanelData,\n model: SceneObject,\n timeRange: RawTimeRange,\n transform?: (query: DataQuery) => DataQuery\n): Promise<string> {\n const targets = data.request?.targets;\n if (!targets) {\n return '';\n }\n\n const { from, to } = timeRange;\n
|
|
1
|
+
{"version":3,"file":"explore.js","sources":["../../../src/utils/explore.ts"],"sourcesContent":["import { PanelData, RawTimeRange, ScopedVars } from '@grafana/data';\nimport { SceneObject } from '../core/types';\nimport { wrapInSafeSerializableSceneObject } from './wrapInSafeSerializableSceneObject';\nimport { getDataSourceSrv } from '@grafana/runtime';\nimport { DataQuery } from '@grafana/schema';\n\n/**\n * Returns URL to Grafana explore for the queries in the given panel data and time range.\n */\nexport async function getExploreURL(\n data: PanelData,\n model: SceneObject,\n timeRange: RawTimeRange,\n transform?: (query: DataQuery) => DataQuery\n): Promise<string> {\n const targets = data.request?.targets;\n if (!targets) {\n return '';\n }\n\n const { from, to } = timeRange;\n const filters = data.request?.filters;\n\n const scopedVars: ScopedVars = {\n __sceneObject: wrapInSafeSerializableSceneObject(model),\n };\n\n const interpolatedQueries = (\n await Promise.allSettled(\n targets.map(async (q) => {\n const queryDs = await getDataSourceSrv().get(q.datasource);\n return queryDs.interpolateVariablesInQueries?.([q], scopedVars ?? {}, filters)[0] || q;\n })\n )\n )\n .filter((promise): promise is PromiseFulfilledResult<DataQuery> => promise.status === 'fulfilled')\n .map((q) => q.value)\n .map((q) => transform?.(q) ?? q);\n\n const queries: DataQuery[] = interpolatedQueries ?? [];\n\n // Check if we have mixed datasources (more than one unique datasource)\n const hasMixedDatasources = new Set(queries.map((q) => q.datasource?.uid)).size > 1;\n\n // For mixed datasources, mark the datasource as \"-- Mixed --\"\n let datasource = hasMixedDatasources\n ? '-- Mixed --'\n : queries.find((query) => !!query.datasource?.uid)?.datasource?.uid;\n\n if (queries?.length && datasource && from && to) {\n const left = encodeURIComponent(\n JSON.stringify({\n datasource,\n queries,\n range: {\n from,\n to,\n },\n })\n );\n\n return `/explore?left=${left}`;\n }\n return '';\n}\n"],"names":["_a"],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -10990,7 +10990,11 @@ async function getExploreURL(data, model, timeRange, transform) {
|
|
|
10990
10990
|
return (_a2 = transform == null ? void 0 : transform(q)) != null ? _a2 : q;
|
|
10991
10991
|
});
|
|
10992
10992
|
const queries = interpolatedQueries != null ? interpolatedQueries : [];
|
|
10993
|
-
const
|
|
10993
|
+
const hasMixedDatasources = new Set(queries.map((q) => {
|
|
10994
|
+
var _a2;
|
|
10995
|
+
return (_a2 = q.datasource) == null ? void 0 : _a2.uid;
|
|
10996
|
+
})).size > 1;
|
|
10997
|
+
let datasource = hasMixedDatasources ? "-- Mixed --" : (_d = (_c = queries.find((query) => {
|
|
10994
10998
|
var _a2;
|
|
10995
10999
|
return !!((_a2 = query.datasource) == null ? void 0 : _a2.uid);
|
|
10996
11000
|
})) == null ? void 0 : _c.datasource) == null ? void 0 : _d.uid;
|
|
@@ -11020,10 +11024,12 @@ function VizPanelExploreButtonComponent({ model }) {
|
|
|
11020
11024
|
const { options } = model.useState();
|
|
11021
11025
|
const { data } = sceneGraph.getData(model).useState();
|
|
11022
11026
|
const { from, to } = sceneGraph.getTimeRange(model).useState();
|
|
11023
|
-
const { value: exploreLink } = reactUse.useAsync(
|
|
11024
|
-
|
|
11025
|
-
|
|
11026
|
-
|
|
11027
|
+
const { value: exploreLink } = reactUse.useAsync(async () => {
|
|
11028
|
+
if (!data) {
|
|
11029
|
+
return "";
|
|
11030
|
+
}
|
|
11031
|
+
return getExploreURL(data, model, { from, to }, options.transform);
|
|
11032
|
+
}, [data, model, from, to]);
|
|
11027
11033
|
const returnToPrevious = runtime.useReturnToPrevious();
|
|
11028
11034
|
if (exploreLink) {
|
|
11029
11035
|
return /* @__PURE__ */ React__default["default"].createElement(ui.LinkButton, {
|