When narrow changed it picks up the current narrow details

zulip · May 22, 2017 · 1915c96 · 1915c96
1 parent 43c0552
commit 1915c96
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 4 deletions.
diff --git a/src/compose/ComposeBox.js b/src/compose/ComposeBox.js
@@ -40,7 +40,7 @@ class ComposeBox extends React.Component {
 
   render() {
     const { optionSelected, operator, operand } = this.state;
-    const { auth, narrow } = this.props;
+    const { auth, narrow, users } = this.props;
     const ActiveComposeComponent = composeComponents[optionSelected];
 
     return (
@@ -53,6 +53,8 @@ class ComposeBox extends React.Component {
             setOperand={this.setOperand}
             operator={operator}
             operand={operand}
+            users={users}
+            narrow={narrow}
           />
         </View>
         <View style={styles.divider} />
@@ -70,6 +72,7 @@ class ComposeBox extends React.Component {
 const mapStateToProps = (state) => ({
   auth: getAuth(state),
   narrow: state.chat.narrow,
+  users: state.users
 });
 
 export default connect(mapStateToProps)(ComposeBox);
diff --git a/src/compose/ModeView.js b/src/compose/ModeView.js
@@ -46,7 +46,7 @@ export default class ModeView extends React.Component {
   render() {
     const { modeSelected } = this.state;
     const { setOperator, setOperand, operator, operand,
-      optionSelected, handleOptionSelected } = this.props;
+      optionSelected, handleOptionSelected, narrow, users } = this.props;
 
     return (
       <View style={inlineStyles.wrapper}>
@@ -61,10 +61,11 @@ export default class ModeView extends React.Component {
             operand={operand}
             setOperator={setOperator}
             setOperand={setOperand}
+            narrow={narrow}
           />
         }
         {modeSelected === 2 &&
-          <PrivateBox operand={operand} setOperand={setOperand} />
+          <PrivateBox operand={operand} setOperand={setOperand} narrow={narrow} users={users} />
         }
       </View>
     );

diff --git a/src/compose/ModeViews/PrivateBox.js b/src/compose/ModeViews/PrivateBox.js
@@ -24,6 +24,18 @@ export default class PrivateBox extends Component {
     };
   }
 
+  componentWillReceiveProps(nextProps) {
+    if (this.props.narrow !== nextProps.narrow) {
+      const recipientEmails = nextProps.narrow[0].operand.split(',');
+      const email = {};
+      const mapEmailToName = (element) => {
+        email[element] = this.props.users.find(x => x.email === element).fullName;
+      };
+      recipientEmails.forEach(mapEmailToName);
+      this.setState({ email }, this.updateOperand);
+    }
+  }
+
   updateOperand = () =>
     this.props.setOperand(Object.keys(this.state.email).join(','));
 

diff --git a/src/compose/ModeViews/StreamBox.js b/src/compose/ModeViews/StreamBox.js
@@ -22,17 +22,27 @@ export default class StreamBox extends Component {
   constructor() {
     super();
     this.state = { autoComplete: false };
+    this.count = 0;
   }
   handleAutocompleteOperator = (operator: string) => {
     this.props.setOperator(operator);
     this.setState({ autoComplete: false });
     this.operandInput.focus();
   }
 
+  componentWillReceiveProps(nextProps) {
+    if (this.props.narrow !== nextProps.narrow) {
+      if (nextProps.narrow[0].operator !== 'pm-with') {
+        const { setOperand, setOperator } = this.props;
+        setOperand(nextProps.narrow[0].operand);
+        setOperator(nextProps.narrow[0].operator);
+      }
+    }
+  }
+
   render() {
     const { operator, setOperator, operand, setOperand } = this.props;
     const { autoComplete } = this.state;
-
     return (
       <View style={styles.streamInputWrapper}>
         {autoComplete &&