@grafana/scenes 5.15.0 → 5.15.1
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 +14 -0
- package/dist/esm/components/SceneApp/SceneAppPageView.js +14 -6
- package/dist/esm/components/SceneApp/SceneAppPageView.js.map +1 -1
- package/dist/esm/components/SceneApp/utils.js +3 -3
- package/dist/esm/components/SceneApp/utils.js.map +1 -1
- package/dist/esm/core/SceneTimeRange.js +2 -7
- package/dist/esm/core/SceneTimeRange.js.map +1 -1
- package/dist/esm/services/UrlSyncManager.js +20 -15
- package/dist/esm/services/UrlSyncManager.js.map +1 -1
- package/dist/esm/services/useUrlSync.js +4 -3
- package/dist/esm/services/useUrlSync.js.map +1 -1
- package/dist/esm/utils/utils.js +6 -1
- package/dist/esm/utils/utils.js.map +1 -1
- package/dist/index.d.ts +6 -4
- package/dist/index.js +44 -33
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
@@ -61,8 +61,8 @@ function useAppQueryParams() {
|
|
61
61
|
const location = reactRouterDom.useLocation();
|
62
62
|
return runtime.locationSearchToObject(location.search || "");
|
63
63
|
}
|
64
|
-
function getUrlWithAppState(path, preserveParams) {
|
65
|
-
const paramsCopy = __spreadValues$O({},
|
64
|
+
function getUrlWithAppState(path, searchObject, preserveParams) {
|
65
|
+
const paramsCopy = __spreadValues$O({}, searchObject);
|
66
66
|
if (preserveParams) {
|
67
67
|
for (const key of Object.keys(paramsCopy)) {
|
68
68
|
if (!preserveParams.includes(key)) {
|
@@ -749,24 +749,19 @@ class SceneTimeRange extends SceneObjectBase {
|
|
749
749
|
this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: ["from", "to", "timezone", "time", "time.window"] });
|
750
750
|
this.onTimeRangeChange = (timeRange) => {
|
751
751
|
const update = {};
|
752
|
-
const updateToEval = {};
|
753
752
|
if (typeof timeRange.raw.from === "string") {
|
754
753
|
update.from = timeRange.raw.from;
|
755
|
-
updateToEval.from = timeRange.raw.from;
|
756
754
|
} else {
|
757
755
|
update.from = timeRange.raw.from.toISOString();
|
758
|
-
updateToEval.from = timeRange.raw.from.toISOString(true);
|
759
756
|
}
|
760
757
|
if (typeof timeRange.raw.to === "string") {
|
761
758
|
update.to = timeRange.raw.to;
|
762
|
-
updateToEval.to = timeRange.raw.to;
|
763
759
|
} else {
|
764
760
|
update.to = timeRange.raw.to.toISOString();
|
765
|
-
updateToEval.to = timeRange.raw.to.toISOString(true);
|
766
761
|
}
|
767
762
|
update.value = evaluateTimeRange(
|
768
|
-
|
769
|
-
|
763
|
+
update.from,
|
764
|
+
update.to,
|
770
765
|
this.getTimeZone(),
|
771
766
|
this.state.fiscalYearStartMonth,
|
772
767
|
this.state.UNSAFE_nowDelay
|
@@ -2188,6 +2183,9 @@ function findActiveGroupByVariablesByUid(dsUid) {
|
|
2188
2183
|
function setBaseClassState(sceneObject, newState) {
|
2189
2184
|
sceneObject.setState(newState);
|
2190
2185
|
}
|
2186
|
+
function useLocationServiceSafe() {
|
2187
|
+
return runtime.useLocationService ? runtime.useLocationService() : runtime.locationService;
|
2188
|
+
}
|
2191
2189
|
|
2192
2190
|
class MultiValueVariable extends SceneObjectBase {
|
2193
2191
|
constructor() {
|
@@ -9391,10 +9389,11 @@ class NewSceneObjectAddedEvent extends data.BusEventWithPayload {
|
|
9391
9389
|
}
|
9392
9390
|
NewSceneObjectAddedEvent.type = "new-scene-object-added";
|
9393
9391
|
class UrlSyncManager {
|
9394
|
-
constructor(_options = {}) {
|
9392
|
+
constructor(_options = {}, locationService = runtime.locationService) {
|
9395
9393
|
this._urlKeyMapper = new UniqueUrlKeyMapper();
|
9396
|
-
this._paramsCache = new UrlParamsCache();
|
9397
9394
|
this._options = _options;
|
9395
|
+
this._locationService = locationService;
|
9396
|
+
this._paramsCache = new UrlParamsCache(locationService);
|
9398
9397
|
}
|
9399
9398
|
initSync(root) {
|
9400
9399
|
var _a;
|
@@ -9416,12 +9415,12 @@ class UrlSyncManager {
|
|
9416
9415
|
})
|
9417
9416
|
);
|
9418
9417
|
this._urlKeyMapper.clear();
|
9419
|
-
this._lastLocation =
|
9418
|
+
this._lastLocation = this._locationService.getLocation();
|
9420
9419
|
this.handleNewObject(this._sceneRoot);
|
9421
9420
|
if (this._options.updateUrlOnInit) {
|
9422
9421
|
const urlState = getUrlState(root);
|
9423
9422
|
if (isUrlStateDifferent(urlState, this._paramsCache.getParams())) {
|
9424
|
-
|
9423
|
+
this._locationService.partial(urlState, true);
|
9425
9424
|
}
|
9426
9425
|
}
|
9427
9426
|
}
|
@@ -9463,7 +9462,7 @@ class UrlSyncManager {
|
|
9463
9462
|
return;
|
9464
9463
|
}
|
9465
9464
|
const newUrlState = changedObject.urlSync.getUrlState();
|
9466
|
-
const searchParams =
|
9465
|
+
const searchParams = this._locationService.getSearch();
|
9467
9466
|
const mappedUpdated = {};
|
9468
9467
|
for (const [key, newUrlValue] of Object.entries(newUrlState)) {
|
9469
9468
|
const uniqueKey = this._urlKeyMapper.getUniqueKey(key, changedObject);
|
@@ -9476,8 +9475,8 @@ class UrlSyncManager {
|
|
9476
9475
|
const shouldCreateHistoryEntry = (_b = (_a = changedObject.urlSync).shouldCreateHistoryStep) == null ? void 0 : _b.call(_a, newUrlState);
|
9477
9476
|
const shouldReplace = shouldCreateHistoryEntry !== true;
|
9478
9477
|
writeSceneLog("UrlSyncManager", "onStateChange updating URL");
|
9479
|
-
|
9480
|
-
this._lastLocation =
|
9478
|
+
this._locationService.partial(mappedUpdated, shouldReplace);
|
9479
|
+
this._lastLocation = this._locationService.getLocation();
|
9481
9480
|
}
|
9482
9481
|
}
|
9483
9482
|
getUrlState(root) {
|
@@ -9485,12 +9484,13 @@ class UrlSyncManager {
|
|
9485
9484
|
}
|
9486
9485
|
}
|
9487
9486
|
class UrlParamsCache {
|
9488
|
-
constructor() {
|
9487
|
+
constructor(locationService) {
|
9488
|
+
this.locationService = locationService;
|
9489
9489
|
__privateAdd(this, _cache, void 0);
|
9490
9490
|
__privateAdd(this, _location, void 0);
|
9491
9491
|
}
|
9492
9492
|
getParams() {
|
9493
|
-
const location =
|
9493
|
+
const location = this.locationService.getLocation();
|
9494
9494
|
if (__privateGet(this, _location) === location) {
|
9495
9495
|
return __privateGet(this, _cache);
|
9496
9496
|
}
|
@@ -9509,33 +9509,37 @@ function isUrlStateDifferent(sceneUrlState, currentParams) {
|
|
9509
9509
|
}
|
9510
9510
|
return false;
|
9511
9511
|
}
|
9512
|
-
function useUrlSyncManager(options) {
|
9512
|
+
function useUrlSyncManager(options, locationService) {
|
9513
9513
|
return React.useMemo(
|
9514
|
-
() => new UrlSyncManager(
|
9515
|
-
|
9516
|
-
|
9517
|
-
|
9518
|
-
|
9514
|
+
() => new UrlSyncManager(
|
9515
|
+
{
|
9516
|
+
updateUrlOnInit: options.updateUrlOnInit,
|
9517
|
+
createBrowserHistorySteps: options.createBrowserHistorySteps
|
9518
|
+
},
|
9519
|
+
locationService
|
9520
|
+
),
|
9521
|
+
[options.updateUrlOnInit, options.createBrowserHistorySteps, locationService]
|
9519
9522
|
);
|
9520
9523
|
}
|
9521
9524
|
|
9522
9525
|
function useUrlSync(sceneRoot, options = {}) {
|
9523
9526
|
const location = reactRouterDom.useLocation();
|
9527
|
+
const locationService = useLocationServiceSafe();
|
9524
9528
|
const [isInitialized, setIsInitialized] = React.useState(false);
|
9525
|
-
const urlSyncManager = useUrlSyncManager(options);
|
9529
|
+
const urlSyncManager = useUrlSyncManager(options, locationService);
|
9526
9530
|
React.useEffect(() => {
|
9527
9531
|
urlSyncManager.initSync(sceneRoot);
|
9528
9532
|
setIsInitialized(true);
|
9529
9533
|
return () => urlSyncManager.cleanUp(sceneRoot);
|
9530
9534
|
}, [sceneRoot, urlSyncManager]);
|
9531
9535
|
React.useEffect(() => {
|
9532
|
-
const latestLocation =
|
9536
|
+
const latestLocation = locationService.getLocation();
|
9533
9537
|
const locationToHandle = latestLocation !== location ? latestLocation : location;
|
9534
9538
|
if (latestLocation !== location) {
|
9535
9539
|
writeSceneLog("useUrlSync", "latestLocation different from location");
|
9536
9540
|
}
|
9537
9541
|
urlSyncManager.handleNewLocation(locationToHandle);
|
9538
|
-
}, [sceneRoot, urlSyncManager, location]);
|
9542
|
+
}, [sceneRoot, urlSyncManager, location, locationService]);
|
9539
9543
|
return isInitialized;
|
9540
9544
|
}
|
9541
9545
|
|
@@ -12104,6 +12108,7 @@ function SceneAppPageView({ page, routeProps }) {
|
|
12104
12108
|
const appContext = React.useContext(SceneAppContext);
|
12105
12109
|
const isInitialized = containerState.initializedScene === scene;
|
12106
12110
|
const { layout } = page.state;
|
12111
|
+
const locationService = useLocationServiceSafe();
|
12107
12112
|
React.useLayoutEffect(() => {
|
12108
12113
|
if (!isInitialized) {
|
12109
12114
|
containerPage.initializeScene(scene);
|
@@ -12120,10 +12125,13 @@ function SceneAppPageView({ page, routeProps }) {
|
|
12120
12125
|
text: containerState.title,
|
12121
12126
|
img: containerState.titleImg,
|
12122
12127
|
icon: containerState.titleIcon,
|
12123
|
-
url: getUrlWithAppState(containerState.url, containerState.preserveUrlKeys),
|
12128
|
+
url: getUrlWithAppState(containerState.url, locationService.getSearchObject(), containerState.preserveUrlKeys),
|
12124
12129
|
hideFromBreadcrumbs: containerState.hideFromBreadcrumbs,
|
12125
12130
|
parentItem: getParentBreadcrumbs(
|
12126
|
-
containerState.getParentPage ? containerState.getParentPage() : containerPage.parent
|
12131
|
+
containerState.getParentPage ? containerState.getParentPage() : containerPage.parent,
|
12132
|
+
params,
|
12133
|
+
locationService.getSearchObject()
|
12134
|
+
)
|
12127
12135
|
};
|
12128
12136
|
if (containerState.tabs) {
|
12129
12137
|
pageNav.children = containerState.tabs.map((tab) => {
|
@@ -12132,7 +12140,7 @@ function SceneAppPageView({ page, routeProps }) {
|
|
12132
12140
|
icon: tab.state.titleIcon,
|
12133
12141
|
tabSuffix: tab.state.tabSuffix,
|
12134
12142
|
active: page === tab,
|
12135
|
-
url: getUrlWithAppState(tab.state.url, tab.state.preserveUrlKeys),
|
12143
|
+
url: getUrlWithAppState(tab.state.url, locationService.getSearchObject(), tab.state.preserveUrlKeys),
|
12136
12144
|
parentItem: pageNav
|
12137
12145
|
};
|
12138
12146
|
});
|
@@ -12166,14 +12174,17 @@ function getParentPageIfTab(page) {
|
|
12166
12174
|
}
|
12167
12175
|
return page;
|
12168
12176
|
}
|
12169
|
-
function getParentBreadcrumbs(parent, params) {
|
12177
|
+
function getParentBreadcrumbs(parent, params, searchObject) {
|
12170
12178
|
if (parent instanceof SceneAppPage) {
|
12171
12179
|
return {
|
12172
12180
|
text: parent.state.title,
|
12173
|
-
url: getUrlWithAppState(parent.state.url, parent.state.preserveUrlKeys),
|
12181
|
+
url: getUrlWithAppState(parent.state.url, searchObject, parent.state.preserveUrlKeys),
|
12174
12182
|
hideFromBreadcrumbs: parent.state.hideFromBreadcrumbs,
|
12175
12183
|
parentItem: getParentBreadcrumbs(
|
12176
|
-
parent.state.getParentPage ? parent.state.getParentPage() : parent.parent
|
12184
|
+
parent.state.getParentPage ? parent.state.getParentPage() : parent.parent,
|
12185
|
+
params,
|
12186
|
+
searchObject
|
12187
|
+
)
|
12177
12188
|
};
|
12178
12189
|
}
|
12179
12190
|
return void 0;
|