title: React Provider Pattern, prop not updating in child component
body: <p>So i have written a provider to pass strings to any part of my application.  The issue i have is that if i add a strings prop to my child component it overrides the entire prop and seems to ignore the merge i do in connector</p>
  
  <h2>Provider</h2>
  
  <pre><code>import { Component, Children } from 'react'
  import PropTypes from 'prop-types'
  
  export default class StringsProvider extends Component {
    static propTypes = {
      children: PropTypes.element.isRequired,
      strings: PropTypes.object
    }
  
    // Specify what is being added to context
    static childContextTypes = {
      strings: PropTypes.object.isRequired
    }
  
    getChildContext() {
      const { strings } = this.props
  
      return { strings: strings }
    }
  
    render() {
      return Children.only(this.props.children)
    }
  }
  </code></pre>
  
  <h2>Connector</h2>
  
  <pre><code>import React, { Component } from 'react'
  import PropTypes from 'prop-types'
  import _ from 'lodash'
  
  // here we basically create a HOC that returns on Context (This is our component).
  // The HOC adds the merged strings set to the Context Component and then renders it
  export default (WrappedComp, defaultStrings, stringNameSpace) =&gt; {
    return class StringsComponent extends Component {
      static propTypes = {
        strings: PropTypes.object.isRequired
      }
  
      static contextTypes = {
        strings: PropTypes.object.isRequired
      }
  
      // Takes the defaultStrings from the context and merges them with the
      // strings passed to the Context Component
      getStrings = () =&gt; {
        let out
  
        if (this.props.strings) {
  
          console.log('defaultStrings: ' + Object.values(defaultStrings)[0])
          console.log(
            'this.context.strings[stringNameSpace]: ' +
              Object.values(this.context.strings[stringNameSpace])[0]
          )
          console.log(
            'this.props.strings: ' + Object.values(this.props.strings)[0]
          )
          out = _.merge(
            defaultStrings,
            this.context.strings[stringNameSpace] ? this.context.strings[stringNameSpace] : {},
            this.props.strings
          )
        } else {
          out = _.merge(defaultStrings, this.context.strings[stringNameSpace])
        }
  
  
        console.warn('out')
        console.log(out)
        return out
      }
  
      render() {
        return &lt;WrappedComp strings={this.getStrings()}  {...this.props} /&gt;
  
      }
    }
  }
  </code></pre>
  
  <h2>Component</h2>
  
  <pre><code>import React, { Component } from 'react'
  import { connectStrings } from './../../src'
  import PropTypes from 'prop-types'
  import defaultStrings from './strings'
  
  class SampleComponent extends Component {
    static propTypes = {
      strings: PropTypes.object.isRequired
    }
  
    render() {
      const { strings } = this.props
  console.warn(strings)
      return (
        &lt;div&gt;
          &lt;span&gt;{strings.str1}&lt;/span&gt;
          &lt;span&gt;{strings.str2}&lt;/span&gt;
          &lt;span&gt;{strings.str3}&lt;/span&gt;
        &lt;/div&gt;
      )
    }
  }
  
  export default connectStrings(
    SampleComponent,
    defaultStrings,
    'sampleComponent.ui.SET_TWO'
  )
  </code></pre>
  
  <h2>Unit test to run</h2>
  
  <pre><code>import renderer from 'react-test-renderer'
  import React from 'react'
  import { StringProvider } from '../src'
  import SampleComponent from "../components/sampleComponent";
  describe('String Provider Tests', () =&gt; {
    it('should render', () =&gt; {
      const strings = {
        'sampleComponent.ui.SET_ONE': {
          str1: 'SET ONE'
        },
        'sampleComponent.ui.SET_TWO': {
          str1: 'SP Str1',
          str2: 'SP Str2'
        }
      }
  
      const tree = renderer.create(
        &lt;StringProvider strings={strings}&gt;
          &lt;SampleComponent strings={{str3: 'test'}}/&gt;
  
        &lt;/StringProvider&gt;
      )
  
      expect(tree).toMatchSnapshot()
    })
  })
  </code></pre>
  
  <p>Im not sure what i am missing here, but strings seems to be updated in the connector but not in the component, is there something im not doing correctly?</p>