[Feat] Add employee profile page #12371

esizer · 2024-12-24T13:52:39Z

🤖 Resolves #12002

👋 Introduction

Adds the employee profile page with table of contents and initial section.

🕵️ Details

I believe the check for government employee makes sense 🤔 All must be true:

isGovEmployee
workEmail
workEmailisVerified

🧪 Testing

Build pnpm run dev:fresh
Login as any role
Ensure the conditions in details is met for that user
Navigate to /applicant/employee-profile
Confirm it loads and has the appropriate content (minus the forms being created in other tickets)
Update the users in the database to not meet one of the conditions in details
Refresh the page and confirm it shows unauthorized

📸 Screenshot

mnigh · 2024-12-27T20:06:28Z

apps/web/src/utils/userUtils.ts

+  isWorkEmailVerified?: Maybe<boolean>;
+}
+
+export const isVerifiedGovEmployee = ({


@esizer Does this function satisfy the acceptance criteria for #12363 and then allow it to be closed as well?

May need to wait and see. I think to but not 100% sure

I think this does satisfy 12363.

isWorkEmailVerified is computed server-side making it not 100% frontend but I'm not sure if that is a problem. Issue linked has no A/C or details.

petertgiles

Looking good! A few things to check on, though. I've left questions for Josh and Nienke, who will need to approve before merging, too.

apps/web/src/utils/userUtils.ts

apps/web/src/pages/EmployeeProfile/EmployeeProfilePage.tsx

petertgiles · 2025-01-02T14:37:03Z

apps/web/src/pages/EmployeeProfile/EmployeeProfilePage.tsx

+  return (
+    <>
+      <SEO title={pageTitle} description={subtitle} />
+      <Hero title={pageTitle} subtitle={subtitle} crumbs={crumbs} />


In mobile widths, the Hero should be centred. The section headers should be, too.

Hmm, this is just using our base hero/heading components. That would require modifying it specifically for this page which seems odd. I feel like we should either:

Update the base component so we have consistent styles on all pages

Or leave this page alone so we don't have special styles for one page

I vote: leave this page alone so we don't have special styles for one page.

Oh, the hero does go centred on its own. I didn't test narrow enough.

All the admin page refreshes use centred headings in mobile widths. I don't know if this is standard enough to include in the base component or not.

petertgiles · 2025-01-02T14:38:39Z

apps/web/src/pages/EmployeeProfile/EmployeeProfilePage.tsx

+              data-h2-gap="base(x3 0)"
+            >
+              <TableOfContents.Section id={SECTION_ID.CAREER_PLANNING}>
+                <Heading


According to Figma, this should be font-weight 400.

Hmm, I can do that but this is also using the base heading component and we should avoid changing font styles for headings because they need to be consistent for visual users to indicate content hierarchy for accessibility.

Should the heading 2 have 400? If not, I don;'t think we should be messing with font weight since it can gave a negative affect on the sites accessibility.

Unfortunately, the designers have explicitly said there is no standard font weight for a given heading level and should be set on a case-by-case basis.
#11859 (comment)
You could check in with a designer and see if the design could be changed.

For both heading related things:

h1, h2, h3 at a minimum should always be centered on mobile devices

h2s will generally be 400 weight in most cases if you need to set a default on the component - this has been the case for a while in the designs and it's fine to propagate it everywhere.

If we are editing the base component, would it be better to create a separate ticket to fix our base heading? It seems a little out of scope for a basic stub page to affect all other pages.

Sure, I'll write one up. 🙃
#11859

vd1992 · 2025-01-06T17:56:02Z

apps/web/src/pages/EmployeeProfile/EmployeeProfilePage.tsx

+  const pageTitle = intl.formatMessage({
+    defaultMessage: "Your empoloyee profile",
+    id: "HwW7BZ",
+    description: "Page title for a users employee profile",
+  });


Your employee profile*

Good eye, fixed in update copy

NienkeBr · 2025-01-06T18:29:24Z

We'd like to make a change to the copy. Instead of "talent mobility preferences", we want to use "career development preferences".

Could you please update this in the table of content?
- EN: Career development preferences
- FR: Préférences en matière de développement de carrière
Could you also update this in the page description?
- EN: Manage your government employee information, including career development preferences and work styles.
- FR: Gérez vos renseignements d’employée ou d’employé du gouvernement, y compris vos préférences en matière de développement de carrière et les façons de travailler.

esizer · 2025-01-06T20:12:13Z

We'd like to make a change to the copy. Instead of "talent mobility preferences", we want to use "career development preferences".

Yup! We have done that as part of update copy

petertgiles · 2025-01-07T14:47:53Z

I think it's just the header font-weight and centering on mobile left.

esizer · 2025-01-07T14:49:19Z

I think it's just the header font-weight and centering on mobile left.

Sorry, I thought we planned on doing that as a separate ticket to fix the underlying components instead of doing single page overrides (something we should be avoiding).

petertgiles · 2025-01-07T14:55:00Z

Let's make a decision in standup today.

esizer · 2025-01-07T19:19:25Z

Let's make a decision in standup today.

okay, based on decision during stand up, I have added in the overrides: override heading

esizer added 2 commits December 23, 2024 12:09

add stub page for employee profile

bdebdff

add table of contents

3efec5b

mnigh reviewed Dec 27, 2024

View reviewed changes

add translations

bb06028

petertgiles self-requested a review January 2, 2025 13:59

petertgiles requested changes Jan 2, 2025

View reviewed changes

esizer added 2 commits January 6, 2025 11:44

add error message to employee auth error

24895da

fix breadcrumb link label

8d5cd48

vd1992 reviewed Jan 6, 2025

View reviewed changes

update copy

2af1dcd

esizer added 3 commits January 7, 2025 09:17

add translations

9268040

Merge branch 'main' into 12002-employee-profile-page

aca9b09

clean translations

d9e6321

esizer requested a review from petertgiles January 7, 2025 14:36

override heading

85e2a30

petertgiles approved these changes Jan 7, 2025

View reviewed changes

esizer added this pull request to the merge queue Jan 7, 2025

Merged via the queue into main with commit c49a4e4 Jan 7, 2025
15 checks passed

esizer deleted the 12002-employee-profile-page branch January 7, 2025 19:26

esizer mentioned this pull request Jan 7, 2025

✨ Create Add isVerifiedGovEmployee frontend utility function (hook?) #12363

Closed

mnigh mentioned this pull request Jan 14, 2025

[Feature] Adds Employee Profile Goals and Work Style form #12433

Merged

brindasasi mentioned this pull request Jan 20, 2025

🐛 Employee Profile form cannot be saved #12534

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Feat] Add employee profile page #12371

[Feat] Add employee profile page #12371

esizer commented Dec 24, 2024

mnigh Dec 27, 2024

esizer Dec 27, 2024

petertgiles Jan 2, 2025

vd1992 Jan 6, 2025

petertgiles left a comment

petertgiles Jan 2, 2025

esizer Jan 3, 2025

mnigh Jan 3, 2025

petertgiles Jan 3, 2025

petertgiles Jan 2, 2025

esizer Jan 3, 2025

petertgiles Jan 3, 2025

JoshBeveridge Jan 6, 2025

esizer Jan 6, 2025

petertgiles Jan 6, 2025

vd1992 Jan 6, 2025

esizer Jan 6, 2025

NienkeBr commented Jan 6, 2025 •

edited

Loading

esizer commented Jan 6, 2025

petertgiles commented Jan 7, 2025

esizer commented Jan 7, 2025

petertgiles commented Jan 7, 2025

esizer commented Jan 7, 2025

[Feat] Add employee profile page #12371

[Feat] Add employee profile page #12371

Conversation

esizer commented Dec 24, 2024

👋 Introduction

🕵️ Details

🧪 Testing

📸 Screenshot

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

petertgiles left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

NienkeBr commented Jan 6, 2025 • edited Loading

esizer commented Jan 6, 2025

petertgiles commented Jan 7, 2025

esizer commented Jan 7, 2025

petertgiles commented Jan 7, 2025

esizer commented Jan 7, 2025

NienkeBr commented Jan 6, 2025 •

edited

Loading