fix: remove the event stack from app store and watch for duration and utc changes (#489)

src/views/dashboard/panel/Tool.vue

@@ -174,7 +174,8 @@ limitations under the License. -->
   const selectorStore = useSelectorStore();
   const topologyStore = useTopologyStore();
   const appStore = useAppStoreWithOut();
-  const params = useRoute().params;
+  const route = useRoute();
+  const params = route?.params || {};
   const toolIcons = ref<{ name: string; content: string; id: WidgetType }[]>(AllTools);
   const loading = ref<boolean>(false);
   const showHierarchy = ref<boolean>(false);
@@ -209,7 +210,6 @@ limitations under the License. -->
   });
 
   setCurrentDashboard();
-  appStore.setEventStack([initSelector]);
   initSelector();
 
   function initSelector() {
@@ -672,6 +672,15 @@ limitations under the License. -->
       getServices();
     },
   );
+
+  // Watch for duration and utc changes and reinitialize selectors
+  watch(
+    () => [appStore.utc, appStore.duration],
+    () => {
+      initSelector();
+    },
+    { deep: true },
+  );
 </script>
 <style lang="scss" scoped>
   .dashboard-tool {

src/views/dashboard/related/event/Header.vue

@@ -118,8 +118,8 @@ limitations under the License. -->
     }
   }
 
-  async function getEndpoints(id?: string) {
-    const resp = await eventStore.getEndpoints(id);
+  async function getEndpoints() {
+    const resp = await eventStore.getEndpoints();
     if (!resp) {
       return;
     }
@@ -129,8 +129,8 @@ limitations under the License. -->
     }
     state.endpoint = eventStore.endpoints[0];
   }
-  async function getInstances(id?: string) {
-    const resp = await eventStore.getInstances(id);
+  async function getInstances() {
+    const resp = await eventStore.getInstances();
     if (resp.errors) {
       ElMessage.error(resp.errors);
       return;