15672: Fixes filter usage on search bar actions.

[arvados-workbench2.git] / src / views-components / sharing-dialog / people-select.tsx

diff --git a/src/views-components/sharing-dialog/people-select.tsx b/src/views-components/sharing-dialog/people-select.tsx
index 2aada00e8ae7c75aee8266ccdcf7c3267c89fca3..f6f6c092cd783fe6dc2ed172131a117a11814d92 100644 (file)
--- a/src/views-components/sharing-dialog/people-select.tsx
+++ b/src/views-components/sharing-dialog/people-select.tsx
@@ -4,22 +4,26 @@
 
 import * as React from 'react';
 import { Autocomplete } from '~/components/autocomplete/autocomplete';
-import { UserResource } from '~/models/user';
 import { connect, DispatchProp } from 'react-redux';
 import { ServiceRepository } from '~/services/services';
 import { FilterBuilder } from '../../services/api/filter-builder';
 import { debounce } from 'debounce';
 import { ListItemText, Typography } from '@material-ui/core';
 import { noop } from 'lodash/fp';
+import { GroupClass } from '~/models/group';
 
 export interface Person {
     name: string;
     email: string;
     uuid: string;
 }
+
 export interface PeopleSelectProps {
 
     items: Person[];
+    label?: string;
+    autofocus?: boolean;
+    onlyPeople?: boolean;
 
     onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
     onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
@@ -31,7 +35,7 @@ export interface PeopleSelectProps {
 
 export interface PeopleSelectState {
     value: string;
-    suggestions: UserResource[];
+    suggestions: any[];
 }
 
 export const PeopleSelect = connect()(
@@ -43,12 +47,15 @@ export const PeopleSelect = connect()(
         };
 
         render() {
+            const { label = 'Share' } = this.props;
+
             return (
                 <Autocomplete
-                    label='Invite people'
+                    label={label}
                     value={this.state.value}
                     items={this.props.items}
                     suggestions={this.state.suggestions}
+                    autofocus={this.props.autofocus}
                     onChange={this.handleChange}
                     onCreate={this.handleCreate}
                     onSelect={this.handleSelect}
@@ -64,10 +71,12 @@ export const PeopleSelect = connect()(
             return name ? name : uuid;
         }
 
-        renderSuggestion({ firstName, lastName, email }: UserResource) {
+        renderSuggestion({ firstName, lastName, email, name }: any) {
             return (
                 <ListItemText>
-                    <Typography noWrap>{`${firstName} ${lastName} <<${email}>>`}</Typography>
+                    {name ?
+                        <Typography noWrap>{name}</Typography> :
+                        <Typography noWrap>{`${firstName} ${lastName} <<${email}>>`}</Typography>}
                 </ListItemText>
             );
         }
@@ -89,12 +98,12 @@ export const PeopleSelect = connect()(
             }
         }
 
-        handleSelect = ({ email, firstName, lastName, uuid }: UserResource) => {
+        handleSelect = ({ email, firstName, lastName, uuid, name }: any) => {
             const { onSelect = noop } = this.props;
             this.setState({ value: '', suggestions: [] });
             onSelect({
                 email,
-                name: `${firstName} ${lastName}`,
+                name: `${name ? name : `${firstName} ${lastName}`}`,
                 uuid,
             });
         }
@@ -105,13 +114,18 @@ export const PeopleSelect = connect()(
 
         getSuggestions = debounce(() => this.props.dispatch<any>(this.requestSuggestions), 500);
 
-        requestSuggestions = async (_: void, __: void, { userService }: ServiceRepository) => {
+        requestSuggestions = async (_: void, __: void, { userService, groupsService }: ServiceRepository) => {
             const { value } = this.state;
-            const filters = new FilterBuilder()
+            const filterGroups = new FilterBuilder()
+                .addNotIn('groupClass', [GroupClass.PROJECT])
+                .addILike('name', value)
+                .getFilters();
+            const groupItems = await groupsService.list({ filters: filterGroups, limit: 5 });
+            const filterUsers = new FilterBuilder()
                 .addILike('email', value)
                 .getFilters();
-            const { items } = await userService.list({ filters, limit: 5 });
-            this.setState({ suggestions: items });
+            const userItems: any = await userService.list({ filters: filterUsers, limit: 5 });
+            const items = groupItems.items.concat(userItems.items);
+            this.setState({ suggestions: this.props.onlyPeople ? userItems.items : items });
         }
-
     });