This is an automated email from the ASF dual-hosted git repository.
wu-sheng pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/skywalking-horizon-ui.git
The following commit(s) were added to refs/heads/main by this push:
new 9a83b91 ui dashboards: instance auto-pick must be {immediate: true}
9a83b91 is described below
commit 9a83b9185626d2267d7998ae8773021255dfb803
Author: Wu Sheng <[email protected]>
AuthorDate: Sun May 17 17:29:24 2026 +0800
ui dashboards: instance auto-pick must be {immediate: true}
The shell-level init gate (c612e0e) delays LayerDashboardsView's
mount until layers + bundle have settled, which is often long
enough for vue-query to already have the instance list cached
from a prior visit. The auto-pick watch fired on transition only
(no `immediate`), so a cache-hit produced no [] → [...] edge and
the watch silently skipped the pick — operator landed on
/<layer>/instance?service=… with no ?instance= and widgets stayed
blank.
Fix: add `{ immediate: true }`. The body of the watch already
no-ops when the URL already carries a valid instance, so this is
just "run once on mount in addition to subsequent transitions".
---
apps/ui/src/render/layer-dashboard/LayerDashboardsView.vue | 9 +++++++--
1 file changed, 7 insertions(+), 2 deletions(-)
diff --git a/apps/ui/src/render/layer-dashboard/LayerDashboardsView.vue
b/apps/ui/src/render/layer-dashboard/LayerDashboardsView.vue
index 122c8f2..4ef9eca 100644
--- a/apps/ui/src/render/layer-dashboard/LayerDashboardsView.vue
+++ b/apps/ui/src/render/layer-dashboard/LayerDashboardsView.vue
@@ -154,7 +154,12 @@ watch(serviceName, (next, prev) => {
});
// Default-select the first instance once the list arrives, but only
// on the Instance scope (so other scopes don't bake an instance into
-// their URL on every visit).
+// their URL on every visit). `immediate: true` so a cache-hit on
+// mount (vue-query had this serviceId's instance list already, e.g.
+// because the shell init gate stretched the mount past the query's
+// first response) still fires the auto-pick — without it, the watch
+// would only catch the transition from [] to [...] and silently skip
+// the pick when the list arrived synchronously.
watch([instanceList, scope], ([list, s]) => {
if (s !== 'instance') return;
if (list.length === 0) {
@@ -164,7 +169,7 @@ watch([instanceList, scope], ([list, s]) => {
if (!selectedInstance.value || !list.some((i) => i.name ===
selectedInstance.value)) {
setSelectedInstance(list[0].name);
}
-});
+}, { immediate: true });
// Endpoint selection — same pattern as instance, with a keyword
// search box driving findEndpoint(...). Endpoints are unbounded so
