From: Pawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>
Date: Tue, 9 Oct 2018 13:32:13 +0000 (+0200)
Subject: merge master
X-Git-Tag: 1.3.0~67^2~1^2~2^2~2
X-Git-Url: https://git.arvados.org/arvados-workbench2.git/commitdiff_plain/1514f6a2ae8103f75f08034299115ad751d8a785

merge master

Feature #14313

Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>
---

1514f6a2ae8103f75f08034299115ad751d8a785
diff --cc src/store/search-bar/search-bar-actions.ts
index 3d6d3fdc,2d171e02..2b8ca83e
--- a/src/store/search-bar/search-bar-actions.ts
+++ b/src/store/search-bar/search-bar-actions.ts
@@@ -17,13 -23,28 +23,38 @@@ export type SearchBarActions = UnionOf<
  
  export const goToView = (currentView: string) => searchBarActions.SET_CURRENT_VIEW(currentView);
  
 -export const searchData = (searchValue: string) => 
 +export const saveRecentQuery = (query: string) =>
 +    (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
 +        services.searchQueriesService.saveRecentQuery(query);
 +    };
 +
 +export const loadRecentQueries = () =>
 +    (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
 +        const recentSearchQueries = services.searchQueriesService.getRecentQueries();
 +        return recentSearchQueries || [];
-     };
++    };
++
++export const searchData = (searchValue: string) =>
+     async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+         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, 
++                filters,
+                 limit: 5,
+                 recursive: true
+             });
+             dispatch(searchBarActions.SET_SEARCH_RESULTS(items));
+         }
+     };
+ 
 -
+ const getFilters = (filterName: string, searchValue: string): string => {
+     return new FilterBuilder()
+         .addIsA("uuid", [ResourceKind.PROJECT, ResourceKind.COLLECTION, ResourceKind.PROCESS])
+         .addILike(filterName, searchValue, GroupContentsResourcePrefix.COLLECTION)
+         .addILike(filterName, searchValue, GroupContentsResourcePrefix.PROCESS)
+         .addILike(filterName, searchValue, GroupContentsResourcePrefix.PROJECT)
+         .addEqual('groupClass', GroupClass.PROJECT, GroupContentsResourcePrefix.PROJECT)
+         .getFilters();
 -};
++};
diff --cc src/views-components/search-bar/search-bar-advanced-view.tsx
index fe167ba9,356eb33f..dde23685
--- a/src/views-components/search-bar/search-bar-advanced-view.tsx
+++ b/src/views-components/search-bar/search-bar-advanced-view.tsx
@@@ -5,9 -5,9 +5,9 @@@
  import * as React from 'react';
  import { Paper, StyleRulesCallback, withStyles, WithStyles, List, Button } from '@material-ui/core';
  import { SearchView } from '~/store/search-bar/search-bar-reducer';
