From 3a696b971fa67062a07d6a248fec7ba361516408 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Mon, 14 Feb 2022 11:17:33 +0100
Subject: [PATCH] fix(ui) - saved search on save and update

---
 .../shared/SessionSearch/SessionSearch.tsx    |  4 +--
 frontend/app/duck/search.js                   | 31 +++++++++++++------
 2 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/frontend/app/components/shared/SessionSearch/SessionSearch.tsx b/frontend/app/components/shared/SessionSearch/SessionSearch.tsx
index 46bdd845e..a3f799ed7 100644
--- a/frontend/app/components/shared/SessionSearch/SessionSearch.tsx
+++ b/frontend/app/components/shared/SessionSearch/SessionSearch.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import { List } from 'immutable';
 import FilterList from 'Shared/Filters/FilterList';
 import FilterSelection from 'Shared/Filters/FilterSelection';
 import SaveFilterButton from 'Shared/SaveFilterButton';
@@ -13,7 +12,7 @@ interface Props {
   edit: typeof edit;
   addFilter: typeof addFilter;
 }
-function SessionSearch(props) {
+function SessionSearch(props: Props) {
   const { appliedFilter } = props;
   const hasEvents = appliedFilter.filters.filter(i => i.isEvent).size > 0;
   const hasFilters = appliedFilter.filters.filter(i => !i.isEvent).size > 0;
@@ -82,7 +81,6 @@ function SessionSearch(props) {
         <div className="ml-auto flex items-center">
           <SaveFilterButton />
           <SaveFunnelButton />
-          {/* <IconButton primaryText label="SAVE FUNNEL" icon="filter" /> */}
         </div>
       </div>
     </div>
diff --git a/frontend/app/duck/search.js b/frontend/app/duck/search.js
index 4bce0e618..8b4ab8e12 100644
--- a/frontend/app/duck/search.js
+++ b/frontend/app/duck/search.js
@@ -38,7 +38,7 @@ function chartWrapper(chart = []) {
 const savedSearchIdKey = 'searchId'
 const updateItemInList = createListUpdater(savedSearchIdKey);
 const updateInstance = (state, instance) => state.getIn([ "savedSearch", savedSearchIdKey ]) === instance[savedSearchIdKey]
-	? state.mergeIn([ "savedSearch" ], instance)
+	? state.mergeIn([ "savedSearch" ], SavedFilter(instance))
 	: state;
 
 const initialState = Map({
@@ -63,10 +63,6 @@ function reducer(state = initialState, action = {}) {
       return action.fromUrl 
         ? state.set('instance', Filter(action.filter))
         : state.mergeIn(['instance'], action.filter);
-    case success(SAVE):
-      return updateItemInList(updateInstance(state, action.data), action.data);
-    case success(REMOVE):
-      return state.update('list', list => list.filter(item => item.searchId !== action.id));
 		case success(FETCH):
 			return state.set("instance", action.data);
 		case success(FETCH_LIST):
@@ -136,7 +132,18 @@ export const edit = reduceThenFetchResource((instance) => ({
     instance,
 }));
 
-export const remove = createRemove(name, (id) => `/saved_search/${id}`);
+export const remove = (id) => (dispatch, getState) => {
+  return dispatch({
+    types: REMOVE.array,
+    call: client => client.delete(`/saved_search/${id}`),
+    id,
+  }).then(() => {
+    dispatch(applySavedSearch(new SavedFilter({})));
+    dispatch(fetchList());
+  });
+};
+
+// export const remove = createRemove(name, (id) => `/saved_search/${id}`);
 
 export const applyFilter = reduceThenFetchResource((filter, fromUrl=false) => ({
   type: APPLY,
@@ -172,15 +179,21 @@ export function fetch(id) {
 }
 
 export const save = (id) => (dispatch, getState) => {
-// export function save(id) {
   const filter = getState().getIn([ 'search', 'instance']).toData();
   filter.filters = filter.filters.map(filterMap);
+  const isNew = !id;
 
   const instance = getState().getIn([ 'search', 'savedSearch']).toData();
-  // instance = instance instanceof SavedFilter ? instance : new SavedFilter(instance);
   return dispatch({
     types: SAVE.array,
-    call: client => client.post(!id ? '/saved_search' : `/saved_search/${id}`, { ...instance, filter })
+    call: client => client.post(isNew ? '/saved_search' : `/saved_search/${id}`, { ...instance, filter })
+  }).then(() => {
+    dispatch(fetchList()).then(() => {
+      if (isNew) {
+        const lastSavedSearch = getState().getIn([ 'search', 'list']).last();
+        dispatch(applySavedSearch(lastSavedSearch));
+      }
+    });
   });
 }