[ARVADOS-WORKBENCH2] updated: 1.2.0-745-ge70aae2
Git user
git at public.curoverse.com
Sat Oct 27 15:09:45 EDT 2018
Summary of changes:
.../sharing-dialog/people-select.tsx | 105 +++++++++++++--------
.../sharing-invitation-form-component.tsx | 7 +-
2 files changed, 69 insertions(+), 43 deletions(-)
via e70aae2d917d800e25a1c13fcaae3f3d5c95d90f (commit)
from 6aaf65540506d590fa826b08166c050b924a99ff (commit)
Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.
commit e70aae2d917d800e25a1c13fcaae3f3d5c95d90f
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date: Sat Oct 27 21:08:35 2018 +0200
Init people select backend connection
Feature #14365
Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
diff --git a/src/views-components/sharing-dialog/people-select.tsx b/src/views-components/sharing-dialog/people-select.tsx
index 2e24560..71694b5 100644
--- a/src/views-components/sharing-dialog/people-select.tsx
+++ b/src/views-components/sharing-dialog/people-select.tsx
@@ -4,48 +4,77 @@
import * as React from 'react';
import { Autocomplete } from '~/components/autocomplete/autocomplete';
+import { UserResource, User } 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 } from '@material-ui/core';
-
-export interface Person {
- name: string;
-}
export interface PeopleSelectProps {
- suggestedPeople: Person[];
+
}
export interface PeopleSelectState {
value: string;
- items: Person[];
- suggestions: string[];
-}
-export class PeopleSelect extends React.Component<PeopleSelectProps, PeopleSelectState> {
-
- state = {
- value: '',
- items: [{ name: 'Michal Klobukowski' }],
- suggestions: ['Michal Klobukowski', 'Mateusz Ollik']
- };
-
- render() {
- return (
- <Autocomplete
- label='Invite people'
- value={this.state.value}
- items={this.state.items}
- suggestions={this.getSuggestions()}
- renderChipValue={item => item.name}
- onChange={this.handleChange} />
- );
- }
-
- getSuggestions() {
- const { value, suggestions } = this.state;
- return value
- ? suggestions.filter(suggestion => suggestion.includes(value))
- : [];
- }
-
- handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
- this.setState({ value: event.target.value });
- }
+ items: UserResource[];
+ suggestions: UserResource[];
}
+
+export const PeopleSelect = connect()(
+ class PeopleSelect extends React.Component<PeopleSelectProps & DispatchProp, PeopleSelectState> {
+
+ state: PeopleSelectState = {
+ value: '',
+ items: [],
+ suggestions: []
+ };
+
+ render() {
+ return (
+ <Autocomplete
+ label='Invite people'
+ value={this.state.value}
+ items={this.state.items}
+ suggestions={this.state.suggestions}
+ onChange={this.handleChange}
+ onSelect={this.handleSelect}
+ renderChipValue={this.renderChipValue}
+ renderSuggestion={this.renderSuggestion} />
+ );
+ }
+
+ renderChipValue({ firstName, lastName }: UserResource) {
+ return `${firstName} ${lastName}`;
+ }
+
+ renderSuggestion({ firstName, lastName, email }: UserResource) {
+ return (
+ <ListItemText>
+ {`${firstName} ${lastName} <<${email}>>`}
+ </ListItemText>
+ );
+ }
+
+ handleSelect = (user: UserResource) => {
+ const { items } = this.state;
+ this.setState({ items: [...items, user], suggestions: [], value: '' });
+ }
+
+ handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+ this.setState({ value: event.target.value }, this.getSuggestions);
+ }
+
+ getSuggestions = debounce(() => this.props.dispatch<any>(this.requestSuggestions), 500);
+
+ requestSuggestions = async (_: void, __: void, { userService }: ServiceRepository) => {
+ const { value } = this.state;
+ const filters = new FilterBuilder()
+ .addILike('email', value)
+ .getFilters();
+ const { items } = await userService.list();
+ // const { items } = await userService.list({ filters, limit: 5 });
+ this.setState({ suggestions: items });
+ }
+
+ });
diff --git a/src/views-components/sharing-dialog/sharing-invitation-form-component.tsx b/src/views-components/sharing-dialog/sharing-invitation-form-component.tsx
index f1eb177..8a51689 100644
--- a/src/views-components/sharing-dialog/sharing-invitation-form-component.tsx
+++ b/src/views-components/sharing-dialog/sharing-invitation-form-component.tsx
@@ -4,12 +4,9 @@
import * as React from 'react';
import { Field, WrappedFieldProps } from 'redux-form';
-import { Grid, Input, FormControl, FormHelperText, FormLabel, InputLabel, Chip } from '@material-ui/core';
-import { ChipsInput } from '~/components/chips-input/chips-input';
-import { identity } from 'lodash';
+import { Grid, FormControl, InputLabel } from '@material-ui/core';
import { PermissionSelect } from './permission-select';
import { PeopleSelect } from './people-select';
-import ChipInput from 'material-ui-chip-input';
export default () =>
<Grid container spacing={8}>
@@ -28,7 +25,7 @@ const InvitedPeopleField = () =>
const InvitedPeopleFieldComponent = (props: WrappedFieldProps) =>
- <PeopleSelect suggestedPeople={[]} />;
+ <PeopleSelect />;
const PermissionSelectField = () =>
<Field
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list