From b1d6f816e639d1068f1cfd67a57699e24987f4f1 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Tue, 22 Nov 2022 17:59:35 +0100
Subject: [PATCH 1/4] init history store with pinia

---
 client/src/stores/historyStore.js | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)
 create mode 100644 client/src/stores/historyStore.js

diff --git a/client/src/stores/historyStore.js b/client/src/stores/historyStore.js
new file mode 100644
index 00000000000..4668a9bcdec
--- /dev/null
+++ b/client/src/stores/historyStore.js
@@ -0,0 +1,26 @@
+import { ref } from "vue";
+import { defineStore } from "pinia";
+
+export const useHistoryStore = defineStore(
+    "historyStore",
+    () => {
+        const pinnedHistories = ref([]);
+
+        const pinHistory = (historyId) => {
+            pinnedHistories.value.push({ id: historyId });
+        };
+
+        const unpinHistory = (historyId) => {
+            pinnedHistories.value = pinnedHistories.value.filter((h) => h.id !== historyId);
+        };
+
+        return {
+            pinnedHistories,
+            pinHistory,
+            unpinHistory,
+        };
+    },
+    {
+        persist: ["pinnedHistories"],
+    }
+);

From e06d33e8b7c7c761c0d3db5961fd4ce429a408b2 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Tue, 22 Nov 2022 18:01:36 +0100
Subject: [PATCH 2/4] use `pinia-plugin-persistedstate` to persist pinia state

---
 client/package.json                | 1 +
 client/src/entry/analysis/index.js | 2 ++
 client/yarn.lock                   | 5 +++++
 3 files changed, 8 insertions(+)

diff --git a/client/package.json b/client/package.json
index a4a02d84195..b647fe3d6d3 100644
--- a/client/package.json
+++ b/client/package.json
@@ -67,6 +67,7 @@
     "markdown-it-regexp": "^0.4.0",
     "object-hash": "^3.0.0",
     "pinia": "^2.0.23",
+    "pinia-plugin-persistedstate": "^2.4.0",
     "popper.js": "^1.16.1",
     "pretty-bytes": "^6.0.0",
     "pyre-to-regexp": "^0.0.5",
diff --git a/client/src/entry/analysis/index.js b/client/src/entry/analysis/index.js
index 175a61e15a8..e33eada15d3 100644
--- a/client/src/entry/analysis/index.js
+++ b/client/src/entry/analysis/index.js
@@ -5,9 +5,11 @@ import App from "./App.vue";
 import store from "store";
 import { getRouter } from "./router";
 import { createPinia, PiniaVuePlugin } from "pinia";
+import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
 
 Vue.use(PiniaVuePlugin);
 const pinia = createPinia();
