MA
Add notification UI
maybe-finance/maybe#449

Resolves #447 /claim #447

This approach uses a simple stimulus controller to remove the element after the animation has completed.

Notifications can be generated by simply rendering a notification helper anywhere within the application, this could be in a view, as a turbo stream response, or over a turbo stream subscription. By default Rails flash messages types are mapped to notification types, icons for additional types can easily be added in future.

It supports multiple notifications at once, by stacking them in a notification-tray element.

The video below demonstrates the default flash messages in action, and then I update the code to force some hardcoded notifications where the type is passed as error or success.

https://github.com/maybe-finance/maybe/assets/1793797/a17f7e7f-e647-4250-b64e-bb3964cdda81

The circle is animated with CSS also using an SVG animation stroke fill animation technique (https://css-tricks.com/svg-line-animation-works/)

Claim

Total prize pool $50
Total paid $50
Status Approved
Submitted February 12, 2024
Last updated February 13, 2024

Contributors

JO

Josh Brown

@JoshAntBrown

100%

Sponsors

MA

Maybe

@maybe-finance

$50 paid