- import { RenderRecentQueries } from '~/views-components/search-bar/search-bar-view';
+ import { RecentQueriesItem } from '~/views-components/search-bar/search-bar-view';
  
 -type CssRules = 'list';
 +type CssRules = 'list' | 'searchView';
  
  const styles: StyleRulesCallback<CssRules> = theme => {
      return {
@@@ -26,9 -23,9 +26,9 @@@ interface SearchBarAdvancedViewProps 
  
  export const SearchBarAdvancedView = withStyles(styles)(
      ({ classes, setView }: SearchBarAdvancedViewProps & WithStyles<CssRules>) =>
 -        <Paper>
 +        <Paper className={classes.searchView}>
              <List component="nav" className={classes.list}>
-                 <RenderRecentQueries text='ADVANCED VIEW' />
+                 <RecentQueriesItem text='ADVANCED VIEW' />
              </List>
              <Button onClick={() => setView(SearchView.BASIC)}>Back</Button>
          </Paper>
diff --cc src/views-components/search-bar/search-bar-autocomplete-view.tsx
index faeabb17,c4b2457d..affaf531
--- a/src/views-components/search-bar/search-bar-autocomplete-view.tsx
+++ b/src/views-components/search-bar/search-bar-autocomplete-view.tsx
@@@ -3,30 -3,38 +3,42 @@@
  // SPDX-License-Identifier: AGPL-3.0
  
  import * as React from 'react';
 -import { Paper, StyleRulesCallback, withStyles, WithStyles, List, ListItem, ListItemText } from '@material-ui/core';
 -import { ArvadosTheme } from '~/common/custom-theme';
 +import { Paper, StyleRulesCallback, withStyles, WithStyles, List } from '@material-ui/core';
- import { RenderRecentQueries } from '~/views-components/search-bar/search-bar-view';
+ import { RecentQueriesItem } from '~/views-components/search-bar/search-bar-view';
+ import { GroupContentsResource } from '~/services/groups-service/groups-service';
+ import Highlighter from "react-highlight-words";
  
 -type CssRules = 'list';
 +type CssRules = 'list' | 'searchView';
  
 -const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
 -    list: {
 -        padding: 0
 -    }
 -});
 +const styles: StyleRulesCallback<CssRules> = theme => {
 +    return {
 +        list: {
-             padding: '0px'
++            padding: 0
 +        },
 +        searchView: {
 +            borderRadius: `0 0 ${theme.spacing.unit / 4}px ${theme.spacing.unit / 4}px`
 +        }
 +    };
 +};
  
- interface SearchBarAutocompleteViewProps {
+ export interface SearchBarAutocompleteViewDataProps {
+     searchResults?: GroupContentsResource[];
+     searchValue?: string;
  }
  
+ type SearchBarAutocompleteViewProps = SearchBarAutocompleteViewDataProps & WithStyles<CssRules>;
+ 
  export const SearchBarAutocompleteView = withStyles(styles)(
-     ({ classes }: SearchBarAutocompleteViewProps & WithStyles<CssRules>) =>
 -    ({ classes, searchResults, searchValue }: SearchBarAutocompleteViewProps ) =>
 -        <Paper>
 -            {searchResults &&  <List component="nav" className={classes.list}>
++    ({ classes, searchResults, searchValue }: SearchBarAutocompleteViewProps) =>
 +        <Paper className={classes.searchView}>
-             <List component="nav" className={classes.list}>
-                 <RenderRecentQueries text='AUTOCOMPLETE VIEW' />
-             </List>
++            {searchResults && <List component="nav" className={classes.list}>
+                 {searchResults.map((item: GroupContentsResource) => {
+                     return <RecentQueriesItem key={item.uuid} text={getFormattedText(item.name, searchValue)} />;
+                 })}
+             </List>}
          </Paper>
- );
+ );
+ 
+ const getFormattedText = (textToHighlight: string, searchString = '') => {
+     return <Highlighter searchWords={[searchString]} autoEscape={true} textToHighlight={textToHighlight} />;
+ };
diff --cc src/views-components/search-bar/search-bar-basic-view.tsx
index b8746316,c2bca73e..7f90ecde
--- a/src/views-components/search-bar/search-bar-basic-view.tsx
+++ b/src/views-components/search-bar/search-bar-basic-view.tsx
@@@ -49,7 -47,8 +49,7 @@@ export const SearchBarBasicView = withS
              </List>
              <div className={classes.searchQueryList}>Recent search queries</div>
              <List component="nav" className={classes.list}>
-                 {recentQueries().map((query, index) => <RenderRecentQueries key={query + index} text={query} />)}
 -                <RecentQueriesItem text="cos" />
 -                <RecentQueriesItem text="testtest" />
++                {recentQueries().map((query, index) => <RecentQueriesItem key={query + index} text={query} />)}
              </List>
              <div className={classes.advanced} onClick={() => setView(SearchView.ADVANCED)}>Advanced search</div>
          </Paper>
diff --cc src/views-components/search-bar/search-bar-view.tsx
index b4d98f88,f26cb7e6..b2575a8f
--- a/src/views-components/search-bar/search-bar-view.tsx
+++ b/src/views-components/search-bar/search-bar-view.tsx
@@@ -19,11 -19,12 +19,12 @@@ import { RemoveIcon } from '~/component
  import { SearchView } from '~/store/search-bar/search-bar-reducer';
  import { SearchBarBasicView } from '~/views-components/search-bar/search-bar-basic-view';
  import { SearchBarAdvancedView } from '~/views-components/search-bar/search-bar-advanced-view';
- import { SearchBarAutocompleteView } from '~/views-components/search-bar/search-bar-autocomplete-view';
+ import { SearchBarAutocompleteView, SearchBarAutocompleteViewDataProps } from '~/views-components/search-bar/search-bar-autocomplete-view';
+ import { ArvadosTheme } from '~/common/custom-theme';
  
 -type CssRules = 'container' | 'input' | 'searchBar';
 +type CssRules = 'container' | 'containerSearchViewOpened' | 'input' | 'searchBar';
  
- const styles: StyleRulesCallback<CssRules> = theme => {
+ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => {
      return {
          container: {
              position: 'relative',
@@@ -150,9 -144,11 +151,11 @@@ export const SearchBarView = withStyles
                  case SearchView.ADVANCED:
                      return <SearchBarAdvancedView setView={this.props.onSetView} />;
                  case SearchView.AUTOCOMPLETE:
-                     return <SearchBarAutocompleteView />;
+                     return <SearchBarAutocompleteView 
+                                 searchResults={this.props.searchResults} 
+                                 searchValue={this.props.searchValue} />;
                  default:
 -                    return <SearchBarBasicView setView={this.props.onSetView} />;
 +                    return <SearchBarBasicView setView={this.props.onSetView} recentQueries={this.props.loadQueries} />;
              }
          }
  
diff --cc src/views-components/search-bar/search-bar.tsx
index e9ebc7c7,df8808c1..98440fda
--- a/src/views-components/search-bar/search-bar.tsx
+++ b/src/views-components/search-bar/search-bar.tsx
@@@ -5,9 -5,8 +5,9 @@@
  import { connect } from 'react-redux';
  import { RootState } from '~/store/store';
  import { Dispatch } from 'redux';
- import { goToView, searchBarActions } from '~/store/search-bar/search-bar-actions';
+ import { goToView, searchData, searchBarActions } from '~/store/search-bar/search-bar-actions';
  import { SearchBarView } from '~/views-components/search-bar/search-bar-view';
 +import { saveRecentQuery, loadRecentQueries } from '~/store/search-bar/search-bar-actions';
  
  const mapStateToProps = ({ searchBar }: RootState) => {
      return {
@@@ -17,11 -18,10 +19,12 @@@
  };
  
  const mapDispatchToProps = (dispatch: Dispatch) => ({
+     onSearch: (valueSearch: string) => dispatch<any>(searchData(valueSearch)),
      onSetView: (currentView: string) => dispatch(goToView(currentView)),
      openView: () => dispatch<any>(searchBarActions.OPEN_SEARCH_VIEW()),
 -    closeView: () => dispatch<any>(searchBarActions.CLOSE_SEARCH_VIEW())
 +    closeView: () => dispatch<any>(searchBarActions.CLOSE_SEARCH_VIEW()),
 +    saveQuery: (query: string) => dispatch<any>(saveRecentQuery(query)),
 +    loadQueries: () => dispatch<any>(loadRecentQueries())
  });
  
  export const SearchBar = connect(mapStateToProps, mapDispatchToProps)(SearchBarView);