use pinia history store in multiple view and delete old related store methods

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);

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 = {

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 },
         };
     },
 });