[Feature] Account settings page

[yonikid15]

🤖 Resolves #9556

👋 Introduction

• Adds account settings page

🕵️ Details

Add any additional details that could assist with reviewing or testing this PR.

🧪 Testing

Assist reviewers with steps they can take to test that the PR does what it says it does.

1. Go to http://localhost:8000/en/applicant/settings
2. Ensure page looks and functions correctly

[mnigh]

Not sure if this PR is still being worked on, but some initial suggestions and questions.

1. GCKey should not have a space, REF: https://www.btb.termiumplus.gc.ca/tpv2alpha/alpha-eng.html?lang=eng&i=1&srchtxt=GCKEY&codom2nd_wet=1#resultrecs

2. NotificationSettings section, according to the linked issue, should be behind a feature flag (I would guess FEATURE_NOTIFICATIONS)

3. Notification settings are not being saved in the database

[yonikid15]

Not sure if this PR is still being worked on, but some initial suggestions and questions.

1. GCKey should not have a space, REF: https://www.btb.termiumplus.gc.ca/tpv2alpha/alpha-eng.html?lang=eng&i=1&srchtxt=GCKEY&codom2nd_wet=1#resultrecs

I just followed the design 😭 I'll make the change

2. NotificationSettings section, according to the linked issue, should be behind a feature flag (I would guess FEATURE_NOTIFICATIONS)

Thanks I missed that!

3. Notification settings are not being saved in the database

I think I fixed that now? Were you referring to just the job alert email setting or all the settings aren't saving?

[esizer]

I notice two things.

1. Mobile layout could possibly use some work
2. I can't seem to actually click the checkboxes, just next to them 😕

2024-04-30_13-42-22.mp4

[yonikid15]

I notice two things.

1. Mobile layout could possibly use some work

2. I can't seem to actually click the checkboxes, just next to them 😕

@esizer
Ya I'll try adding padding to the mobile layout.
For, clicking the checkboxes are you sure you can't click them? I'm seeing the same effect across the app where the pointer is only working around the checkboxes, but I can definitely click them.

Personal.information._.GC.Digital.Talent.Firefox.Developer.Edition.2024-04-30.15-31-38.mp4

[esizer]

For, clicking the checkboxes are you sure you can't click them? I'm seeing the same effect across the app where the pointer is only working around the checkboxes, but I can definitely click them.

I can in chrome but in firefox it is kinda tricky and not a great experience. This is an issue with the base component but the removal of a label exacerbates the issue. Also, without the label, these checkboxes are not great when you are using a zoom tool. As you can see, I just see a checkbox with no context when a zoom tool is enabled which is a less than great experience.

[yonikid15]

For, clicking the checkboxes are you sure you can't click them? I'm seeing the same effect across the app where the pointer is only working around the checkboxes, but I can definitely click them.

I can in chrome but in firefox it is kinda tricky and not a great experience. This is an issue with the base component but the removal of a label exacerbates the issue. Also, without the label, these checkboxes are not great when you are using a zoom tool. As you can see, I just see a checkbox with no context when a zoom tool is enabled which is a less than great experience.

Hmm, ya that is a problem. I can't really do anything about that with this design. @substrae Can we change the design to add the labels next to the checkbox instead?

[tristan-orourke]

If there are issues with the base checkbox component (pointer, zooming) let's make a new ticket and keep them out-of-scope for this PR.

[tristan-orourke]

Also, I'm not particularly concerned about the zooming. If we're using columns correctly now, this is basically a small table, where it's natural that you might have to pan a bit to git the full context of any given cell.

[yonikid15]

I got a new mobile design for the Notifications Section from @substrae
Design:

I pushed a commit 5280bc5 that makes those changes. Please take a look and let me know if it's correct @tristan-orourke

Screenshot:

someone else approved