iamhosseindhv / notistack

Highly customizable notification snackbars (toasts) that can be stacked on top of each other
https://notistack.com
Other
3.93k stars 298 forks source link

enqeueuSnackbar options.action as a function - failed prop type #121

Closed the-vampiire closed 5 years ago

the-vampiire commented 5 years ago

Not able to use an options.action function property on enqueueSnackbar. Receiving failed prop type warnings

Expected Behavior

from the docs example expected to be able to pass an options.action function of the form

props.enqeueuSnackbar(
  'message',
  {
    action: key => (
      // things to render that consume the key parameter
    );
  }
);

Current Behavior

does not render action return value. receiving the following console warnings:

Failed prop type: Invalid prop `action` supplied to `Snackbar`, expected a ReactNode.

Functions are not valid as a React child.
This may happen if you return a Component instead of <Component /> from render.
Or maybe you meant to call this function rather than return it.

Steps to Reproduce

Link: link to codesandbox example of bug

  1. open the console tab
  2. click the button

also fails when using the actions function defined in the docs (commented out) works if you provide child directly rather than using a callback (commented out)

Context

i would like to use the options.action property to provide a dismiss button to the snackbars

Your Environment

this all took place in the codesandbox example environment linked from the readme. the only changes made were to the App.js file to display the error

iamhosseindhv commented 5 years ago

@the-vampiire Updating notistack version to the latest solved the issue. I'll update package.json for examples as well.