From 0ee5928db8864a0f7af0c2727defdf800f1604cc Mon Sep 17 00:00:00 2001 From: Pawel Kowalczyk Date: Wed, 10 Oct 2018 16:49:06 +0200 Subject: [PATCH] saving-in-store-for-dynamic-deleting Feature #14308 Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk --- src/services/search-service/search-service.ts | 1 - src/store/search-bar/search-bar-actions.ts | 11 ++++------- src/store/search-bar/search-bar-reducer.ts | 5 ++++- .../search-bar/search-bar-basic-view.tsx | 6 +++--- .../search-bar/search-bar-view.tsx | 14 +++++++------- src/views-components/search-bar/search-bar.tsx | 7 +++---- 6 files changed, 21 insertions(+), 23 deletions(-) diff --git a/src/services/search-service/search-service.ts b/src/services/search-service/search-service.ts index 6a0043a3..c394da5e 100644 --- a/src/services/search-service/search-service.ts +++ b/src/services/search-service/search-service.ts @@ -32,6 +32,5 @@ export class SearchQueriesService { deleteSavedQuery(id: number) { this.savedQueries.splice(id, 1); localStorage.setItem('savedQueries', JSON.stringify(this.savedQueries)); - } } \ No newline at end of file diff --git a/src/store/search-bar/search-bar-actions.ts b/src/store/search-bar/search-bar-actions.ts index 55acff82..e158134c 100644 --- a/src/store/search-bar/search-bar-actions.ts +++ b/src/store/search-bar/search-bar-actions.ts @@ -16,7 +16,8 @@ export const searchBarActions = unionize({ OPEN_SEARCH_VIEW: ofType<{}>(), CLOSE_SEARCH_VIEW: ofType<{}>(), SET_SEARCH_RESULTS: ofType(), - SET_SEARCH_VALUE: ofType() + SET_SEARCH_VALUE: ofType(), + SET_SAVED_QUERIES: ofType() }); export type SearchBarActions = UnionOf; @@ -37,18 +38,14 @@ export const loadRecentQueries = () => export const saveQuery = (query: string) => (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { services.searchQueriesService.saveQuery(query); - }; - -export const loadSavedQueries = () => - (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { - const savedSearchQueries = services.searchQueriesService.getSavedQueries(); - return savedSearchQueries || []; + dispatch(searchBarActions.SET_SAVED_QUERIES(services.searchQueriesService.getSavedQueries())); }; export const deleteSavedQuery = (id: number) => (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { services.searchQueriesService.deleteSavedQuery(id); const savedSearchQueries = services.searchQueriesService.getSavedQueries(); + dispatch(searchBarActions.SET_SAVED_QUERIES(services.searchQueriesService.getSavedQueries())); return savedSearchQueries || []; }; diff --git a/src/store/search-bar/search-bar-reducer.ts b/src/store/search-bar/search-bar-reducer.ts index 048cfea1..26ebb9ec 100644 --- a/src/store/search-bar/search-bar-reducer.ts +++ b/src/store/search-bar/search-bar-reducer.ts @@ -10,6 +10,7 @@ interface SearchBar { open: boolean; searchResults: GroupContentsResource[]; searchValue: string; + savedQueries: string[]; } export enum SearchView { @@ -22,7 +23,8 @@ const initialState: SearchBar = { currentView: SearchView.BASIC, open: false, searchResults: [], - searchValue: '' + searchValue: '', + savedQueries: JSON.parse(localStorage.getItem('savedQueries') || '[]') as string[] }; export const searchBarReducer = (state = initialState, action: SearchBarActions): SearchBar => @@ -32,5 +34,6 @@ export const searchBarReducer = (state = initialState, action: SearchBarActions) CLOSE_SEARCH_VIEW: () => ({ ...state, open: false }), SET_SEARCH_RESULTS: (searchResults) => ({ ...state, searchResults }), SET_SEARCH_VALUE: (searchValue) => ({ ...state, searchValue }), + SET_SAVED_QUERIES: savedQueries => ({ ...state, savedQueries }), default: () => state }); \ No newline at end of file diff --git a/src/views-components/search-bar/search-bar-basic-view.tsx b/src/views-components/search-bar/search-bar-basic-view.tsx index 90fdaa79..aca14228 100644 --- a/src/views-components/search-bar/search-bar-basic-view.tsx +++ b/src/views-components/search-bar/search-bar-basic-view.tsx @@ -38,16 +38,16 @@ const styles: StyleRulesCallback = theme => { interface SearchBarBasicViewProps { setView: (currentView: string) => void; recentQueries: () => string[]; - savedQueries: () => string[]; deleteSavedQuery: (id: number) => void; + savedQueries: string[]; } export const SearchBarBasicView = withStyles(styles)( - ({ classes, setView, recentQueries, savedQueries, deleteSavedQuery }: SearchBarBasicViewProps & WithStyles) => + ({ classes, setView, recentQueries, deleteSavedQuery, savedQueries }: SearchBarBasicViewProps & WithStyles) =>
Saved search queries
- {savedQueries().map((query, index) => )} + {savedQueries.map((query, index) => )}
Recent search queries
diff --git a/src/views-components/search-bar/search-bar-view.tsx b/src/views-components/search-bar/search-bar-view.tsx index cfab6c71..7680516a 100644 --- a/src/views-components/search-bar/search-bar-view.tsx +++ b/src/views-components/search-bar/search-bar-view.tsx @@ -55,6 +55,7 @@ type SearchBarDataProps = { searchValue: string; currentView: string; isPopoverOpen: boolean; + savedQueries: string[]; } & SearchBarAutocompleteViewDataProps; interface SearchBarActionProps { @@ -66,7 +67,6 @@ interface SearchBarActionProps { saveRecentQuery: (query: string) => void; loadRecentQueries: () => string[]; saveQuery: (query: string) => void; - loadSavedQueries: () => string[]; deleteSavedQuery: (id: number) => void; } @@ -161,17 +161,18 @@ export const SearchBarView = withStyles(styles)( } getView = (currentView: string) => { + const { onSetView, loadRecentQueries, savedQueries, deleteSavedQuery, searchValue, searchResults } = this.props; switch (currentView) { case SearchView.BASIC: - return ; + return ; case SearchView.ADVANCED: - return ; + return ; case SearchView.AUTOCOMPLETE: return ; + searchResults={searchResults} + searchValue={searchValue} />; default: - return ; + return ; } } @@ -182,7 +183,6 @@ export const SearchBarView = withStyles(styles)( this.props.saveQuery(this.state.value); this.props.onSearch(this.state.value); this.props.loadRecentQueries(); - this.props.loadSavedQueries(); } handleChange = (event: React.ChangeEvent) => { diff --git a/src/views-components/search-bar/search-bar.tsx b/src/views-components/search-bar/search-bar.tsx index eddc7f0e..eaca7fab 100644 --- a/src/views-components/search-bar/search-bar.tsx +++ b/src/views-components/search-bar/search-bar.tsx @@ -12,8 +12,7 @@ import { deleteSavedQuery, saveRecentQuery, loadRecentQueries, - saveQuery, - loadSavedQueries + saveQuery } from '~/store/search-bar/search-bar-actions'; import { SearchBarView } from '~/views-components/search-bar/search-bar-view'; @@ -22,7 +21,8 @@ const mapStateToProps = ({ searchBar }: RootState) => { searchValue: searchBar.searchValue, currentView: searchBar.currentView, isPopoverOpen: searchBar.open, - searchResults: searchBar.searchResults + searchResults: searchBar.searchResults, + savedQueries: searchBar.savedQueries }; }; @@ -34,7 +34,6 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({ saveRecentQuery: (query: string) => dispatch(saveRecentQuery(query)), loadRecentQueries: () => dispatch(loadRecentQueries()), saveQuery: (query: string) => dispatch(saveQuery(query)), - loadSavedQueries: () => dispatch(loadSavedQueries()), deleteSavedQuery: (id: number) => dispatch(deleteSavedQuery(id)) }); -- 2.39.5