Implement logic to fetch and auto fill career roles

petesfrench commented 1 month ago

to be merged to https://github.com/canonical/canonical.com/pull/1322 or if that has already been merged, to canonical-navigation

Done

Implements a web worker and associated script (fetch-careers-roles.js) to fetch career data in the background on page load (this is because it was quite delayed when fetching on dropdown opening)
Adds 'slug' value to 'careers' in navigation.yaml to associate with the careers data
some minor html and scss changes

QA

Open 'careers' navigation, see that each job role has an associated number of roles. eg. 'Engineering', '20 roles'. You can compare to the live page https://canonical.com/
Check both mobile and desktop

Issue / Card

Fixes https://warthogs.atlassian.net/browse/WD-13581

Screenshots

petesfrench commented 1 month ago

demo link https://canonical-com-1325.demos.haus/

petesfrench commented 1 month ago

thanks @mtruj013 !

I raised the padding issue with design, aligning it with the grid also aligns it with the text and it looks kinda funky
looks like I wasn't referencing the script with an absolute path smh

codecov[bot] commented 1 month ago

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Please upload report for BASE (wd-12670@ed33ffb). Learn more about missing BASE report.

Additional details and impacted files

```diff @@ Coverage Diff @@ ## wd-12670 #1325 +/- ## =========================================== Coverage ? 71.86% =========================================== Files ? 14 Lines ? 1102 Branches ? 0 =========================================== Hits ? 792 Misses ? 310 Partials ? 0 ``` | [Flag](https://app.codecov.io/gh/canonical/canonical.com/pull/1325/flags?src=pr&el=flags&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=canonical) | Coverage Δ | | |---|---|---| | [python](https://app.codecov.io/gh/canonical/canonical.com/pull/1325/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=canonical) | `71.86% <ø> (?)` | | Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=canonical#carryforward-flags-in-the-pull-request-comment) to find out more.

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

canonical / canonical.com