title: Fetching data from AWS SQS and wait to render ReactJs
body: <p>So we are having an issues where we send a request to <strong>SQS</strong> and then on the receive message it returns no data.  </p>
  
  <p>To try and fix this we threw in a while loop to poll for an extended period of time; however that really doesn't work because we cannot sleep between polls and it seems as if they are all happening asynchronously. </p>
  
  <p>I say that because if the value does get returned (happens about 50% of the time) it will re render the next screen as many time as cap is left and polling never gets set to false.  Could someone please help us out! </p>
  
  <pre><code>render() {
      return (
        &lt;Navigator
            renderScene={this.renderScene.bind(this)}
            navigator={this.props.navigator}
            navigationBar={
              &lt;Navigator.NavigationBar style={{backgroundColor: 'transparent'}}
                 routeMapper={NavigationBarRouteMapper} /&gt;
            } /&gt;
      );
    }
  
  renderScene() {
      return (
        &lt;View style={styles.container}&gt;
          &lt;StatusBar barStyle="light-content" hidden={true}/&gt;
          &lt;View style={styles.topContainer}&gt;
            &lt;View style={styles.bannerContainer}&gt;
              &lt;View style={{flexDirection: 'column', flex: 1, justifyContent: 'center', alignItems: 'center'}}&gt;
                &lt;Image style={styles.mark} source={require('./yb.png')} /&gt;
              &lt;/View&gt;
            &lt;/View&gt;
            &lt;View style={styles.credentialContainer}&gt;
              &lt;View style={styles.inputContainer}&gt;
                &lt;Icon style={styles.inputPassword} name="person" size={28} color="#FFCD00" /&gt;
                    &lt;View style={{flexDirection: 'row', flex: 1, marginLeft: 2, marginRight: 2, borderBottomColor: '#e0e0e0', borderBottomWidth: 2}}&gt;
                      &lt;TextInput
                          style={styles.input}
                          placeholder="Username"
                          autoCorrect={false}
                          placeholderTextColor="#e0e0e0"
                          onChangeText={(text) =&gt; this.setState({username: text})}
                          value={this.state.username}&gt;
                      &lt;/TextInput&gt;
                    &lt;/View&gt;
                  &lt;/View&gt;
  
                  &lt;View style={styles.inputContainer}&gt;
                    &lt;Icon style={styles.inputPassword} name="lock" size={28} color="#FFCD00" /&gt;
                      &lt;View style={{flexDirection: 'row', flex: 1, marginLeft: 2, marginRight: 2, borderBottomColor: '#e0e0e0', borderBottomWidth: 2}}&gt;
                      &lt;TextInput
                          style={styles.input}
                          placeholder="Password"
                          autoCorrect={false}
                          secureTextEntry={true}
                          placeholderTextColor="#e0e0e0"
                          onChangeText={(text) =&gt; this.setState({password: text})}
                          value={this.state.password}&gt;
                        &lt;/TextInput&gt;
                      &lt;/View&gt;
                  &lt;/View&gt;
                  &lt;TouchableOpacity style={styles.forgotContainer}&gt;
                      &lt;Text style={{color: '#e0e0e0'}}&gt;Forgot Password&lt;/Text&gt;
                  &lt;/TouchableOpacity&gt;
              &lt;/View&gt;
          &lt;/View&gt;
  
          &lt;TouchableHighlight
            underlayColor="#D6AB00"
            onPress={this.login}
            style={styles.signInButtonContainer}&gt;
            &lt;Text style={styles.signInText}&gt;Sign In&lt;/Text&gt;
          &lt;/TouchableHighlight&gt;    
        &lt;/View&gt;
      );
    }
  
    login() {
     var polling = true;
      if(this.state.username.length == 0){
        Alert.alert("Error","No email entered");
      }
      else if(this.state.password.length == 0){
        Alert.alert("Error","No password entered");
      }
      else
      {    
      info.username = this.state.username;
      info.password = this.state.password;
  
      AWS.sendMessage('****',JSON.stringify(info), (error,result) =&gt;{
        if(error != null) console.log("Error Occured Attempting to Send A Message")
        else {
          var cap=0;
          while(cap &lt;= 30 &amp;&amp; polling){
          cap = cap+1;
  
            AWS.receiveMessages('****'+info.username, (error, result) =&gt;{
              if(error != null) console.log("Error");
              else{
                if(result){
                  try{
                      polling = false;
                      if(result[0] == "[]")
                      {
                        console.log(result[0]);
                        console.log(typeof result[0]);
                        Alert.alert("Error","Username/Password Incorrect");
                      }
                      else
                      {
                        console.log(result[0]);
                        console.log(typeof result[0]);
                        var temp = JSON.parse(result[0]);
                        this.props.navigator.replace({
                          id: 'MapIOS',
                          data: {
                            username: info.username,
                            ofAge: temp[0].ofAge,
                            uid: temp[0].u_ID
                          },
                        });
                      }
                  }
                  catch(e){
                    console.log(e);
                  }
                }
                AWS.deleteMessage('***'+info.username, result[1], (error) =&gt; {
                 if(error != null) console.log("Error");
                });
              }
            });
          }
          return
        }
      });
    }
    } 
  };
  </code></pre>