feat: add animation to notification

[aspnxdd]

Fixes #

Changes

• Adds an animation to the notification component.
• Had to move onClose logic to the component, although it is extracted to a custom hook to handle the removal/destroyal of the component.

Checks

• [x] Have you catchup your branch with the latest state in base?
• [x] Have you lint your code locally prior to submission?
• [x] Have you reviewed your proposed changes and removed debris?
• [x] Have you successfully ran due tests with your changes?

[aspnxdd]

I think there's some changes that could improve this visually. Reduce the timeout bar to half height, the opacity to anything between 0.175 and 0.2 would be better, also get the bar a little lower and apply a overflow hidden so it doesn't look like it's floating in the component. 1 thing more, if we close the notification there won't be any animation?

Please send me the values you think would improve this. I say this because if I reduce the height to 0.2rem (from 0.4rem), opacity to 0.2 and a margin-bottom of -0.05rem with overflow hidden it looks like this and is barely visible: And yes, I added the animation also when clicking the close button, although I had to move the onClose function inside the component.

[aspnxdd]

I do not know if it is correct that when a cm is updated, the notification appears in the middle of the screen, instead of appearing at the bottom right of the screen @aspnxdd

Fixed now. The position was absolute, so if we scrolled down, it seemed like it was in the middle of the screen. I changed it now to fixed so it scrolls down as well and it is kept at the bottom.

[boxfish-bot]

This pull request has been deployed to Vercel.

Latest commit:	1650163
✅ Preview:	https://candy-machine-dashboard-r4kitress-boxfish-studio.vercel.app
🔍 Inspect:	https://vercel.com/boxfish-studio/candy-machine-dashboard/HHdBesJDCcp6tf5UcFkVvPbFapte

View Workflow Logs

[begonaalvarezd]

🙏🏼