Alert Message is showing after coming back to the Page.

[MuhammadAakash]

Description

Alert message "Signed in Successfully" or " Signed out successfully" is not hidden if we come again to the page we are redirected to after login or logout =.

Reproduction Steps

• Go to if-me website and perform login or logout on the site
• And after logging in or logging out go to any other page.
• Now please come back to the previous page.
• And on this page, you are showing the Alert message again.

Screenshots or Video Link

Video Link: https://loom.com/share/8fb4c43818054e71a8ac79deb42e4cf0

---

Please assign yourself (via the Assignees dropdown), if you do want to work on this issue. Can't find yourself? You need to join our organization.

Check out our Picking Up Issues guide if you haven't already!

[welcome]

Thank you for opening this issue with us! If you haven't already, please follow these next steps to officially join our contributor community.

[MuhammadAakash]

@julianguyen Pleas review this whether it's a bug or not

[julianguyen]

Yes, it's a minor bug! Thanks again for finding this and documenting it!

[MuhammadAakash]

@julianguyen
According to me, the solution is that the Toast message will be hidden after 5 to 10 seconds.

[uzorjchibuzor]

@MuhammadAakash you should maybe look at where the flash message is coming from, I am flying blind here but that is where I check first.

[julianguyen]

@MuhammadAakash I could see a toast message working here, but I think we should build this reusable component thoughtfully. I recommend it being a React component and that there's the ability to dismiss the message manually. We'll also want to notify the user through aria labels that the Toast message will be automatically hidden (this is necessary for screen-reader users).

Before we pursue that, can we just look at hiding the message after the page is initially viewed?

[MuhammadAakash]

I have just seen the code where it's implemented and it is implemented in alert.erb file.

And about hiding that toast, according to me it is only possible by setting the display of container to none after some time.

[uzorjchibuzor]

I have just seen the code where it's implemented and it is implemented in alert.erb file.

And about hiding that toast, according to me it is only possible by setting the display of container to none after some time.

Display: none might end up messing with the UX, use :hidden instead.

[MuhammadAakash]

I have just seen the code where it's implemented and it is implemented in alert.erb file.
And about hiding that toast, according to me it is only possible by setting the display of container to none after some time.

Display: none might end up messing with the UX, use :hidden instead.

Yeah that is better

[MuhammadAakash]

@sfayyad Please go ahead and solve this issue according to the condition which is currently required (Making the div hidden after 5 seconds + add a simple cross icon and on that icon also calls the functions which can hide the div).

As I got some time I will make a separate react component for the toast message.

[zeeshansarwar38]

@sfayyad Are you working on this issue? If you aren't working then I'm ready to work on this. Please @julianguyen @MuhammadAakash @uzorjchibuzor assign this issue to me.

[uzorjchibuzor]

@zeeshansarwar38 if the current assignee confirms that they are not working on it, they you may assign yourself.

[MuhammadAakash]

@zeeshansarwar38 thanks for showing interest in contributing to if-me.
Let's get the confirmation from @sfayyad. or if maybe she didn't respond till next 7 days then you can assign yourself to this issue.

[MuhammadAakash]

@zeeshansarwar38 Please go ahead with the issue as @sfayyad is not being online for around 20 days.
and if you need any help please reach out to slack.

[zeeshansarwar38]

@zeeshansarwar38 Please go ahead with the issue as @sfayyad is not being online for around 20 days. and if you need any help please reach out to slack.

Sure, thanks.

[zeeshansarwar38]

Hi @julianguyen
I have submitted a PR for this issue. Please review #2210