Origin: Replace alerts() with styled message boxes

[wanderingstan]

We need a way to show non-modal messages/errors to user.

overlay.js can show a message and prevent any user interaction (modal).

But we need a way to show other messages but allow continued user action on the page. For example, when the selected listing upload is too large: https://github.com/OriginProtocol/demo-dapp/blob/master/src/components/listing-create.js#L90
There will surely be more of these.

Aure will work on a design, though something like the design here would get us started:
https://codeburst.io/displaying-error-messages-in-react-with-a-higher-order-component-hoc-fe2de074bf64

[ryana]

I've used this before http://alertifyjs.com -- I really like it. It can replace alerts/confirms (blocking) and it can display disappearing notices (error, warnings, info).

[joshfraser]

+1 for Alertify. It's what we're using for notifications on originprotocol.com already, so the consistency would be nice.

[rvenugopal]

Please assign to me. thx

[wanderingstan]

Hey @rvenugopal are you still working on this?

EDIT: Github sadly doesn't allow us to add non-members to an issue, so we just have to coordinate in comments.

[rvenugopal]

@wanderingstan Sorry i got sidetracked into learning solidity. Can you give me a couple more days to work on this? Sorry for the delay.

[rvenugopal]

@wanderingstan Please re-assign this issue. I don't have time to work on this right now.

[wanderingstan]

No worries, @rvenugopal !

[micahalcorn]

@wanderingstan as it turns out, "alertify" could mean a few different things.

1) The original library is no longer maintained. This is the one that is currently being used in the company-website. It is available as a node_module, but it sets alertify as a global variable (or supports AMD) and does not export anything in the ES6 style.

2) A self-described "extreme makeover" fork linked above, which deviates quite a bit from the original API. It is available as a node_module, and it can be imported.

3) A fork with an API more similar to the original but not enough to be able to use the same stylesheet in both repos (or even really the same function calls). It is available as a node_module and can be imported.

So is it beneficial for the style and UX to match the other repo? If so, do we configure Webpack to import a fixed Javascript file and a global alertify or do we configure it to play nice with AMD? And whether or not the two repos need to match, does it make sense to choose a fork and move forward with it?

[ryana]

My vote is for the no longer maintained one. It's been working fine for me in several projects.

[wanderingstan]

I'm fine with using the old one too.

Sure, we may need something fancier in the future, but no need to over-complicate until we have better sense of what we need.

[wanderingstan]

@micahalcorn You've fixed this ages ago, right? I'm going to close it--shout if it should be re-opened.