ER: filter on projects-check page differs from filter on projects page

[roslynwythe]

Emergent Requirement - Problem

Two problems have been noted with the appearance of the filters on the projects-check page. In both cases the correct appearance can be observed on the projects page.

Details

1. The filters on the projects-check page should appear to the left of the project cards, however they are instead center-aligned and the project cards appear below the filters. For the correct appearance see the screenshot of the projects page below.
2. On the projects-check page, on page load the number of displayed filters is limited to eight, however no "View All" link is displayed even if more than eight filters exist.

Note that if more than 8 categores exist in both the Technology and Language groups, it should be possible to view all the filters in both groups at once.

Appearance of filters (incorrect) on Projects-check page

Appearance of filters (correct) on Projects Page

Issue you discovered this emergent requirement in

Date discovered

Did you have to do something temporarily

• YES
• NO

Who was involved

@

What happens if this is not addressed

The projects-check page is not usable since it does not allow all testing of all filter categories.

Resources

• Create a copy of the project page with only two filters: technology and language #2502
• Projects Check page: Webpage | HTML include | JavaScript
• Projects page: Webpage | HTML include | JavaScript
• HTML for the filters on projects page can be found in [current-projects.html]

Recommended Action Items

• Make a new issue
• Discuss with team
• Let a Team Lead know

Potential solutions [draft]

1. Update projects-check.html to incorporate recent changes made to projects.html so that the unintended differences between the projects-check and projects page are resolved. This approach was taken in fix filter on projects-check page  #4850
2. Update projects-check.html to use the same HTML and JavaScript as projects.html, then modify the common JavaScript code to implement distinct filters in the projects-check page based on testing the current page URL. This approach is examined in Refactor HTML and JavaScript so projects and projects-check pages can share the same files #4960

[github-actions]

Hi @roslynwythe, thank you for taking up this issue! Hfla appreciates you :)

Do let fellow developers know about your:-
i. Availability: (When are you available to work on the issue/answer questions other programmers might have about your issue?)
ii. ETA: (When do you expect this issue to be completed?)

You're awesome!

P.S. - You may not take up another issue until this issue gets merged (or closed). Thanks again :)

[roslynwythe]

• Please see the Potential solutions (draft) section in the issue body. I propose that we move forward with prioritizing Refactor HTML and JavaScript so projects and projects-check pages can share the same files #4960 because it offers a solution that is more maintainable.