schiehll / react-alert

alerts for React
MIT License
608 stars 98 forks source link

Added the possibility to show alerts in multiple positions simultaneously #91

Closed besLisbeth closed 5 years ago

besLisbeth commented 6 years ago

Hi,

I'm using your library from the second version and noticed that it's not possible to set the position to alert individually. I do not know if you want to add such functionality to your library, but I will be pleased if you could do so.

What did I change - I grouped alerts by the position option, which are passed to show (success, info, error) method and created the needed amount of the Wrapper components based on this groups. That gave the possibility to show alerts in all positions which are supported by your library.

I also correct your test file according to changes.

emmya commented 5 years ago

+1! It would also be great to customize the wrapper styles. I don't want alerts to expand to the width of the wrapper, but if i want alerts to be top right aligned, I'd need the wrapper to have text-align: right in order for all alerts to be positioned properly.

besLisbeth commented 5 years ago

@emmya, if I correctly understand the issue, it's better to pass text-align: right directly to the AlertTemplate. It can be achieved by creating your custom AlertTemplate and passing it to the AlertProvider.

schiehll commented 5 years ago

Hey @besLisbeth thank you so much for the idea and for take the time to submit a PR!

Sorry for the long time without a response.

So, inspired by this PR, in the new version (v5) is now possible to use multiple Providers with different Contexts, which cover this use case without the overhead for the most common one (where all the alerts have the same behaviour).

You can take a look here for an example.

I also noticed that you was taking the time to help people here in the issues, so thank you again!!

If it's ok with you, I would like to give you access to the repo so you can close issues, etc, on your own.

Send me a email or something if you are interested.