refs #14364 Merge branch 'origin/14364-searchbar-arrow-navigation'
[arvados-workbench2.git] / src / store / search-bar / search-bar-actions.ts
1 // Copyright (C) The Arvados Authors. All rights reserved.
2 //
3 // SPDX-License-Identifier: AGPL-3.0
4
5 import { unionize, ofType, UnionOf } from "~/common/unionize";
6 import { GroupContentsResource, GroupContentsResourcePrefix } from '~/services/groups-service/groups-service';
7 import { Dispatch } from 'redux';
8 import { change, arrayPush } from 'redux-form';
9 import { RootState } from '~/store/store';
10 import { initUserProject } from '~/store/tree-picker/tree-picker-actions';
11 import { ServiceRepository } from '~/services/services';
12 import { FilterBuilder } from "~/services/api/filter-builder";
13 import { ResourceKind } from '~/models/resource';
14 import { GroupClass } from '~/models/group';
15 import { SearchView } from '~/store/search-bar/search-bar-reducer';
16 import { navigateToSearchResults, navigateTo } from '~/store/navigation/navigation-action';
17 import { snackbarActions, SnackbarKind } from '~/store/snackbar/snackbar-actions';
18 import { initialize } from 'redux-form';
19 import { SearchBarAdvanceFormData, PropertyValues } from '~/models/search-bar';
20 import { debounce } from 'debounce';
21
22 export const searchBarActions = unionize({
23     SET_CURRENT_VIEW: ofType<string>(),
24     OPEN_SEARCH_VIEW: ofType<{}>(),
25     CLOSE_SEARCH_VIEW: ofType<{}>(),
26     SET_SEARCH_RESULTS: ofType<GroupContentsResource[]>(),
27     SET_SEARCH_VALUE: ofType<string>(),
28     SET_SAVED_QUERIES: ofType<SearchBarAdvanceFormData[]>(),
29     SET_RECENT_QUERIES: ofType<string[]>(),
30     UPDATE_SAVED_QUERY: ofType<SearchBarAdvanceFormData[]>(),
31     SET_SELECTED_ITEM: ofType<string>(),
32     MOVE_UP: ofType<{}>(),
33     MOVE_DOWN: ofType<{}>(),
34     SELECT_FIRST_ITEM: ofType<{}>()
35 });
36
37 export type SearchBarActions = UnionOf<typeof searchBarActions>;
38
39 export const SEARCH_BAR_ADVANCE_FORM_NAME = 'searchBarAdvanceFormName';
40
41 export const SEARCH_BAR_ADVANCE_FORM_PICKER_ID = 'searchBarAdvanceFormPickerId';
42
43 export const DEFAULT_SEARCH_DEBOUNCE = 1000;
44
45 export const goToView = (currentView: string) => searchBarActions.SET_CURRENT_VIEW(currentView);
46
47 export const saveRecentQuery = (query: string) =>
48     (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) =>
49         services.searchService.saveRecentQuery(query);
50
51
52 export const loadRecentQueries = () =>
53     (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
54         const recentQueries = services.searchService.getRecentQueries();
55         dispatch(searchBarActions.SET_RECENT_QUERIES(recentQueries));
56         return recentQueries;
57     };
58
59 export const searchData = (searchValue: string) =>
60     async (dispatch: Dispatch, getState: () => RootState) => {
61         const currentView = getState().searchBar.currentView;
62         dispatch(searchBarActions.SET_SEARCH_VALUE(searchValue));
63         if (searchValue.length > 0) {
64             dispatch<any>(searchGroups(searchValue, 5, {}));
65             if (currentView === SearchView.BASIC) {
66                 dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
67                 dispatch(navigateToSearchResults);
68             }
69         }
70     };
71
72 export const searchAdvanceData = (data: SearchBarAdvanceFormData) =>
73     async (dispatch: Dispatch) => {
74         dispatch<any>(saveQuery(data));
75         dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.BASIC));
76         dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
77         dispatch(navigateToSearchResults);
78     };
79
80 const saveQuery = (data: SearchBarAdvanceFormData) =>
81     (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
82         const savedQueries = services.searchService.getSavedQueries();
83         if (data.saveQuery && data.searchQuery) {
84             const filteredQuery = savedQueries.find(query => query.searchQuery === data.searchQuery);
85             if (filteredQuery) {
86                 services.searchService.editSavedQueries(data);
87                 dispatch(searchBarActions.UPDATE_SAVED_QUERY(savedQueries));
88                 dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'Query has been successfully updated', hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
89             } else {
90                 services.searchService.saveQuery(data);
91                 dispatch(searchBarActions.SET_SAVED_QUERIES(savedQueries));
92                 dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'Query has been successfully saved', hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
93             }
94         }
95     };
96
97 export const deleteSavedQuery = (id: number) =>
98     (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
99         services.searchService.deleteSavedQuery(id);
100         const savedSearchQueries = services.searchService.getSavedQueries();
101         dispatch(searchBarActions.SET_SAVED_QUERIES(savedSearchQueries));
102         return savedSearchQueries || [];
103     };
104
105 export const editSavedQuery = (data: SearchBarAdvanceFormData) =>
106     (dispatch: Dispatch<any>) => {
107         dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.ADVANCED));
108         dispatch(searchBarActions.SET_SEARCH_VALUE(data.searchQuery));
109         dispatch<any>(initialize(SEARCH_BAR_ADVANCE_FORM_NAME, data));
110     };
111
112 export const openSearchView = () =>
113     (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
114         const savedSearchQueries = services.searchService.getSavedQueries();
115         dispatch(searchBarActions.SET_SAVED_QUERIES(savedSearchQueries));
116         dispatch(loadRecentQueries());
117         dispatch(searchBarActions.OPEN_SEARCH_VIEW());
118         dispatch(searchBarActions.SELECT_FIRST_ITEM());
119     };
120
121 export const closeSearchView = () =>
122     (dispatch: Dispatch<any>) => {
123         dispatch(searchBarActions.SET_SELECTED_ITEM(''));
124         dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
125     };
126
127 export const closeAdvanceView = () =>
128     (dispatch: Dispatch<any>) => {
129         dispatch(searchBarActions.SET_SEARCH_VALUE(''));
130         dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.BASIC));
131     };
132
133 export const navigateToItem = (uuid: string) =>
134     (dispatch: Dispatch<any>) => {
135         dispatch(searchBarActions.SET_SELECTED_ITEM(''));
136         dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
137         dispatch(navigateTo(uuid));
138     };
139
140 export const changeData = (searchValue: string) =>
141     (dispatch: Dispatch, getState: () => RootState) => {
142         dispatch(searchBarActions.SET_SEARCH_VALUE(searchValue));
143         const currentView = getState().searchBar.currentView;
144         const searchValuePresent = searchValue.length > 0;
145
146         if (currentView === SearchView.ADVANCED) {
147
148         } else if (searchValuePresent) {
149             dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.AUTOCOMPLETE));
150             dispatch(searchBarActions.SET_SELECTED_ITEM(searchValue));
151             debounceStartSearch(dispatch);
152         } else {
153             dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.BASIC));
154             dispatch(searchBarActions.SET_SEARCH_RESULTS([]));
155             dispatch(searchBarActions.SELECT_FIRST_ITEM());
156         }
157     };
158
159 export const submitData = (event: React.FormEvent<HTMLFormElement>) =>
160     (dispatch: Dispatch, getState: () => RootState) => {
161         event.preventDefault();
162         const searchValue = getState().searchBar.searchValue;
163         dispatch<any>(saveRecentQuery(searchValue));
164         dispatch<any>(loadRecentQueries());
165         dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
166         dispatch(searchBarActions.SET_SEARCH_VALUE(searchValue));
167         dispatch(searchBarActions.SET_SEARCH_RESULTS([]));
168         dispatch(navigateToSearchResults);
169     };
170
171 const debounceStartSearch = debounce((dispatch: Dispatch) => dispatch<any>(startSearch()), DEFAULT_SEARCH_DEBOUNCE);
172
173 const startSearch = () =>
174     (dispatch: Dispatch, getState: () => RootState) => {
175         const searchValue = getState().searchBar.searchValue;
176         dispatch<any>(searchData(searchValue));
177     };
178
179 const searchGroups = (searchValue: string, limit: number, {...props}) =>
180     async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
181         const currentView = getState().searchBar.currentView;
182
183         if (searchValue || currentView === SearchView.ADVANCED) {
184             const filters = getFilters('name', searchValue, props);
185             const { items } = await services.groupsService.contents('', {
186                 filters,
187                 limit,
188                 recursive: true
189             });
190             dispatch(searchBarActions.SET_SEARCH_RESULTS(items));
191         }
192     };
193
194 export const getFilters = (filterName: string, searchValue: string, props: any): string => {
195     const { resourceKind, dateTo, dateFrom } = props;
196     return new FilterBuilder()
197         .addIsA("uuid", buildUuidFilter(resourceKind))
198         .addILike(filterName, searchValue, GroupContentsResourcePrefix.COLLECTION)
199         .addILike(filterName, searchValue, GroupContentsResourcePrefix.PROCESS)
200         .addILike(filterName, searchValue, GroupContentsResourcePrefix.PROJECT)
201         .addLte('modified_at', buildDateFilter(dateTo))
202         .addGte('modified_at', buildDateFilter(dateFrom))
203         .addEqual('groupClass', GroupClass.PROJECT, GroupContentsResourcePrefix.PROJECT)
204         .getFilters();
205 };
206
207 const buildUuidFilter = (type?: ResourceKind): ResourceKind[] => {
208     return type ? [type] : [ResourceKind.PROJECT, ResourceKind.COLLECTION, ResourceKind.PROCESS];
209 };
210
211 const buildDateFilter = (date?: string): string => {
212     return date ? date : '';
213 };
214
215 export const initAdvanceFormProjectsTree = () =>
216     (dispatch: Dispatch) => {
217         dispatch<any>(initUserProject(SEARCH_BAR_ADVANCE_FORM_PICKER_ID));
218     };
219
220 export const changeAdvanceFormProperty = (property: string, value: PropertyValues[] | string = '') =>
221     (dispatch: Dispatch) => {
222         dispatch(change(SEARCH_BAR_ADVANCE_FORM_NAME, property, value));
223     };
224
225 export const updateAdvanceFormProperties = (propertyValues: PropertyValues) =>
226     (dispatch: Dispatch) => {
227         dispatch(arrayPush(SEARCH_BAR_ADVANCE_FORM_NAME, 'properties', propertyValues));
228     };
229
230 export const moveUp = () =>
231     (dispatch: Dispatch) => {
232         dispatch(searchBarActions.MOVE_UP());
233     };
234
235 export const moveDown = () =>
236     (dispatch: Dispatch) => {
237         dispatch(searchBarActions.MOVE_DOWN());
238     };