fix: multiple timelineAPI calls and contactAPI calls[WTEL-4843]

src/modules/contacts/components/contact-popup.vue

@@ -151,13 +151,15 @@ async function loadItem(id = props.id) {
   draft.value = await ContactsAPI.get({ itemId: id });
 }
 
-watch(() => props.shown, () => {
-  if (props.id) loadItem(props.id);
-  else {
-    draft.value = generateNewDraft();
-    setDefaultManager();
+watch(() => props.shown, (value) => {
+  if(value) {
+    if (props.id) loadItem(props.id);
+    else {
+      draft.value = generateNewDraft();
+      setDefaultManager();
+    }
   }
-}, { immediate: true });
+});
 </script>
 
 <style lang="scss" scoped>

src/modules/contacts/modules/timeline/components/the-timeline.vue

@@ -88,10 +88,6 @@ const {
   restoreFilters,
 } = useTableFilters(timelineNamespace);
 
-onUnmounted(() => {
-  flushSubscribers();
-});
-
 subscribe({
   event: '*',
   callback: initializeList,
@@ -106,6 +102,17 @@ async function loadNext() {
   await store.dispatch(`${timelineNamespace}/LOAD_NEXT`);
   nextLoading.value = false;
 }
+
+onUnmounted(() => {
+  flushSubscribers();
+
+  /* https://webitel.atlassian.net/browse/WTEL-4843 */
+  /* Store must be reset to prevent multiple calls TimelineAPI */
+  /* Caching doesn't work because of this code, a fix later. See the task for more details */
+
+  store.dispatch(`${timelineNamespace}/RESET_STATE`);
+});
+
 </script>
 
 <style lang="scss" scoped>

src/modules/contacts/modules/timeline/store/timeline.js

@@ -49,6 +49,11 @@ const actions = {
     context.commit('SET', { path: 'dataList', value: [...context.state.dataList, ...items] });
     context.commit('SET', { path: 'next', value: next });
   },
+  RESET_STATE: (context) => {
+    context.commit('SET', { path: 'dataList', value: [] });
+    context.commit('SET', { path: 'page', value: 1 });
+    context.commit('SET', { path: 'next', value: false });
+  }
 };
 
 const mutations = {