[ARVADOS-WORKBENCH2] created: 1.2.0-739-gdacbca6

Git user git at public.curoverse.com
Fri Oct 26 11:18:58 EDT 2018


        at  dacbca6d4ac55f5e837d296d3ac6a048b6759c96 (commit)


commit dacbca6d4ac55f5e837d296d3ac6a048b6759c96
Author: Janicki Artur <artur.janicki at contractors.roche.com>
Date:   Fri Oct 26 17:18:43 2018 +0200

    start advance search bar, remove bugs and add improves, refactor code
    
    Feature #14276
    
    Arvados-DCO-1.1-Signed-off-by: Janicki Artur <artur.janicki at contractors.roche.com>

diff --git a/src/store/search-bar/search-bar-actions.ts b/src/store/search-bar/search-bar-actions.ts
index f574b64..653a8f5 100644
--- a/src/store/search-bar/search-bar-actions.ts
+++ b/src/store/search-bar/search-bar-actions.ts
@@ -50,8 +50,31 @@ export const loadRecentQueries = () =>
         return recentSearchQueries || [];
     };
 
+export const searchData = (searchValue: string) =>
+    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        const currentView = getState().searchBar.currentView;
+        dispatch(searchBarActions.SET_SEARCH_VALUE(searchValue));
+        dispatch(searchBarActions.SET_SEARCH_RESULTS([]));
+        dispatch<any>(searchGroups(searchValue));
+        if (currentView === SearchView.BASIC) {
+            dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
+            dispatch(navigateToSearchResults);
+        }
+
+    };
+
+export const searchAdvanceData = (data: SearchBarAdvanceFormData) =>
+    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        const searchValue = getState().searchBar.searchValue;
+        dispatch<any>(saveQuery(data));
+        dispatch<any>(searchGroups(searchValue, 100, data.type));
+        dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.BASIC));
+        dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
+        dispatch(navigateToSearchResults);
+    };
+
 // Todo: create ids for particular searchQuery
-export const saveQuery = (data: SearchBarAdvanceFormData) =>
+const saveQuery = (data: SearchBarAdvanceFormData) =>
     (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
         const savedSearchQueries = services.searchService.getSavedQueries();
         const filteredQuery = savedSearchQueries.find(query => query.searchQuery === data.searchQuery);
@@ -66,8 +89,6 @@ export const saveQuery = (data: SearchBarAdvanceFormData) =>
                 dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'Query has been sucessfully saved', hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
             }
         }
-        dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.BASIC));
-        dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
     };
 
 export const deleteSavedQuery = (id: number) =>
@@ -101,60 +122,37 @@ export const closeSearchView = () =>
         }
     };
 
+export const closeAdvanceView = () => 
+    (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
+        dispatch(searchBarActions.SET_SEARCH_VALUE(''));
+        dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.BASIC));
+    };
+
 export const navigateToItem = (uuid: string) =>
     (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
         dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
         dispatch(navigateTo(uuid));
     };
 
-export const searchData = (searchValue: string) =>
-    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
-        const currentView = getState().searchBar.currentView;
-        if (currentView !== SearchView.AUTOCOMPLETE) {
-            dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
-        }
-        dispatch(searchBarActions.SET_SEARCH_VALUE(searchValue));
-        dispatch(searchBarActions.SET_SEARCH_RESULTS([]));
-        if (searchValue) {
-            const filters = getFilters('name', searchValue);
-            const { items } = await services.groupsService.contents('', {
-                filters,
-                limit: 5,
-                recursive: true
-            });
-            dispatch(searchBarActions.SET_SEARCH_RESULTS(items));
-        }
-        if (currentView !== SearchView.AUTOCOMPLETE) {
-            dispatch(navigateToSearchResults);
-        }
-        
-    };
-
 export const changeData = (searchValue: string) => 
     (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
         dispatch(searchBarActions.SET_SEARCH_VALUE(searchValue));
-        if (searchValue.length > 0) {
-            dispatch<any>(goToView(SearchView.AUTOCOMPLETE));
-        } else {
-            dispatch<any>(goToView(SearchView.BASIC));
-        }
-        debounceStartSearch(dispatch);
-    };
+        const currentView = getState().searchBar.currentView;
+        const searchValuePresent = searchValue.length > 0;
 
