From c22bfa783801165b6ae867d6cb73766687ed6ff9 Mon Sep 17 00:00:00 2001
From: deacon <marksoccerman1@aol.com>
Date: Mon, 16 Mar 2026 10:38:07 -0400
Subject: [PATCH] fix: preserve tab state with KeepAlive and refresh data on
 reactivation

Wraps router-view with Vue's KeepAlive to preserve component state
(filters, selections, scroll position) when switching tabs. Adds
onActivated hooks to refresh data from stores so changes made in
other tabs are immediately visible. Migrates polling intervals to
onActivated/onDeactivated to stop background polling on inactive tabs.
---
 src/App.vue                     |  4 +++-
 src/views/AbilitiesView.vue     |  6 +++++-
 src/views/AdversariesView.vue   |  8 +++++++-
 src/views/AgentsView.vue        | 13 ++++++++++---
 src/views/ContactsView.vue      |  7 ++++++-
 src/views/ExfilledFilesView.vue |  7 ++++++-
 src/views/FactSourcesView.vue   |  6 +++++-
 src/views/HomeView.vue          | 10 +++++++++-
 src/views/ObfuscatorsView.vue   |  6 +++++-
 src/views/ObjectivesView.vue    |  6 +++++-
 src/views/OperationsView.vue    | 12 ++++++++++--
 src/views/PayloadsView.vue      |  6 +++++-
 src/views/PlannersView.vue      |  6 +++++-
 src/views/SchedulesView.vue     |  8 +++++++-
 src/views/SettingsView.vue      |  6 +++++-
 15 files changed, 93 insertions(+), 18 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 40a2310..6460d85 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -28,7 +28,9 @@ onMounted(() => {
         PageTabs
 
         .p-4#router
-            router-view
+            router-view(v-slot="{ Component }")
+                KeepAlive
+                    component(:is="Component")
 </template>
 
 <style scoped>
diff --git a/src/views/AbilitiesView.vue b/src/views/AbilitiesView.vue
index 8bae5c7..00ce155 100644
--- a/src/views/AbilitiesView.vue
+++ b/src/views/AbilitiesView.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { storeToRefs } from "pinia";
-import { reactive, ref, inject, onMounted, computed } from "vue";
+import { reactive, ref, inject, onMounted, onActivated, computed } from "vue";
 import { useRoute } from "vue-router";
 import { useAbilityStore } from "@/stores/abilityStore";
 import { getAbilityPlatforms } from "@/utils/abilityUtil.js";
@@ -39,6 +39,10 @@ onMounted(async () => {
     filters.plugin = route.query.plugin || "";
 });
 
+onActivated(async () => {
+    await abilityStore.getAbilities($api);
+});
+
 function clearFilters() {
     Object.keys(filters).forEach((k) => filters[k] = "");
 }
diff --git a/src/views/AdversariesView.vue b/src/views/AdversariesView.vue
index 0bfc5ad..a3f1a6f 100644
--- a/src/views/AdversariesView.vue
+++ b/src/views/AdversariesView.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { inject, reactive, ref, onMounted, computed } from "vue";
+import { inject, reactive, ref, onMounted, onActivated, computed } from "vue";
 import { storeToRefs } from "pinia";
 
 import { useAdversaryStore } from "@/stores/adversaryStore";
@@ -31,6 +31,12 @@ onMounted(async () => {
     await objectiveStore.getObjectives($api);
 });
 
+onActivated(async () => {
+    await abilityStore.getAbilities($api);
+    await adversaryStore.getAdversaries($api);
+    await objectiveStore.getObjectives($api);
+});
+
 function selectAdversary(adversary) {
     selectedAdversary.value = adversary; 
     adversaryStore.updateSelectedAdversaryAbilities();
diff --git a/src/views/AgentsView.vue b/src/views/AgentsView.vue
index 85356a5..856a607 100644
--- a/src/views/AgentsView.vue
+++ b/src/views/AgentsView.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { inject, onMounted, onBeforeUnmount, ref } from "vue";
+import { inject, onMounted, onActivated, onDeactivated, ref } from "vue";
 import { storeToRefs } from "pinia";
 
 import { useAgentStore } from '@/stores/agentStore';
@@ -26,9 +26,16 @@ onMounted(async () => {
     }, 3000);
 });
 
-onBeforeUnmount(() => {
+onActivated(async () => {
+    await agentStore.getAgents($api);
+    agentRefreshInterval.value = setInterval(async () => {
+        await agentStore.getAgents($api);
+    }, 3000);
+});
+
+onDeactivated(() => {
     clearInterval(agentRefreshInterval.value);
-})
+});
 
 function removeDeadAgents() {
     agents.value.forEach((agent, index) => {
diff --git a/src/views/ContactsView.vue b/src/views/ContactsView.vue
index b6f1a47..5b310f6 100644
--- a/src/views/ContactsView.vue
+++ b/src/views/ContactsView.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { inject, onMounted } from "vue";
+import { inject, onMounted, onActivated } from "vue";
 import { useCoreStore } from "../stores/coreStore";
 import { storeToRefs } from "pinia";
 
@@ -14,6 +14,11 @@ onMounted(async () => {
   await coreStore.getAvailableContacts($api);
 });
 
+onActivated(async () => {
+  await coreStore.getContacts($api);
+  await coreStore.getAvailableContacts($api);
+});
+
 async function downloadReport(contact) {
   await coreStore.downloadContactReport($api, contact);
 }
diff --git a/src/views/ExfilledFilesView.vue b/src/views/ExfilledFilesView.vue
index 8892ab1..8c0ba4e 100644
--- a/src/views/ExfilledFilesView.vue
+++ b/src/views/ExfilledFilesView.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { reactive, ref, inject, onMounted, watch } from "vue";
+import { reactive, ref, inject, onMounted, onActivated, watch } from "vue";
 import { storeToRefs } from "pinia";
 import { useCoreStore } from "@/stores/coreStore";
 import { useOperationStore } from "@/stores/operationStore";
@@ -29,6 +29,11 @@ onMounted(async () => {
   });
 });
 
+onActivated(async () => {
+  await operationStore.getOperations($api);
+  exfilStore.loadFiles($api, selectedOperationId.value);
+});
+
 function toggleAllFiles() {
   if (selectedFiles.value.length < numFiles.value) {
     Object.keys(files.value).forEach((agentName) => {
diff --git a/src/views/FactSourcesView.vue b/src/views/FactSourcesView.vue
index e3cec3c..3f0ca8e 100644
--- a/src/views/FactSourcesView.vue
+++ b/src/views/FactSourcesView.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, inject, onMounted } from "vue";
+import { ref, inject, onMounted, onActivated } from "vue";
 import { storeToRefs } from "pinia";
 
 import { useSourceStore } from "@/stores/sourceStore.js";
@@ -19,6 +19,10 @@ onMounted(() => {
   sourceStore.getSources($api);
 });
 
+onActivated(() => {
+  sourceStore.getSources($api);
+});
+
 function saveSource() {
   selectedSource.value.name = newSourceName.value;
   sourceStore.saveSource($api, selectedSource);
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 0e1e6e5..7cc7bff 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -6,7 +6,7 @@ import AdversaryChartStatus from "@/components/adversaries/AdversaryChartStatus.
 import CodeEditor from "@/components/core/CodeEditor.vue";
 import { useCoreStore } from "@/stores/coreStore";
 import { storeToRefs } from "pinia";
-import { onMounted, inject } from "vue";
+import { onMounted, onActivated, inject } from "vue";
 
 const coreStore = useCoreStore();
 const $api = inject("$api");
@@ -17,6 +17,14 @@ onMounted(async () => {
     console.error(error);
   }
 });
+
+onActivated(async () => {
+  try {
+    await coreStore.getMainConfig($api);
+  } catch (error) {
+    console.error(error);
+  }
+});
 </script>
 
 <template lang="pug">
diff --git a/src/views/ObfuscatorsView.vue b/src/views/ObfuscatorsView.vue
index fe421c5..333023e 100644
--- a/src/views/ObfuscatorsView.vue
+++ b/src/views/ObfuscatorsView.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { storeToRefs } from "pinia";
-import { inject, onMounted } from "vue";
+import { inject, onMounted, onActivated } from "vue";
 import { useCoreStore } from "../stores/coreStore";
 
 const coreStore = useCoreStore();
@@ -11,6 +11,10 @@ const $api = inject("$api");
 onMounted(async () => {
     await coreStore.getObfuscators($api);
 });
+
+onActivated(async () => {
+    await coreStore.getObfuscators($api);
+});
 </script>
 
 <template lang="pug">
diff --git a/src/views/ObjectivesView.vue b/src/views/ObjectivesView.vue
index db1b947..8b17377 100644
--- a/src/views/ObjectivesView.vue
+++ b/src/views/ObjectivesView.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, inject, onMounted } from "vue";
+import { ref, inject, onMounted, onActivated } from "vue";
 import { storeToRefs } from "pinia";
 
 import { useAdversaryStore } from "@/stores/adversaryStore.js";
@@ -18,6 +18,10 @@ onMounted(async () => {
     await adversaryStore.getObjectives($api);
 });
 
+onActivated(async () => {
+    await adversaryStore.getObjectives($api);
+});
+
 function editNameDesc() {
     newObjectiveName.value = selectedObjective.value.name;
     newObjectiveDescription.value = selectedObjective.value.description;
diff --git a/src/views/OperationsView.vue b/src/views/OperationsView.vue
index c5f7264..7ca4fde 100644
--- a/src/views/OperationsView.vue
+++ b/src/views/OperationsView.vue
@@ -3,7 +3,8 @@ import {
   inject,
   ref,
   onMounted,
-  onBeforeUnmount,
+  onActivated,
+  onDeactivated,
   computed,
   watch,
   reactive,
@@ -179,7 +180,14 @@ onMounted(async () => {
   selectOperation();
 });
 
-onBeforeUnmount(() => {
+onActivated(async () => {
+  await operationStore.getOperations($api);
+  await agentStore.getAgents($api);
+  agentStore.updateAgentGroups();
+  selectOperation();
+});
+
+onDeactivated(() => {
   if (updateInterval) clearInterval(updateInterval);
 });
 
diff --git a/src/views/PayloadsView.vue b/src/views/PayloadsView.vue
index 0ae080c..c60371f 100644
--- a/src/views/PayloadsView.vue
+++ b/src/views/PayloadsView.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { inject, onMounted, computed } from "vue";
+import { inject, onMounted, onActivated, computed } from "vue";
 import { storeToRefs } from "pinia";
 
 import { useCoreDisplayStore } from "@/stores/coreDisplayStore";
@@ -43,6 +43,10 @@ onMounted(async () => {
     await abilityStore.getPayloads($api, true, false, true);
 });
 
+onActivated(async () => {
+    await abilityStore.getPayloads($api, true, false, true);
+});
+
 </script>
 
 <template lang="pug">
diff --git a/src/views/PlannersView.vue b/src/views/PlannersView.vue
index 60f8ddd..77c3e68 100644
--- a/src/views/PlannersView.vue
+++ b/src/views/PlannersView.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { storeToRefs } from "pinia";
-import { inject, onMounted } from "vue";
+import { inject, onMounted, onActivated } from "vue";
 import { useCoreStore } from "../stores/coreStore";
 
 const coreStore = useCoreStore();
@@ -11,6 +11,10 @@ const $api = inject("$api");
 onMounted(async () => {
     await coreStore.getPlanners($api);
 });
+
+onActivated(async () => {
+    await coreStore.getPlanners($api);
+});
 </script>
 
 <template lang="pug">
diff --git a/src/views/SchedulesView.vue b/src/views/SchedulesView.vue
index 4363906..5385672 100644
--- a/src/views/SchedulesView.vue
+++ b/src/views/SchedulesView.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { computed, inject, onMounted } from 'vue';
+import { computed, inject, onMounted, onActivated } from 'vue';
 import { storeToRefs } from "pinia";
 
 import CreateScheduleModal from "@/components/schedules/CreateScheduleModal.vue";
@@ -32,6 +32,12 @@ onMounted(async () => {
   await agentStore.getAgents($api);
   agentStore.updateAgentGroups();
 });
+
+onActivated(async () => {
+  await scheduleStore.getSchedules($api);
+  await agentStore.getAgents($api);
+  agentStore.updateAgentGroups();
+});
 </script>
 
 <template lang="pug">
diff --git a/src/views/SettingsView.vue b/src/views/SettingsView.vue
index c731dfe..262e66a 100644
--- a/src/views/SettingsView.vue
+++ b/src/views/SettingsView.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { storeToRefs } from "pinia";
-import { ref, inject, onMounted, computed, watch } from "vue";
+import { ref, inject, onMounted, onActivated, computed, watch } from "vue";
 import { useCoreStore } from "../stores/coreStore";
 
 const coreStore = useCoreStore();
@@ -20,6 +20,10 @@ onMounted(async () => {
     await coreStore.getMainConfig($api);
 });
 
+onActivated(async () => {
+    await coreStore.getMainConfig($api);
+});
+
 function isSettingChanged(setting) {
     return settings.value[setting] === mainConfig.value[setting];
 }