Merge pull request #11037 from rushatgabhane/rm-setNativeProps-roomInput

RoomNameInput - Migrate setNativeProps to state
Expensify · Sep 22, 2022 · acadb59 · acadb59
2 parents 86cae9b + 79ff031
commit acadb59
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 10 deletions.
diff --git a/src/components/RoomNameInput.js b/src/components/RoomNameInput.js
@@ -12,8 +12,8 @@ const propTypes = {
     /** Callback to execute when the text input is modified correctly */
     onChangeText: PropTypes.func,
 
-    /** Initial room name to show in input field. This should include the '#' already prefixed to the name */
-    initialValue: PropTypes.string,
+    /** Room name to show in input field. This should include the '#' already prefixed to the name */
+    value: PropTypes.string,
 
     /** Whether we should show the input as disabled */
     disabled: PropTypes.bool,
@@ -50,7 +50,7 @@ const propTypes = {
 
 const defaultProps = {
     onChangeText: () => {},
-    initialValue: '',
+    value: '',
     disabled: false,
     errorText: '',
     ...fullPolicyDefaultProps,
@@ -101,7 +101,7 @@ class RoomNameInput extends Component {
                 prefixCharacter={CONST.POLICY.ROOM_PREFIX}
                 placeholder={this.props.translate('newRoomPage.social')}
                 onChange={this.setModifiedRoomName}
-                defaultValue={this.props.initialValue.substring(1)} // Since the room name always starts with a prefix, we omit the first character to avoid displaying it twice.
+                value={this.props.value.substring(1)} // Since the room name always starts with a prefix, we omit the first character to avoid displaying it twice.
                 errorText={this.props.errorText}
                 autoCapitalize="none"
             />

diff --git a/src/pages/ReportSettingsPage.js b/src/pages/ReportSettingsPage.js
@@ -125,11 +125,6 @@ class ReportSettingsPage extends Component {
      */
     resetToPreviousName() {
         this.setState({newRoomName: this.props.report.reportName});
-
-        // Reset the input's value back to the previously saved report name
-        if (this.roomNameInputRef) {
-            this.roomNameInputRef.setNativeProps({text: this.props.report.reportName.replace(CONST.POLICY.ROOM_PREFIX, '')});
-        }
         Report.clearPolicyRoomNameErrors(this.props.report.reportID);
     }
 
@@ -229,7 +224,7 @@ class ReportSettingsPage extends Component {
                                             : (
                                                 <RoomNameInput
                                                     ref={el => this.roomNameInputRef = el}
-                                                    initialValue={this.state.newRoomName}
+                                                    value={this.state.newRoomName}
                                                     policyID={linkedWorkspace && linkedWorkspace.id}
                                                     errorText={this.state.errors.newRoomName}
                                                     onChangeText={newRoomName => this.clearErrorAndSetValue('newRoomName', newRoomName)}

diff --git a/src/pages/workspace/WorkspaceNewRoomPage.js b/src/pages/workspace/WorkspaceNewRoomPage.js
@@ -155,6 +155,7 @@ class WorkspaceNewRoomPage extends React.Component {
                             policyID={this.state.policyID}
                             errorText={this.state.errors.roomName}
                             onChangeText={roomName => this.clearErrorAndSetValue('roomName', roomName)}
+                            value={this.state.roomName}
                         />
                     </View>
                     <View style={styles.mb5}>