-const debounceStartSearch = debounce((dispatch: Dispatch) => dispatch<any>(startSearch()), DEFAULT_SEARCH_DEBOUNCE);
+        if (currentView === SearchView.ADVANCED) {
 
-const startSearch = () => 
-    (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
-        const searchValue = getState().searchBar.searchValue;
-        if (searchValue.length > 0) {
-            dispatch<any>(searchData(searchValue));
+        } else if (searchValuePresent) {
+            dispatch<any>(goToView(SearchView.AUTOCOMPLETE));
+            debounceStartSearch(dispatch);
         } else {
+            dispatch<any>(goToView(SearchView.BASIC));
             dispatch(searchBarActions.SET_SEARCH_VALUE(searchValue));
             dispatch(searchBarActions.SET_SEARCH_RESULTS([]));
         }
     };
 
-export const submitData = (event: React.FormEvent<HTMLFormElement>) => 
+export const submitData = (event: React.FormEvent<HTMLFormElement>) =>
     (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
         event.preventDefault();
         const searchValue = getState().searchBar.searchValue;
@@ -163,26 +161,41 @@ export const submitData = (event: React.FormEvent<HTMLFormElement>) =>
         dispatch<any>(loadRecentQueries());
     };
 
-export const searchDataOnEnter = (searchValue: string) =>
-    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+const searchDataOnEnter = (searchValue: string) =>
+    (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
         dispatch(searchBarActions.CLOSE_SEARCH_VIEW());
         dispatch(searchBarActions.SET_SEARCH_VALUE(searchValue));
         dispatch(searchBarActions.SET_SEARCH_RESULTS([]));
-        if (searchValue) {
-            const filters = getFilters('name', searchValue);
+        dispatch<any>(searchGroups(searchValue, 100));
+        dispatch(navigateToSearchResults);
+    };
+
+const debounceStartSearch = debounce((dispatch: Dispatch) => dispatch<any>(startSearch()), DEFAULT_SEARCH_DEBOUNCE);
+
+const startSearch = () => 
+    (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        const searchValue = getState().searchBar.searchValue;
+        dispatch<any>(searchData(searchValue));
+    };
+
+const searchGroups = (searchValue: string, limit = 5, resourceKind?: ResourceKind) => 
+    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        const currentView = getState().searchBar.currentView;
+        
+        if (searchValue || currentView === SearchView.ADVANCED) {
+            const filters = getFilters('name', searchValue, resourceKind);
             const { items } = await services.groupsService.contents('', {
                 filters,
-                limit: 5,
+                limit,
                 recursive: true
             });
             dispatch(searchBarActions.SET_SEARCH_RESULTS(items));
         }
-        dispatch(navigateToSearchResults);
     };
 
-export const getFilters = (filterName: string, searchValue: string): string => {
+export const getFilters = (filterName: string, searchValue: string, resourceKind?: ResourceKind): string => {
     return new FilterBuilder()
-        .addIsA("uuid", [ResourceKind.PROJECT, ResourceKind.COLLECTION, ResourceKind.PROCESS])
+        .addIsA("uuid", buildUuidFilter(resourceKind))
         .addILike(filterName, searchValue, GroupContentsResourcePrefix.COLLECTION)
         .addILike(filterName, searchValue, GroupContentsResourcePrefix.PROCESS)
         .addILike(filterName, searchValue, GroupContentsResourcePrefix.PROJECT)
@@ -190,6 +203,10 @@ export const getFilters = (filterName: string, searchValue: string): string => {
         .getFilters();
 };
 
+const buildUuidFilter = (type?: ResourceKind): ResourceKind[] => {
+    return type ? [type] : [ResourceKind.PROJECT, ResourceKind.COLLECTION, ResourceKind.PROCESS];
+};
+
 export const initAdvanceFormProjectsTree = () =>
     (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
         dispatch<any>(initUserProject(SEARCH_BAR_ADVANCE_FORM_PICKER_ID));
diff --git a/src/views-components/search-bar/search-bar-advanced-view.tsx b/src/views-components/search-bar/search-bar-advanced-view.tsx
index 10e535c..c757350 100644
--- a/src/views-components/search-bar/search-bar-advanced-view.tsx
+++ b/src/views-components/search-bar/search-bar-advanced-view.tsx
@@ -3,11 +3,10 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from 'react';
-import { reduxForm, reset, InjectedFormProps } from 'redux-form';
+import { reduxForm, InjectedFormProps, reset } from 'redux-form';
 import { compose, Dispatch } from 'redux';
 import { Paper, StyleRulesCallback, withStyles, WithStyles, Button, Grid, IconButton, CircularProgress } from '@material-ui/core';
-import { SearchView } from '~/store/search-bar/search-bar-reducer';
-import { SEARCH_BAR_ADVANCE_FORM_NAME, saveQuery } from '~/store/search-bar/search-bar-actions';
+import { SEARCH_BAR_ADVANCE_FORM_NAME, searchAdvanceData } from '~/store/search-bar/search-bar-actions';
 import { ArvadosTheme } from '~/common/custom-theme';
 import { CloseIcon } from '~/components/icon/icon';
 import { SearchBarAdvanceFormData } from '~/models/search-bar';
@@ -36,8 +35,8 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
         alignSelf: 'center'
     },
     buttonWrapper: {
-        paddingRight: '14px',
-        paddingTop: '14px',
+        marginRight: '14px',
+        marginTop: '14px',
         position: 'relative',
     },
     button: {
@@ -45,7 +44,7 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     },
     circularProgress: {
         position: 'absolute',
-        top: -9,
+        top: 0,
         bottom: 0,
         left: 0,
         right: 0,
@@ -60,19 +59,20 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     }
 });
 
+// ToDo: maybe we should remove invalid and prostine
 interface SearchBarAdvancedViewFormDataProps {
     submitting: boolean;
     invalid: boolean;
     pristine: boolean;
 }
 
+// ToDo: maybe we should remove tags
 export interface SearchBarAdvancedViewDataProps {
     tags: any;
 }
 
 export interface SearchBarAdvancedViewActionProps {
-    onSetView: (currentView: string) => void;
-    saveQuery: (data: SearchBarAdvanceFormData) => void;
+    closeAdvanceView: () => void;
 }
 
 type SearchBarAdvancedViewProps = SearchBarAdvancedViewActionProps & SearchBarAdvancedViewDataProps;
@@ -97,12 +97,12 @@ export const SearchBarAdvancedView = compose(
         form: SEARCH_BAR_ADVANCE_FORM_NAME,
         validate,
         onSubmit: (data: SearchBarAdvanceFormData, dispatch: Dispatch) => {
-            dispatch<any>(saveQuery(data));
+            dispatch<any>(searchAdvanceData(data));
             dispatch(reset(SEARCH_BAR_ADVANCE_FORM_NAME));
         }
     }),
     withStyles(styles))(
-        ({ classes, onSetView, handleSubmit, submitting, invalid, pristine, tags }: SearchBarAdvancedViewFormProps) =>
+        ({ classes, closeAdvanceView, handleSubmit, submitting, invalid, pristine, tags }: SearchBarAdvancedViewFormProps) =>
             <Paper className={classes.searchView}>
                 <form onSubmit={handleSubmit}>
                     <Grid container direction="column" justify="flex-start" alignItems="flex-start">
@@ -131,7 +131,7 @@ export const SearchBarAdvancedView = compose(
                                     <SearchBarTrashField />
                                 </Grid>
                             </Grid>
-                            <IconButton onClick={() => onSetView(SearchView.BASIC)} className={classes.closeIcon}>
+                            <IconButton onClick={closeAdvanceView} className={classes.closeIcon}>
                                 <CloseIcon />
                             </IconButton>
                         </Grid>
@@ -158,8 +158,9 @@ export const SearchBarAdvancedView = compose(
                             <Grid container item xs={12} justify='flex-end'>
                                 <div className={classes.buttonWrapper}>
                                     <Button type="submit" className={classes.button}
-                                    // ToDo: create easier condition
-                                        disabled={invalid || submitting || pristine || !!(tags && tags.values && ((tags.values.key) || (tags.values.value)) && !Object.keys(tags.values).find(el => el !== 'value' && el !== 'key'))}
+                                        // ToDo: create easier condition
+                                        // Question: do we need this condition?
+                                        // disabled={invalid || submitting || pristine || !!(tags && tags.values && ((tags.values.key) || (tags.values.value)) && !Object.keys(tags.values).find(el => el !== 'value' && el !== 'key'))}
                                         color="primary"
                                         size='small'
                                         variant="contained">
diff --git a/src/views-components/search-bar/search-bar-view.tsx b/src/views-components/search-bar/search-bar-view.tsx
index 3782f86..b3ec7ab 100644
--- a/src/views-components/search-bar/search-bar-view.tsx
+++ b/src/views-components/search-bar/search-bar-view.tsx
@@ -104,7 +104,7 @@ export const SearchBarView = withStyles(styles)(
                             endAdornment={
                                 <InputAdornment position="end">
                                     <Tooltip title='Search'>
-                                        <IconButton>
+                                        <IconButton type="submit">
                                             <SearchIcon />
                                         </IconButton>
                                     </Tooltip>
@@ -121,8 +121,8 @@ export const SearchBarView = withStyles(styles)(
 );
 
 const getView = (props: SearchBarViewProps) => {
-    const { onSetView, loadRecentQueries, savedQueries, deleteSavedQuery, searchValue,
-        searchResults, saveQuery, onSearch, navigateTo, editSavedQuery, tags, currentView } = props;
+    const { onSetView, closeAdvanceView, loadRecentQueries, savedQueries, deleteSavedQuery, searchValue,
+        searchResults, onSearch, navigateTo, editSavedQuery, tags, currentView } = props;
     switch (currentView) {
         case SearchView.AUTOCOMPLETE:
             return <SearchBarAutocompleteView
@@ -131,8 +131,7 @@ const getView = (props: SearchBarViewProps) => {
                 searchValue={searchValue} />;
         case SearchView.ADVANCED:
             return <SearchBarAdvancedView
-                onSetView={onSetView}
-                saveQuery={saveQuery}
+                closeAdvanceView={closeAdvanceView}
                 tags={tags} />;
         default:
             return <SearchBarBasicView
diff --git a/src/views-components/search-bar/search-bar.tsx b/src/views-components/search-bar/search-bar.tsx
index b40225b..68ffecf 100644
--- a/src/views-components/search-bar/search-bar.tsx
+++ b/src/views-components/search-bar/search-bar.tsx
@@ -10,9 +10,9 @@ import {
     searchData,
     deleteSavedQuery,
     loadRecentQueries,
-    saveQuery,
     openSearchView,
     closeSearchView,
+    closeAdvanceView,
     navigateToItem,
     editSavedQuery,
     changeData,
@@ -38,8 +38,8 @@ const mapDispatchToProps = (dispatch: Dispatch): SearchBarActionProps => ({
     onSetView: (currentView: string) => dispatch(goToView(currentView)),
     onSubmit: (event: React.FormEvent<HTMLFormElement>) => dispatch<any>(submitData(event)),
     closeView: () => dispatch<any>(closeSearchView()),
+    closeAdvanceView: () => dispatch<any>(closeAdvanceView()),
     loadRecentQueries: () => dispatch<any>(loadRecentQueries()),
-    saveQuery: (data: SearchBarAdvanceFormData) => dispatch<any>(saveQuery(data)),
     deleteSavedQuery: (id: number) => dispatch<any>(deleteSavedQuery(id)),
     openSearchView: () => dispatch<any>(openSearchView()),
     navigateTo: (uuid: string) => dispatch<any>(navigateToItem(uuid)),

-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list