TheOdinProject / theodinproject

Main Website for The Odin Project
http://www.theodinproject.com
MIT License
3.56k stars 2.06k forks source link

Add “Continue” button and badge for selected path #4495

Closed drewstroshine closed 1 month ago

drewstroshine commented 3 months ago

Checks

Bug description

When clicking the "Resume" button on the https://www.theodinproject.com/paths page, it navigates to the course page instead of the last worked on and uncompleted lesson page. The "Resume" button is performing the same behavior as the "View" button. This is in contrast to the "Resume" button on the https://www.theodinproject.com/dashboard page which is working as intended and navigating to that last worked on and uncompleted page.

How to reproduce

  1. Sign in
  2. Navigate to the https://www.theodinproject.com/paths page either by clicking the "View Full Curriculum" button or the "All Path" link in the header
  3. Click the "Resume" button of a path currently in progress and with at least one completed lesson
  4. The "Resume" button navigates to the course page of the path and not the lesson currently being worked on

Expected behavior

  1. Sign in
  2. Navigate to the https://www.theodinproject.com/paths page either by clicking the "View Full Curriculum" button or the "All Path" link in the header
  3. Click the "Resume" button of a path currently in progress and with at least one completed lesson
  4. The "Resume" button navigates to the lesson currently being worked on

What browsers are you seeing the problem on?

Chrome, Safari

What OS are you using?

MacOS

Discord Name

No response

Additional Comments

It appears the "Resume" button on the https://www.theodinproject.com/dashboard page is working as expected so if that same behavior could be transferred to the "Resume" button on the https://www.theodinproject.com/paths page then that might easily fix the bug.

KevinMulhern commented 2 months ago

Thanks for making this issue. This isn't a bug, its intended behaviour on our Paths page. We use "Resume" instead of "View" to indicate which path the learner has selected. But, this has been brought up before https://github.com/TheOdinProject/theodinproject/issues/3230, so I wouldn't be against finding a better, less confusing way to differentiate a selected path from the rest - if anyone has any good ideas?

MaoShizhong commented 2 months ago

Perhaps going back to "View" but having a marker of some sort (e.g. "Currently selected") on a selected pathway card?

drewstroshine commented 2 months ago

What if for a selected path, there is only one "Continue" button instead of the "Resume" and "View" button? My thinking is the "Continue" button would differentiate it from the "Resume" button on the Dashboard page, and it would signify continuing on your path vs resuming your progress on your course?

image
davidha99 commented 2 months ago

Perhaps adding a "Selected" flag on the corner? Like this:

image

I think @drewstroshine idea is also cool.

KevinMulhern commented 2 months ago

What if for a selected path, there is only one "Continue" button instead of the "Resume" and "View" button? My thinking is the "Continue" button would differentiate it from the "Resume" button on the Dashboard page, and it would signify continuing on your path vs resuming your progress on your course?

This sounds solid, I really like the thought process behind this.

I like the idea of combining "Continue" with a marker/flag - We have a badge component we could use. One of the top corners or beside the title could work:

Screenshot 2024-04-16 at 18 21 36 Screenshot 2024-04-16 at 18 20 54

Although, that might be overkill if "continue" differentiates it enough?

MaoShizhong commented 2 months ago

I like the idea of both the lone "continue" button and the "selected" badge (either placement looks :fire:)

davidha99 commented 2 months ago

I like the idea of both the lone "continue" button and the "selected" badge (either placement looks 🔥)

I like that idea too

drewstroshine commented 2 months ago

I like the idea of both the lone "continue" button and the "selected" badge (either placement looks 🔥)

I like that idea too

Same here 👍

davidha99 commented 2 months ago

I see there's no one assigned to this issue, I'll be happy to work on this

KevinMulhern commented 2 months ago

Thanks @davidha99, I've assigned it to you.