title: The default prop for a nested object is not being displayed properly
body: <p>I want to have a default string for a nested prop within my component, but the following isn't showing the default value:</p>
  
  <pre class="lang-js prettyprint-override"><code>export default SuccessModal = ({ 
      completed, 
      setCompleted, 
      navigation, 
      isOpen, 
      setModal 
  }) =&gt; {
      const { data, error } = completed &amp;&amp; completed
      const onPressHandler = () =&gt; {
          setModal(false)
          navigation.navigate('Profile')
      }
  
      return (
          &lt;View style={styles.container}&gt;
              &lt;Modal
                  animationType="fade"
                  transparent={false}
                  visible={true}
                  onRequestClose={() =&gt; {
                      Alert.alert('Modal has been closed.');
                  }}&gt;
                  &lt;View style={styles.modal}&gt;
                      &lt;View&gt;
                          {error ? &lt;Text style={styles.mainText}&gt;Sorry, something went wrong!&lt;/Text&gt; 
                                 : &lt;Text style={styles.mainText}&gt;Your {data.createPost &amp;&amp; data.createPost.title} has been posted!&lt;/Text&gt;}
  
                          &lt;TouchableHighlight
                              style={styles.button}
                              onPress={onPressHandler}&gt;
                              &lt;Text style={styles.buttonText}&gt;Hide Modal&lt;/Text&gt;
                          &lt;/TouchableHighlight&gt;
                      &lt;/View&gt;
                  &lt;/View&gt;
              &lt;/Modal&gt;
          &lt;/View&gt;
      )
  }
  
  SuccessModal.propTypes = {
      completed: PropTypes.shape({
          data: PropTypes.shape({
              createPost: PropTypes.shape({
                  title: PropTypes.string.isRequired
              })
          })
      }),
      setCompleted: PropTypes.func,
      navigation: PropTypes.object,
      isOpen: PropTypes.bool,
      setModal: PropTypes.func,
  }
  
  SuccessModal.defaultProps = {
      completed: {
          data: {
              createPost: {
                  title: "post",
              }
          }
      }
  }
  </code></pre>
  
  <p>I want the <code>title</code> nested inside the <code>completed</code> object to show "post", but when the component is rendered, the value doesn't show, but instead shows blank</p>