From f2997d75147187ccf0bc29d61e2af5a375a23e61 Mon Sep 17 00:00:00 2001
From: Michal Klobukowski <michal.klobukowski@contractors.roche.com>
Date: Tue, 30 Oct 2018 13:34:50 +0100
Subject: [PATCH] Improve people select styles and behaviour

Feature #14365

Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski@contractors.roche.com>
---
 .../sharing-dialog/people-select.tsx          | 20 ++++++++++---------
 .../sharing-invitation-form-component.tsx     |  1 -
 2 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/src/views-components/sharing-dialog/people-select.tsx b/src/views-components/sharing-dialog/people-select.tsx
index f49d171e..2aada00e 100644
--- a/src/views-components/sharing-dialog/people-select.tsx
+++ b/src/views-components/sharing-dialog/people-select.tsx
@@ -9,7 +9,7 @@ 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';
+import { ListItemText, Typography } from '@material-ui/core';
 import { noop } from 'lodash/fp';
 
 export interface Person {
@@ -67,7 +67,7 @@ export const PeopleSelect = connect()(
         renderSuggestion({ firstName, lastName, email }: UserResource) {
             return (
                 <ListItemText>
-                    {`${firstName} ${lastName} <<${email}>>`}
+                    <Typography noWrap>{`${firstName} ${lastName} <<${email}>>`}</Typography>
                 </ListItemText>
             );
         }
@@ -78,13 +78,15 @@ export const PeopleSelect = connect()(
         }
 
         handleCreate = () => {
-            const { onCreate = noop } = this.props;
-            this.setState({ value: '', suggestions: [] });
-            onCreate({
-                email: '',
-                name: '',
-                uuid: this.state.value,
-            });
+            const { onCreate } = this.props;
+            if (onCreate) {
+                this.setState({ value: '', suggestions: [] });
+                onCreate({
+                    email: '',
+                    name: '',
+                    uuid: this.state.value,
+                });
+            }
         }
 
         handleSelect = ({ email, firstName, lastName, uuid }: UserResource) => {
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 eafa480b..5aec8feb 100644
--- a/src/views-components/sharing-dialog/sharing-invitation-form-component.tsx
+++ b/src/views-components/sharing-dialog/sharing-invitation-form-component.tsx
@@ -27,7 +27,6 @@ const InvitedPeopleField = () =>
 const InvitedPeopleFieldComponent = ({ fields }: WrappedFieldArrayProps<Person>) =>
     <PeopleSelect
         items={fields.getAll() || []}
-        onCreate={fields.push}
         onSelect={fields.push}
         onDelete={fields.remove} />;
 
-- 
2.30.2