From 9956561e4c907a39d7199646c05dc4e34555bf58 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 24 Jun 2024 16:17:21 +0200
Subject: [PATCH 1/2] chore: refs #7300 wip: create reset function

---
 src/composables/useArrayData.js |  5 ++++
 src/stores/useArrayDataStore.js | 41 +++++++++++++++++++++------------
 2 files changed, 31 insertions(+), 15 deletions(-)

diff --git a/src/composables/useArrayData.js b/src/composables/useArrayData.js
index f97ade7bf..385cb6045 100644
--- a/src/composables/useArrayData.js
+++ b/src/composables/useArrayData.js
@@ -130,6 +130,10 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         delete store[option];
     }
 
+    function reset(opts = []) {
+        if (arrayDataStore.get(key)) arrayDataStore.reset(key, opts);
+    }
+
     function cancelRequest() {
         if (canceller) {
             canceller.abort();
@@ -245,5 +249,6 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         updateStateParams,
         isLoading,
         deleteOption,
+        reset,
     };
 }
diff --git a/src/stores/useArrayDataStore.js b/src/stores/useArrayDataStore.js
index ebe32f8d0..0fe16d075 100644
--- a/src/stores/useArrayDataStore.js
+++ b/src/stores/useArrayDataStore.js
@@ -3,36 +3,47 @@ import { defineStore } from 'pinia';
 
 export const useArrayDataStore = defineStore('arrayDataStore', () => {
     const state = ref({});
+    const defaultOpts = {
+        filter: {},
+        userFilter: {},
+        userParams: {},
+        url: '',
+        limit: 10,
+        skip: 0,
+        order: '',
+        data: ref(),
+        isLoading: false,
+        userParamsChanged: false,
+        exprBuilder: null,
+        searchUrl: 'params',
+        navigate: null,
+    };
 
     function get(key) {
         return state.value[key];
     }
 
     function set(key) {
-        state.value[key] = {
-            filter: {},
-            userFilter: {},
-            userParams: {},
-            url: '',
-            limit: 10,
-            skip: 0,
-            order: '',
-            data: ref(),
-            isLoading: false,
-            userParamsChanged: false,
-            exprBuilder: null,
-            searchUrl: 'params',
-            navigate: null,
-        };
+        state.value[key] = defaultOpts;
     }
 
     function clear(key) {
         delete state.value[key];
     }
 
+    function reset(key, opts = []) {
+        let obj = state.value[key];
+        if (!opts.length) obj = defaultOpts;
+        else
+            for (const opt in opts) {
+                if (Object.hasOwn(obj, opt)) obj[opt] = defaultOpts[opt];
+            }
+    }
+
     return {
         get,
         set,
         clear,
+        reset,
     };
 });

From c2333c9455b90395ac09d956ec901f0821b27724 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Wed, 3 Jul 2024 17:53:37 +0200
Subject: [PATCH 2/2] chore: refs #7300 reset arrayData

---
 src/components/ui/VnFilterPanel.vue |  8 ++------
 src/components/ui/VnPaginate.vue    |  7 ++++---
 src/components/ui/VnSearchbar.vue   |  3 +--
 src/composables/useArrayData.js     |  9 ++++-----
 src/stores/useArrayDataStore.js     | 23 ++++++++++++++++-------
 5 files changed, 27 insertions(+), 23 deletions(-)

diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue
index 5595d54ba..2ea51ed8b 100644
--- a/src/components/ui/VnFilterPanel.vue
+++ b/src/components/ui/VnFilterPanel.vue
@@ -112,9 +112,7 @@ async function search(evt) {
     isLoading.value = true;
     const filter = { ...userParams.value };
     store.userParamsChanged = true;
-    store.filter.skip = 0;
-    store.skip = 0;
-    store.page = 1;
+    arrayData.reset(['skip', 'filter.skip', 'page']);
     const { params: newParams } = await arrayData.addFilter({ params: userParams.value });
     userParams.value = newParams;
 
@@ -138,9 +136,7 @@ async function reload() {
 async function clearFilters() {
     isLoading.value = true;
     store.userParamsChanged = true;
-    store.filter.skip = 0;
-    store.skip = 0;
-    store.page = 1;
+    arrayData.reset(['skip', 'filter.skip', 'page']);
     // Filtrar los params no removibles
     const removableFilters = Object.keys(userParams.value).filter((param) =>
         $props.unremovableParams.includes(param)
diff --git a/src/components/ui/VnPaginate.vue b/src/components/ui/VnPaginate.vue
index 9a2c06b0c..8e426b471 100644
--- a/src/components/ui/VnPaginate.vue
+++ b/src/components/ui/VnPaginate.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { onMounted, ref, watch } from 'vue';
+import { onBeforeUnmount, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useArrayData } from 'composables/useArrayData';
 
@@ -95,6 +95,8 @@ onMounted(async () => {
     mounted.value = true;
 });
 
+onBeforeUnmount(() => arrayData.reset());
+
 watch(
     () => props.data,
     () => {
@@ -118,8 +120,7 @@ const addFilter = async (filter, params) => {
 
 async function fetch(params) {
     useArrayData(props.dataKey, params);
-    store.filter.skip = 0;
-    store.skip = 0;
+    arrayData.reset(['filter.skip', 'skip']);
     await arrayData.fetch({ append: false });
     if (!store.hasMoreData) {
         isLoading.value = false;
diff --git a/src/components/ui/VnSearchbar.vue b/src/components/ui/VnSearchbar.vue
index eab04f04c..0c7a8a3f6 100644
--- a/src/components/ui/VnSearchbar.vue
+++ b/src/components/ui/VnSearchbar.vue
@@ -103,8 +103,7 @@ async function search() {
     const staticParams = Object.entries(store.userParams).filter(
         ([key, value]) => value && (props.staticParams || []).includes(key)
     );
-    store.skip = 0;
-    store.page = 1;
+    arrayData.reset(['skip', 'page']);
 
     if (props.makeFetch)
         await arrayData.applyFilter({
diff --git a/src/composables/useArrayData.js b/src/composables/useArrayData.js
index b4fa66498..8111bcae4 100644
--- a/src/composables/useArrayData.js
+++ b/src/composables/useArrayData.js
@@ -18,7 +18,8 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
 
     onMounted(() => {
         setOptions();
-        store.skip = 0;
+        arrayDataStore.reset(['skip']);
+
         const query = route.query;
         const searchUrl = store.searchUrl;
         if (query[searchUrl]) {
@@ -153,9 +154,8 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         userParams = sanitizerParams(userParams, store?.exprBuilder);
 
         store.userParams = userParams;
-        store.skip = 0;
-        store.filter.skip = 0;
-        store.page = 1;
+        arrayDataStore.reset(['skip', 'filter.skip', 'page']);
+
         await fetch({ append: false });
         return { filter, params };
     }
@@ -191,7 +191,6 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
         store.page += 1;
 
         await fetch({ append: true });
-        updateStateParams();
     }
 
     async function refresh() {
diff --git a/src/stores/useArrayDataStore.js b/src/stores/useArrayDataStore.js
index 0fe16d075..ea029bc12 100644
--- a/src/stores/useArrayDataStore.js
+++ b/src/stores/useArrayDataStore.js
@@ -11,12 +11,12 @@ export const useArrayDataStore = defineStore('arrayDataStore', () => {
         limit: 10,
         skip: 0,
         order: '',
-        data: ref(),
         isLoading: false,
         userParamsChanged: false,
         exprBuilder: null,
         searchUrl: 'params',
         navigate: null,
+        page: 1,
     };
 
     function get(key) {
@@ -24,7 +24,7 @@ export const useArrayDataStore = defineStore('arrayDataStore', () => {
     }
 
     function set(key) {
-        state.value[key] = defaultOpts;
+        state.value[key] = getDefaultState();
     }
 
     function clear(key) {
@@ -32,12 +32,21 @@ export const useArrayDataStore = defineStore('arrayDataStore', () => {
     }
 
     function reset(key, opts = []) {
-        let obj = state.value[key];
-        if (!opts.length) obj = defaultOpts;
+        if (!opts.length) state.value[key] = getDefaultState();
         else
-            for (const opt in opts) {
-                if (Object.hasOwn(obj, opt)) obj[opt] = defaultOpts[opt];
-            }
+            opts.forEach((opt) => {
+                if (opt.includes('.')) {
+                    const [parent, child] = opt.split('.');
+                    state.value[key][parent][child] = defaultOpts[child];
+                } else if (Object.hasOwn(state.value[key], opt))
+                    state.value[key][opt] = defaultOpts[opt];
+            });
+    }
+
+    function getDefaultState() {
+        return Object.assign(JSON.parse(JSON.stringify(defaultOpts)), {
+            data: ref(),
+        });
     }
 
     return {