diff --git a/web/modals/threads/thread-settings-modal.react.js b/web/modals/threads/thread-settings-modal.react.js --- a/web/modals/threads/thread-settings-modal.react.js +++ b/web/modals/threads/thread-settings-modal.react.js @@ -96,6 +96,7 @@ +namePlaceholder: string, +changeQueued: boolean, +setTab: (tabType: TabType) => void, + +onChangeName: (event: SyntheticEvent) => void, }; class ThreadSettingsModal extends React.PureComponent { nameInput: ?HTMLInputElement; @@ -167,7 +168,7 @@ ) => { - const target = event.currentTarget; - const newValue = - target.value !== this.props.threadInfo.name ? target.value : undefined; - this.props.setQueuedChanges( - Object.freeze({ - ...this.props.queuedChanges, - name: firstLine(newValue), - }), - ); - }; - onChangeDescription = (event: SyntheticEvent) => { const target = event.currentTarget; const newValue = @@ -450,6 +439,20 @@ setCurrentTabType(tabType); }, []); + const onChangeName = React.useCallback( + (event: SyntheticEvent) => { + invariant(threadInfo, 'threadInfo should exist in onChangeName'); + const target = event.currentTarget; + setQueuedChanges({ + ...queuedChanges, + name: firstLine( + target.value !== threadInfo.name ? target.value : undefined, + ), + }); + }, + [queuedChanges, threadInfo], + ); + if (!threadInfo) { return ( @@ -482,6 +485,7 @@ namePlaceholder={namePlaceholder} changeQueued={changeQueued} setTab={setTab} + onChangeName={onChangeName} /> ); },