+pinia.use(piniaPluginPersistedstate);
 
 addInitialization((Galaxy) => {
     console.log("App setup");
diff --git a/client/yarn.lock b/client/yarn.lock
index 254ae707135..004bac3ae7f 100644
--- a/client/yarn.lock
+++ b/client/yarn.lock
@@ -8078,6 +8078,11 @@ pikaday@1.5.1:
   optionalDependencies:
     moment "2.x"
 
+pinia-plugin-persistedstate@^2.4.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-2.4.0.tgz#fda569b3c397517a0cf8aba83a628283767da620"
+  integrity sha512-bQcpv47jk3ISl+InuJWsFaS/K7pRZ97kfoD2WCf/suhnlLy48k3BnFM2tI6YZ1xMsDaPv4yOsaPuPAUuSmEO2Q==
+
 pinia@^2.0.23:
   version "2.0.23"
   resolved "https://registry.yarnpkg.com/pinia/-/pinia-2.0.23.tgz#570f5f82160b656b412602789683faa95502d227"

From a7c6661ae2d61e3fd8437ceda91d1e68181bf27a Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Tue, 22 Nov 2022 18:03:11 +0100
Subject: [PATCH 3/4] use pinia history store in multiple view and delete old
 related store methods

---
 .../History/Multiple/MultipleViewList.vue        |  9 +++++----
 client/src/store/historyStore/historyStore.js    | 16 ----------------
 client/src/store/index.js                        |  3 +--
 3 files changed, 6 insertions(+), 22 deletions(-)

diff --git a/client/src/components/History/Multiple/MultipleViewList.vue b/client/src/components/History/Multiple/MultipleViewList.vue
index fb138be6ac3..0876a977761 100644
--- a/client/src/components/History/Multiple/MultipleViewList.vue
+++ b/client/src/components/History/Multiple/MultipleViewList.vue
@@ -31,9 +31,10 @@
 </template>
 
 <script>
-import { mapActions, mapGetters } from "vuex";
+import { mapActions, mapState } from "pinia";
 import VirtualList from "vue-virtual-scroll-list";
 import MultipleViewItem from "./MultipleViewItem";
+import { useHistoryStore } from "stores/historyStore";
 import SelectorModal from "components/History/Modals/SelectorModal";
 
 export default {
@@ -65,9 +66,9 @@ export default {
         };
     },
     computed: {
-        ...mapGetters("history", ["getPinnedHistories"]),
+        ...mapState(useHistoryStore, ["pinnedHistories"]),
         selectedHistories() {
-            return this.getPinnedHistories();
+            return this.pinnedHistories;
         },
     },
     created() {
@@ -77,7 +78,7 @@ export default {
         }
     },
     methods: {
-        ...mapActions("history", ["pinHistory", "unpinHistory"]),
+        ...mapActions(useHistoryStore, ["pinHistory", "unpinHistory"]),
         addHistoriesToList(histories) {
             histories.forEach((history) => {
                 const historyExists = this.selectedHistories.find((h) => h.id == history.id);
diff --git a/client/src/store/historyStore/historyStore.js b/client/src/store/historyStore/historyStore.js
index b78885deeb0..390b8683299 100644
--- a/client/src/store/historyStore/historyStore.js
+++ b/client/src/store/historyStore/historyStore.js
@@ -19,7 +19,6 @@ const state = {
     // histories for current user
     histories: {},
     historiesLoading: false,
-    pinnedHistories: [],
 };
 
 const mutations = {
@@ -55,12 +54,6 @@ const mutations = {
     setHistoriesLoading(state, isLoading) {
         state.historiesLoading = isLoading;
     },
-    pinHistory: (state, historyId) => {
-        state.pinnedHistories.push({ id: historyId });
-    },
-    unpinHistory: (state, historyId) => {
-        state.pinnedHistories = state.pinnedHistories.filter((h) => h.id !== historyId);
-    },
 };
 
 const getters = {
@@ -96,9 +89,6 @@ const getters = {
     historiesLoading: (state) => {
         return state.historiesLoading;
     },
-    getPinnedHistories: (state) => () => {
-        return state.pinnedHistories;
-    },
 };
 
 // flags to keep track of loading states
@@ -183,12 +173,6 @@ const actions = {
         const saveResult = await updateHistoryFields(id, updateFields);
         commit("setHistory", saveResult);
     },
-    pinHistory: ({ commit }, historyId) => {
-        commit("pinHistory", historyId);
-    },
-    unpinHistory: ({ commit }, historyId) => {
-        commit("unpinHistory", historyId);
-    },
 };
 
 export const historyStore = {
diff --git a/client/src/store/index.js b/client/src/store/index.js
index c65b03a90bd..b42ef7c98a5 100644
--- a/client/src/store/index.js
+++ b/client/src/store/index.js
@@ -42,11 +42,10 @@ const panelsPersistence = new VuexPersistence({
     storage: galaxyStorage,
     asyncStorage: true,
     reducer: (state) => {
-        const { panels, userFlags, history } = state;
+        const { panels, userFlags } = state;
         return {
             panels,
             userFlags,
-            history: { pinnedHistories: history.pinnedHistories },
         };
     },
 });

From a1c9a6fa44c25a4daf5fcdcda449f4c3173c097e Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 23 Nov 2022 13:35:32 +0100
Subject: [PATCH 4/4] fix multiple view test error using pinia

---
 client/src/components/History/Multiple/MultipleView.test.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/client/src/components/History/Multiple/MultipleView.test.js b/client/src/components/History/Multiple/MultipleView.test.js
index 1d68cf1f333..bafaa10556e 100644
--- a/client/src/components/History/Multiple/MultipleView.test.js
+++ b/client/src/components/History/Multiple/MultipleView.test.js
@@ -1,3 +1,4 @@
+import { createPinia } from "pinia";
 import { mount } from "@vue/test-utils";
 import flushPromises from "flush-promises";
 import { getLocalVue } from "jest/helpers";
@@ -10,6 +11,8 @@ const COUNT = 8;
 const USER_ID = "test-user-id";
 const CURRENT_HISTORY_ID = "test-history-id-0";
 
+const pinia = createPinia();
+
 const getFakeHistorySummaries = (num, selectedIndex = 0) => {
     const result = Array.from({ length: num }, (_, index) => ({
         id: `test-history-id-${index}`,
@@ -32,6 +35,7 @@ describe("MultipleView", () => {
     beforeEach(async () => {
         wrapper = mount(MultipleView, {
             store,
+            pinia,
             stubs: {
                 CurrentUser: CurrentUserMock,
                 UserHistories: UserHistoriesMock,