Make the quarters offered tooltip more useful

[ptruong0]

Description

Changed the colored dots to emojis that represent the quarter, and used the previous academic year (e.g. fall 2022 & winter/spring/summer 2023) instead of 2020. Inside the tooltip on hover, added a chart that shows the frequencies of each term in the past. Also added the tooltips to the course page and the course cards on the roadmap page.

Screenshots

Tooltip on hover

Not offered in the previous year

No recent term data

Course page

Roadmap page

Steps to verify/test this change:

• Verify changes work as expected on staging instance

Final Checks:

• Verify successful deployment

(optional)

• Write tests
• Write documentation

Issues

Closes #295

[js0mmer]

LGTM! Excited for this feature. I want to wait for the api team to fix the terms list before we merge though.

Note: I see that the chart is mostly copy/pasted from the gradedist. This is fine for now. In the future, we probably want to refactor to eliminate redundancy (and switch from class component to functional).

[js0mmer]

Looks like we're good to go.

[ptruong0]

LGTM! Excited for this feature. I want to wait for the api team to fix the terms list before we merge though.

Note: I see that the chart is mostly copy/pasted from the gradedist. This is fine for now. In the future, we probably want to refactor to eliminate redundancy (and switch from class component to functional).

Yeah, I was wondering why that component in particular was a class component. I just copied over the component instead of reusing because there were a lot of small chart settings that I changed