@grafana/scenes 2.3.0 → 2.4.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
CHANGED
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
# v2.4.0 (Thu Feb 01 2024)
|
|
2
|
+
|
|
3
|
+
#### 🚀 Enhancement
|
|
4
|
+
|
|
5
|
+
- UrlSync: Fixes overwrite issue where later state change overwrites earlier change [#555](https://github.com/grafana/scenes/pull/555) ([@torkelo](https://github.com/torkelo))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- Torkel Ödegaard ([@torkelo](https://github.com/torkelo))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
1
13
|
# v2.3.0 (Thu Feb 01 2024)
|
|
2
14
|
|
|
3
15
|
#### 🚀 Enhancement
|
|
@@ -9,7 +9,12 @@ class UrlSyncManager {
|
|
|
9
9
|
this._urlKeyMapper = new UniqueUrlKeyMapper();
|
|
10
10
|
this._stateSub = null;
|
|
11
11
|
this._locationSub = null;
|
|
12
|
+
this._ignoreNextLocationUpdate = false;
|
|
12
13
|
this._onLocationUpdate = (location) => {
|
|
14
|
+
if (this._ignoreNextLocationUpdate) {
|
|
15
|
+
this._ignoreNextLocationUpdate = false;
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
13
18
|
if (this._lastPath !== location.pathname) {
|
|
14
19
|
return;
|
|
15
20
|
}
|
|
@@ -33,6 +38,7 @@ class UrlSyncManager {
|
|
|
33
38
|
}
|
|
34
39
|
}
|
|
35
40
|
if (Object.keys(mappedUpdated).length > 0) {
|
|
41
|
+
this._ignoreNextLocationUpdate = true;
|
|
36
42
|
locationService.partial(mappedUpdated, true);
|
|
37
43
|
}
|
|
38
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UrlSyncManager.js","sources":["../../../src/services/UrlSyncManager.ts"],"sourcesContent":["import { Location, UnregisterCallback } from 'history';\n\nimport { locationService } from '@grafana/runtime';\n\nimport { SceneObjectStateChangedEvent } from '../core/events';\nimport { SceneObject, SceneObjectUrlValues } from '../core/types';\nimport { writeSceneLog } from '../utils/writeSceneLog';\nimport { Unsubscribable } from 'rxjs';\nimport { UniqueUrlKeyMapper } from './UniqueUrlKeyMapper';\nimport { getUrlState, isUrlValueEqual, syncStateFromUrl } from './utils';\n\nexport interface UrlSyncManagerLike {\n initSync(root: SceneObject): void;\n cleanUp(root: SceneObject): void;\n getUrlState(root: SceneObject): SceneObjectUrlValues;\n}\n\nexport class UrlSyncManager implements UrlSyncManagerLike {\n private _urlKeyMapper = new UniqueUrlKeyMapper();\n private _sceneRoot!: SceneObject;\n private _stateSub: Unsubscribable | null = null;\n private _locationSub?: UnregisterCallback | null = null;\n private _lastPath?: string;\n\n /**\n * Updates the current scene state to match URL state.\n */\n public initSync(root: SceneObject) {\n if (!this._locationSub) {\n writeSceneLog('UrlSyncManager', 'New location listen');\n this._locationSub = locationService.getHistory().listen(this._onLocationUpdate);\n }\n\n if (this._stateSub) {\n writeSceneLog('UrlSyncManager', 'Unregister previous scene state subscription', this._sceneRoot.state.key);\n this._stateSub.unsubscribe();\n }\n\n this._sceneRoot = root;\n this._lastPath = locationService.getLocation().pathname;\n this._stateSub = root.subscribeToEvent(SceneObjectStateChangedEvent, this._onStateChanged);\n\n this.syncFrom(this._sceneRoot);\n }\n\n public cleanUp(root: SceneObject) {\n // Ignore this if we have a new or different root\n if (this._sceneRoot !== root) {\n return;\n }\n\n writeSceneLog('UrlSyncManager', 'Clean up');\n\n if (this._locationSub) {\n this._locationSub();\n writeSceneLog('UrlSyncManager', 'Unregister history listen');\n this._locationSub = null;\n }\n\n if (this._stateSub) {\n this._stateSub.unsubscribe();\n this._stateSub = null;\n writeSceneLog(\n 'UrlSyncManager',\n 'Root deactived, unsub to state',\n 'same key',\n this._sceneRoot.state.key === root.state.key\n );\n }\n }\n\n public syncFrom(sceneObj: SceneObject) {\n const urlParams = locationService.getSearch();\n // The index is always from the root\n this._urlKeyMapper.rebuildIndex(this._sceneRoot);\n syncStateFromUrl(sceneObj, urlParams, this._urlKeyMapper);\n }\n\n private _onLocationUpdate = (location: Location) => {\n if (this._lastPath !== location.pathname) {\n return;\n }\n\n const urlParams = new URLSearchParams(location.search);\n // Rebuild key mapper index before starting sync\n this._urlKeyMapper.rebuildIndex(this._sceneRoot);\n // Sync scene state tree from url\n syncStateFromUrl(this._sceneRoot, urlParams, this._urlKeyMapper);\n this._lastPath = location.pathname;\n };\n\n private _onStateChanged = ({ payload }: SceneObjectStateChangedEvent) => {\n const changedObject = payload.changedObject;\n\n if (changedObject.urlSync) {\n const newUrlState = changedObject.urlSync.getUrlState();\n\n const searchParams = locationService.getSearch();\n const mappedUpdated: SceneObjectUrlValues = {};\n\n this._urlKeyMapper.rebuildIndex(this._sceneRoot);\n\n for (const [key, newUrlValue] of Object.entries(newUrlState)) {\n const uniqueKey = this._urlKeyMapper.getUniqueKey(key, changedObject);\n const currentUrlValue = searchParams.getAll(uniqueKey);\n\n if (!isUrlValueEqual(currentUrlValue, newUrlValue)) {\n mappedUpdated[uniqueKey] = newUrlValue;\n }\n }\n\n if (Object.keys(mappedUpdated).length > 0) {\n locationService.partial(mappedUpdated, true);\n }\n }\n };\n\n public getUrlState(root: SceneObject): SceneObjectUrlValues {\n return getUrlState(root);\n }\n}\n\nlet urlSyncManager: UrlSyncManagerLike | undefined;\n\nexport function getUrlSyncManager(): UrlSyncManagerLike {\n if (!urlSyncManager) {\n urlSyncManager = new UrlSyncManager();\n }\n\n return urlSyncManager;\n}\n"],"names":[],"mappings":";;;;;;AAiBO,MAAM,cAA6C,CAAA;AAAA,EAAnD,WAAA,GAAA;AACL,IAAQ,IAAA,CAAA,aAAA,GAAgB,IAAI,kBAAmB,EAAA,CAAA;AAE/C,IAAA,IAAA,CAAQ,SAAmC,GAAA,IAAA,CAAA;AAC3C,IAAA,IAAA,CAAQ,YAA2C,GAAA,IAAA,CAAA;
|
|
1
|
+
{"version":3,"file":"UrlSyncManager.js","sources":["../../../src/services/UrlSyncManager.ts"],"sourcesContent":["import { Location, UnregisterCallback } from 'history';\n\nimport { locationService } from '@grafana/runtime';\n\nimport { SceneObjectStateChangedEvent } from '../core/events';\nimport { SceneObject, SceneObjectUrlValues } from '../core/types';\nimport { writeSceneLog } from '../utils/writeSceneLog';\nimport { Unsubscribable } from 'rxjs';\nimport { UniqueUrlKeyMapper } from './UniqueUrlKeyMapper';\nimport { getUrlState, isUrlValueEqual, syncStateFromUrl } from './utils';\n\nexport interface UrlSyncManagerLike {\n initSync(root: SceneObject): void;\n cleanUp(root: SceneObject): void;\n getUrlState(root: SceneObject): SceneObjectUrlValues;\n}\n\nexport class UrlSyncManager implements UrlSyncManagerLike {\n private _urlKeyMapper = new UniqueUrlKeyMapper();\n private _sceneRoot!: SceneObject;\n private _stateSub: Unsubscribable | null = null;\n private _locationSub?: UnregisterCallback | null = null;\n private _lastPath?: string;\n private _ignoreNextLocationUpdate = false;\n\n /**\n * Updates the current scene state to match URL state.\n */\n public initSync(root: SceneObject) {\n if (!this._locationSub) {\n writeSceneLog('UrlSyncManager', 'New location listen');\n this._locationSub = locationService.getHistory().listen(this._onLocationUpdate);\n }\n\n if (this._stateSub) {\n writeSceneLog('UrlSyncManager', 'Unregister previous scene state subscription', this._sceneRoot.state.key);\n this._stateSub.unsubscribe();\n }\n\n this._sceneRoot = root;\n this._lastPath = locationService.getLocation().pathname;\n this._stateSub = root.subscribeToEvent(SceneObjectStateChangedEvent, this._onStateChanged);\n\n this.syncFrom(this._sceneRoot);\n }\n\n public cleanUp(root: SceneObject) {\n // Ignore this if we have a new or different root\n if (this._sceneRoot !== root) {\n return;\n }\n\n writeSceneLog('UrlSyncManager', 'Clean up');\n\n if (this._locationSub) {\n this._locationSub();\n writeSceneLog('UrlSyncManager', 'Unregister history listen');\n this._locationSub = null;\n }\n\n if (this._stateSub) {\n this._stateSub.unsubscribe();\n this._stateSub = null;\n writeSceneLog(\n 'UrlSyncManager',\n 'Root deactived, unsub to state',\n 'same key',\n this._sceneRoot.state.key === root.state.key\n );\n }\n }\n\n public syncFrom(sceneObj: SceneObject) {\n const urlParams = locationService.getSearch();\n // The index is always from the root\n this._urlKeyMapper.rebuildIndex(this._sceneRoot);\n syncStateFromUrl(sceneObj, urlParams, this._urlKeyMapper);\n }\n\n private _onLocationUpdate = (location: Location) => {\n if (this._ignoreNextLocationUpdate) {\n this._ignoreNextLocationUpdate = false;\n return;\n }\n\n if (this._lastPath !== location.pathname) {\n return;\n }\n\n const urlParams = new URLSearchParams(location.search);\n // Rebuild key mapper index before starting sync\n this._urlKeyMapper.rebuildIndex(this._sceneRoot);\n // Sync scene state tree from url\n syncStateFromUrl(this._sceneRoot, urlParams, this._urlKeyMapper);\n this._lastPath = location.pathname;\n };\n\n private _onStateChanged = ({ payload }: SceneObjectStateChangedEvent) => {\n const changedObject = payload.changedObject;\n\n if (changedObject.urlSync) {\n const newUrlState = changedObject.urlSync.getUrlState();\n\n const searchParams = locationService.getSearch();\n const mappedUpdated: SceneObjectUrlValues = {};\n\n this._urlKeyMapper.rebuildIndex(this._sceneRoot);\n\n for (const [key, newUrlValue] of Object.entries(newUrlState)) {\n const uniqueKey = this._urlKeyMapper.getUniqueKey(key, changedObject);\n const currentUrlValue = searchParams.getAll(uniqueKey);\n\n if (!isUrlValueEqual(currentUrlValue, newUrlValue)) {\n mappedUpdated[uniqueKey] = newUrlValue;\n }\n }\n\n if (Object.keys(mappedUpdated).length > 0) {\n this._ignoreNextLocationUpdate = true;\n locationService.partial(mappedUpdated, true);\n }\n }\n };\n\n public getUrlState(root: SceneObject): SceneObjectUrlValues {\n return getUrlState(root);\n }\n}\n\nlet urlSyncManager: UrlSyncManagerLike | undefined;\n\nexport function getUrlSyncManager(): UrlSyncManagerLike {\n if (!urlSyncManager) {\n urlSyncManager = new UrlSyncManager();\n }\n\n return urlSyncManager;\n}\n"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1315,6 +1315,7 @@ declare class UrlSyncManager implements UrlSyncManagerLike {
|
|
|
1315
1315
|
private _stateSub;
|
|
1316
1316
|
private _locationSub?;
|
|
1317
1317
|
private _lastPath?;
|
|
1318
|
+
private _ignoreNextLocationUpdate;
|
|
1318
1319
|
/**
|
|
1319
1320
|
* Updates the current scene state to match URL state.
|
|
1320
1321
|
*/
|
package/dist/index.js
CHANGED
|
@@ -6035,7 +6035,12 @@ class UrlSyncManager {
|
|
|
6035
6035
|
this._urlKeyMapper = new UniqueUrlKeyMapper();
|
|
6036
6036
|
this._stateSub = null;
|
|
6037
6037
|
this._locationSub = null;
|
|
6038
|
+
this._ignoreNextLocationUpdate = false;
|
|
6038
6039
|
this._onLocationUpdate = (location) => {
|
|
6040
|
+
if (this._ignoreNextLocationUpdate) {
|
|
6041
|
+
this._ignoreNextLocationUpdate = false;
|
|
6042
|
+
return;
|
|
6043
|
+
}
|
|
6039
6044
|
if (this._lastPath !== location.pathname) {
|
|
6040
6045
|
return;
|
|
6041
6046
|
}
|
|
@@ -6059,6 +6064,7 @@ class UrlSyncManager {
|
|
|
6059
6064
|
}
|
|
6060
6065
|
}
|
|
6061
6066
|
if (Object.keys(mappedUpdated).length > 0) {
|
|
6067
|
+
this._ignoreNextLocationUpdate = true;
|
|
6062
6068
|
runtime.locationService.partial(mappedUpdated, true);
|
|
6063
6069
|
}
|
|
6064
6070
|
}
|