schiehll / react-alert

alerts for React
MIT License
607 stars 99 forks source link

Always get a copy of alerts in withAlert() #64

Closed guludo closed 6 years ago

guludo commented 6 years ago

Otherwise any withAlert() component that is not the first one will keep the reference to an out of date list of alerts and show them when its render method is evetually called. That can be reproduced with the following code:

import React, { Component, Fragment } from 'react'
import { withAlert } from 'react-alert'

const Foo = ({alert}) => (<button onClick={() => { alert.info('Foo') }}>Foo</button>);
const FooWithAlert = withAlert(Foo);

const Bar = ({ alert }) => (<button onClick={() => { alert.info('Bar') }}>Bar</button>);
const BarWithAlert = withAlert(Bar);

class Home extends Component {
  state = { now: Date.now() }

  render () {
    return (
      <div>
        <FooWithAlert />
        <BarWithAlert />
        <br />
        <button onClick={() => {this.setState({ now: Date.now() })}}>
          Render wrapping component
        </button>
      </div>
    )
  }
}

export default Home
guludo commented 6 years ago

This fixes #63

schiehll commented 6 years ago

Awesome job @guludo! Thank you for find a fix as well as submitting the issue! I will be publishing a new version with your fix today.

guludo commented 6 years ago

Thanks!