[US - DEV] As AMELIA HARRIS, I want to get to a “page not found” error page when trying to access an idea page that was deleted.

[alicefate]

Considerations:

We would like to create a temporary error page (maybe a 404 error page? See below an example) to cover the scenario of Amelia (the Idea workshopper) or Frank (our supplementary persona: The mentor / project lead) trying to access by URL an idea that was deleted by Miles, the idea owner.

We talked with the Universal design and the Product Enablement teams and they might design a better and nicer design for this type of error pages but we would like to develop something temporary for our product.

Please check below references of the current behavior and an idea of what we would expect to develop.

Acceptance criteria:

• When trying to access by URL an idea that was deleted, Amelia and Frank will be redirected to an error page telling them the page (or idea) doesn’t exist.

---

Sub-tasks:

• [x] Development
• [x] QA

---

Current behavior in IdeaSpace when you try to access an idea that doesn't exists: a loader appears and we keep waiting.

https://images.zenhubusercontent.com/225525029/858d3dcd-8026-4fe3-813f-ae8278c459db/current_behavior_when_trying_to_access_a_wrong_url___15_april_2023.mp4

Expected behavior: An example of what happens currently in some of Dev Launcher's pages when you try to access a wrong URL and what we could replicate for IdeaSpace:

An example of a well designed 404 error page as a good practice: https://tsparticles.github.io/404-templates/space/404.html

[JulieMass]

Hey team! Please add your planning poker estimate with Zenhub @alicefate @dbradham @jordanmcousins @JulieMass @katehirschman @Nouri-Anouar @rashikashaw @RETprojects

[JulieMass]

Hey @alicefate I just noticed we missed adding a final estimate to this ticket. Can you please add it?

[JulieMass]

Thank you @alicefate for adding the final estimate =)

[JulieMass]

@dbradham I'm moving this ticket back to the backlog (WIP column) for another developer to pick up because it doesn’t match the DoD. The error page shows up, but it doesn’t have the right look and feel according to the acceptance criteria. Below is a screenshot of what I see in both global staging and production. Please let me know your thoughts on this.

[JulieMass]

Hi @Rutuja177 ,

I've assigned this ticket to you. Please review the comment I left above, which explains why we had to move this ticket back to our product backlog.

Also, feel free to update the final estimation if you think it should be higher. However, if the current estimate is still accurate, let's keep it as is. This will allow us to consider the work that Iris initially put into this task.

Thank you again for taking on this task.

Let me know if you have any other questions!

[JulieMass]

Hi @Rutuja177 Friendly reminder to please update this ticket's status whenever you have a moment because it is still in the "product backlog" column 🙈. Thank you!

[JulieMass]

(CC. @chungthuang @Enjoy2Live)

Hey @Nouri-Anouar ,

Just wanted to let you know that our team worked on a new error page using the current 404 error from the Dev Launcher which is very basic and doesn’t have the best UX. I remember you were still part of our team when we created this ticket, so when we asked the Universal Design team if they had a design for it (Anna was leading it), they told us to just come up with something temporary as there wasn’t any design yet.

Anyway, we just wanted to share this with you in case it's something that could be included in the design system backlog. It's not urgent or anything for us as we just went with the existing 404 design for now, but thought it could be a good addition to the design system as error pages are a great key moment in the UX to turn something not so good as receiving an error, into something good that could even be fun!

[Enjoy2Live]

leaving this to developers wanting to implement 404 page.

https://eke.hashnode.dev/how-to-create-a-custom-404-page-in-nextjs

I don't know if nextjs enables you to have custom 404 page depending on the route you're in (for example /ideaspace) or it's universally applied to the whole website but if it was the latter maybe we should craft it in a way the isn't too specific to ideaspace

[Nouri-Anouar]

(CC. @chungthuang @Enjoy2Live)

Hey @Nouri-Anouar ,

Just wanted to let you know that our team worked on a new error page using the current 404 error from the Dev Launcher which is very basic and doesn’t have the best UX. I remember you were still part of our team when we created this ticket, so when we asked the Universal Design team if they had a design for it (Anna was leading it), they told us to just come up with something temporary as there wasn’t any design yet.

Anyway, we just wanted to share this with you in case it's something that could be included in the design system backlog. It's not urgent or anything for us as we just went with the existing 404 design for now, but thought it could be a good addition to the design system as error pages are a great key moment in the UX to turn something not so good as receiving an error, into something good that could even be fun!

Thank you for the reminder, Julie! I have created a ticket on our backlog and we will address it in future sprints. #1764

[JulieMass]

leaving this to developers wanting to implement 404 page.

https://eke.hashnode.dev/how-to-create-a-custom-404-page-in-nextjs

I don't know if nextjs enables you to have custom 404 page depending on the route you're in (for example /ideaspace) or it's universally applied to the whole website but if it was the latter maybe we should craft it in a way the isn't too specific to ideaspace

Hey this is really cool! thank you Mohammed for sharing this!

[JulieMass]

(CC. @chungthuang @Enjoy2Live) Hey @Nouri-Anouar , Just wanted to let you know that our team worked on a new error page using the current 404 error from the Dev Launcher which is very basic and doesn’t have the best UX. I remember you were still part of our team when we created this ticket, so when we asked the Universal Design team if they had a design for it (Anna was leading it), they told us to just come up with something temporary as there wasn’t any design yet. Anyway, we just wanted to share this with you in case it's something that could be included in the design system backlog. It's not urgent or anything for us as we just went with the existing 404 design for now, but thought it could be a good addition to the design system as error pages are a great key moment in the UX to turn something not so good as receiving an error, into something good that could even be fun!

Thank you for the reminder, Julie! I have created a ticket on our backlog and we will address it in future sprints. #1764

Thank you Anwar!

[JulieMass]

Hey @Rutuja177 ! Thanks for updating the ticket but just a heads up: once your tickets are ready for Dave to check, you should move them to the QA column so he can test them. Then, he'll move it to the "review" or "done" column accordingly. And once a ticket is in "done", I, as the product owner, can check the ticket's acceptance criteria and verify in staging that things are working and if so, close the ticket. It's the product owner's job to check and close tickets. So I'll reopen it and move it to QA. Has Dave checked this in staging or production yet?

[dbradham]

@JulieMass waiting on a final step to get this deployed to staging now.

[dbradham]

I'm able to access a deleted idea here- @Rutuja177