Merge branch 'monitoring_store' into messages_store

# Conflicts:
#	src/Frontend/src/components/audit/AuditList.vue
#	src/Frontend/src/components/failedmessages/DeletedMessageGroups.vue
#	src/Frontend/src/composables/autoRefresh.ts
#	src/Frontend/src/stores/DeletedMessageGroupsStore.ts

Author: PhilBastian

src/Frontend/src/components/audit/AuditList.vue

@@ -79,11 +79,13 @@ function setQuery() {
 }
 
 watch(autoRefreshValue, (newValue) => {
-  updateInterval(newValue || 0);
   if (newValue === null || newValue === 0) {
     stop();
-  } else if (!isActive.value) {
-    start();
+  } else {
+    updateInterval(newValue);
+    if (!isActive.value) {
+      start();
+    }
   }
 });
 </script>

src/Frontend/src/components/failedmessages/DeletedMessageGroups.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, watch } from "vue";
+import { ref, computed, watch } from "vue";
 import { useRouter } from "vue-router";
 import { useShowToast } from "../../composables/toast";
 import NoData from "../NoData.vue";
@@ -18,8 +18,10 @@ import { useStoreAutoRefresh } from "@/composables/useAutoRefresh";
 import { storeToRefs } from "pinia";
 import LoadingSpinner from "../LoadingSpinner.vue";
 
-let pollingFaster = false;
-const { autoRefresh, isRefreshing, updateInterval } = useStoreAutoRefresh("deletedMessageGroups", useDeletedMessageGroupsStore, 5000);
+const POLLING_INTERVAL_NORMAL = 5000;
+const POLLING_INTERVAL_FAST = 1000;
+
+const { autoRefresh, isRefreshing, updateInterval } = useStoreAutoRefresh("deletedMessageGroups", useDeletedMessageGroupsStore, POLLING_INTERVAL_NORMAL);
 const { store } = autoRefresh();
 const { archiveGroups, classifiers, selectedClassifier } = storeToRefs(store);
 const router = useRouter();
@@ -36,7 +38,6 @@ async function classifierChanged(classifier: string) {
 
 //Restore operation
 function showRestoreGroupDialog(group: ExtendedFailureGroupView) {
-  groupRestoreSuccessful.value = null;
   selectedGroup.value = group;
   showRestoreGroupModal.value = true;
 }
@@ -46,12 +47,10 @@ async function restoreGroup() {
   if (group) {
     const { result, errorMessage } = await store.restoreGroup(group);
     if (!result) {
-      groupRestoreSuccessful.value = false;
       useShowToast(TYPE.ERROR, "Error", `Failed to restore the group: ${errorMessage}`);
     } else {
       // We're starting a restore, poll more frequently
-      pollingFaster = true;
-      updateInterval(1000);
+      updateInterval(POLLING_INTERVAL_FAST);
       groupRestoreSuccessful.value = true;
       useShowToast(TYPE.INFO, "Info", "Group restore started...");
     }
@@ -83,19 +82,17 @@ function navigateToGroup(groupId: string) {
   router.push(routeLinks.failedMessage.deletedGroup.link(groupId));
 }
 
-function isRestoreInProgress() {
+const isRestoreInProgress = computed(() => {
   return archiveGroups.value.some((group) => group.workflow_state.status !== "none" && group.workflow_state.status !== "restorecompleted");
-}
+});
 
-watch(isRefreshing, () => {
-  // If we're currently polling at 5 seconds and there is a restore in progress, then change the polling interval to poll every 1 second
-  if (!pollingFaster && isRestoreInProgress()) {
-    pollingFaster = true;
-    updateInterval(1000);
-  } else if (pollingFaster && !isRestoreInProgress()) {
-    // if we're currently polling every 1 second and all restores are done, change polling frequency back to every 5 seconds
-    pollingFaster = false;
-    updateInterval(5000);
+watch(isRestoreInProgress, (restoreInProgress) => {
+  if (restoreInProgress) {
+    // If there is a restore in progress, poll every 1 second
+    updateInterval(POLLING_INTERVAL_FAST);
+  } else {
+    // If all restores are done, change polling frequency back to every 5 seconds
+    updateInterval(POLLING_INTERVAL_NORMAL);
   }
 });
 </script>
@@ -138,7 +135,7 @@ watch(isRefreshing, () => {
               <div class="row">
                 <div class="col-sm-12 no-mobile-side-padding">
                   <div v-if="archiveGroups.length > 0">
-                    <div :class="`row box box-group wf-${group.workflow_state.status} repeat-modify deleted-message-group`" v-for="(group, index) in archiveGroups" :key="index" :disabled="group.count == 0" @click.prevent="navigateToGroup(group.id)">
+                    <div :class="`row box box-group wf-${group.workflow_state.status} repeat-modify deleted-message-group`" v-for="group in archiveGroups" :key="group.id" :disabled="group.count == 0" @click.prevent="navigateToGroup(group.id)">
                       <div class="col-sm-12 no-mobile-side-padding">
                         <div class="row">
                           <div class="col-sm-12 no-side-padding">
@@ -147,7 +144,7 @@ watch(isRefreshing, () => {
                                 <p class="lead break">{{ group.title }}</p>
                                 <p class="metadata" v-if="!isBeingRestored(group.workflow_state.status)">
                                   <MetadataItem :icon="faEnvelope">
-                                    <span>{{ group.count }} message<span v-if="group.count > 1">s</span></span>
+                                    <span>{{ group.count }} message<template v-if="group.count > 1">s</template></span>
                                     <span v-if="group.operation_remaining_count"> (currently restoring {{ group.operation_remaining_count }} </span>
                                   </MetadataItem>
 

src/Frontend/src/composables/autoRefresh.ts

@@ -63,8 +63,10 @@ export default function useFetchWithAutoRefresh(name: string, fetch: () => Promi
 
     interval.value = newIntervalMs;
     console.debug(`[AutoRefresh] updated polling ${name} to ${newIntervalMs}ms`);
-    pause();
-    if (newIntervalMs > 0) {
+
+    if (isActive.value) {
+      // We need to do this hack, because useTimeoutPoll doesn't react to interval changes while active
+      pause();
       resume();
     }
   };

src/Frontend/src/stores/DeletedMessageGroupsStore.ts

@@ -32,7 +32,7 @@ export const useDeletedMessageGroupsStore = defineStore("DeletedMessageGroupsSto
   let undismissedRestoreGroups: ExtendedFailureGroupView[] = [];
 
   const serviceControlStore = useServiceControlStore();
-  const messageGroupClient = new MessageGroupClient(serviceControlStore);
+  const messageGroupClient = new MessageGroupClient();
 
   const cookies = useCookies();
 
@@ -113,7 +113,7 @@ export const useDeletedMessageGroupsStore = defineStore("DeletedMessageGroupsSto
 
     const result = await messageGroupClient.restoreGroup(group.id);
     if (messageGroupClient.isError(result)) {
-      return { result: true, errorMessage: result.message };
+      return { result: false, errorMessage: result.message };
     }
     return { result: true };
   }