upcoming: [M3-7716] - Add session expiry confirmation dialog for proxy users #10152

jaalah-akamai · 2024-02-06T19:01:50Z

Description 📝

When a proxy user wants to switch back to their parent account, the parent account's authentication token must still be valid in order for them to switch back to the parent's account or log into any other proxy accounts displayed in the drawer.

If the parent token is not valid, a proxy user should be given adequate notice that they must re-log in to the parent account. We also will disabled the "Switch Account" buttons if this is the case.

Changes 🔄

Updated the useDialogContext.ts hook API. The original API was kind of rigid, whereas now we can have dynamic state that we can extend if we need to. The original API and references to open and closed still work, but I will clean that up after this PR.

useDialogContext({
    continueSession: false,
    isOpen: false,
});

Added SwitchAccountSessionDialog.tsx for when parent session expires
Added useParentTokenManagement.tsx for checking expiration and showing dialog. We still may need to poll the expiry or at least check every time the user menu opens or a user lands on the account page.
Improved isRestrictedGlobalGrantType to take into consideration account_access which can be null | 'read_only' | 'read_write'

Preview 📷

Screenshots

How to test 🧪

Should NOT show session expired dialog

Prerequisites

Turn on MSW and Parent/Child feature flag
By default you should be a parent user, if not, update: serverHandlers

Reproduction steps

Open user menu
Click Switch Account button
Select a child company

Verification steps

Observe parent/proxy tokens are created in local storage
Set user_type to proxy in serverHandlers
Observe no dialog appears since we have an active parent token

Should show session expired dialog

Prerequisites

Clear application cookies
Turn on MSW and Parent/Child feature flag
Set user_type to proxy in serverHandlers

Reproduction steps

Since there is no parent token defined, it's invalid and you should see the dialog

Verification steps

Close the dialog and observe that it should not appear again
Observe that both "Switch Account" buttons in user menu and account page are disabled

As an Author I have considered 🤔

Check all that apply

jaalah-akamai · 2024-02-06T19:03:19Z

packages/manager/src/MainContent.tsx

-                isSideMenuOpen={!desktopMenuIsOpen}
-                openSideMenu={() => toggleMenu(true)}
-                username={username}
+      <SwitchAccountSessionProvider value={switchAccountSessionContextValue}>


Only change here was adding the Provider wrapper (rest is context shift)

jaalah-akamai · 2024-02-06T19:04:34Z

packages/manager/src/context/useDialogContext.ts

+    () => setState((prevState) => ({ ...prevState, isOpen: true })),
+    []
+  );
+  const close = useCallback(


Added TODO since open and close are no longer necessary, but I didn't want to break existing API.

jaalah-akamai · 2024-02-06T19:05:23Z

packages/manager/src/context/useDialogContext.ts

+  [key: string]: boolean;
+};
+
+export const defaultContext: DialogContextProps = {
  close: () => void 0,
  isOpen: false,
  open: () => void 0,


We'll be able to remove these 3 as well in upcoming PR

jaalah-akamai · 2024-02-06T19:07:25Z

packages/manager/src/features/Account/SwitchAccounts/useParentTokenManagement.tsx

+    }
+  }, [isParentTokenExpired, sessionContext]);
+
+  return { isParentTokenExpired };


Open to input/thoughts here

…alog

github-actions · 2024-02-06T19:25:29Z

Coverage Report: ✅
Base Coverage: 81.13%
Current Coverage: 81.14%

hana-akamai

If a user is able to continue working on an account with an expired parent token, I think it would make more sense to only display this dialog when they try to switch accounts?

packages/manager/src/features/Account/SwitchAccounts/useParentTokenManagement.tsx

jaalah-akamai · 2024-02-08T19:20:12Z

If a user is able to continue working on an account with an expired parent token, I think it would make more sense to only display this dialog when they try to switch accounts?

The goal was to prevent users from attempting to switch accounts once the token expired - so the Switch Account button would be disabled at expiry. I'll spend some more time thinking about the UX, but that was the intention.

hana-akamai · 2024-02-08T20:28:41Z

@jaalah What if we don't disable the Switch Account button at expiry but just have it open the session expiry confirmation dialog instead? That way the dialog doesn't display when the user isn't trying to switch accounts but still prevents users from switching accounts

jaalah-akamai · 2024-02-08T21:38:24Z

@hana-linode 🙌

reviewupdates.mp4

jaalah-akamai · 2024-02-08T21:41:47Z

I'm keeping things in context because we're going to implement a way to refresh parent tokens as expiry nears an end, so I'll swap the dialog and save me some work.

hana-akamai · 2024-02-09T16:06:33Z

Liking this flow a lot better. I was thinking we can keep the Switch Account buttons enabled even after the user hits close. And just keep having the button open the session expiry confirmation dialog until they re-login to the parent account

Screen.Recording.2024-02-09.at.11.02.09.AM.mov

mjac0bs · 2024-02-09T16:35:08Z

Liking this flow a lot better. I was thinking we can keep the Switch Account buttons enabled even after the user hits close

Hmm, I agree with this too. We're currently doing a bit of both flows when we only disable after the first click of the button/appearance of the dialog, which feels like an odd UX. It'd be more consistent to either (1) always allow the user to click the enabled button and see the modal or (2) always disable the buttons, which was the original behavior but I think Hana's suggestion is better -- less intrusive for the user.

A minor note: if the parent token is expired and if the parent profile request is not cached, then we might end up with the parent username no longer displaying in the user menu above the company name.

jaalah-akamai · 2024-02-09T20:36:51Z

@hana-linode @mjac0bs ✅ thanks for feedback!

mjac0bs

Thanks for addressing the changes - the expiry dialog looks good and is displayed for a proxy user clicking either Switch Account button who doesn't have a valid parent token in local storage.

Left a few comments about minor clean up - mostly related to naming, a couple related to the tooltip we were displaying when disabling the button.

packages/manager/.changeset/pr-10152-upcoming-features-1707246537679.md

packages/manager/src/features/Account/AccountLanding.tsx

packages/manager/src/features/Account/SwitchAccounts/useParentTokenManagement.tsx

packages/manager/src/features/TopMenu/UserMenu/UserMenu.tsx

packages/manager/src/mocks/serverHandlers.ts

packages/manager/src/features/Account/utils.ts

…537679.md Co-authored-by: Mariah Jacobs <114685994+mjac0bs@users.noreply.github.com>

Co-authored-by: Mariah Jacobs <114685994+mjac0bs@users.noreply.github.com>

jaalah added 4 commits February 5, 2024 22:24

feat: [M3-7716] - Add session expiry confirmation dialog

61cc974

feat: [M3-7716] - Add session expiry confirmation dialog

bc8b9ff

Saving...

55ecc91

Update test

883c1fe

jaalah-akamai requested a review from a team as a code owner February 6, 2024 19:01

jaalah-akamai requested review from jdamore-linode and hana-akamai and removed request for a team February 6, 2024 19:01

jaalah-akamai self-assigned this Feb 6, 2024

jaalah-akamai requested a review from mjac0bs February 6, 2024 19:02

jaalah-akamai added the Parent / Child Account label Feb 6, 2024

jaalah-akamai commented Feb 6, 2024

View reviewed changes

jaalah added 2 commits February 6, 2024 14:08

Delete file

87d83e4

Added changeset: feat: [M3-7716] - Add session expiry confirmation di…

f8c00cc

…alog

hana-akamai reviewed Feb 7, 2024

View reviewed changes

packages/manager/src/features/Account/SwitchAccounts/useParentTokenManagement.tsx Outdated Show resolved Hide resolved

jaalah added 2 commits February 8, 2024 14:21

Review updates

27a85e6

Review updates

7f986f7

jaalah added 2 commits February 8, 2024 16:17

Open menu on click

64b1067

Review updates

bd4d9cc

Review updates

4f83961

jaalah added 2 commits February 9, 2024 14:31

No longer need this test

7b7ac4f

Fix conflict - get latest

b72e574

mjac0bs reviewed Feb 12, 2024

View reviewed changes

jaalah-akamai and others added 3 commits February 12, 2024 16:13

Update packages/manager/.changeset/pr-10152-upcoming-features-1707246…

4f7e8c5

…537679.md Co-authored-by: Mariah Jacobs <114685994+mjac0bs@users.noreply.github.com>

Update packages/manager/src/features/Account/utils.ts

f0d81d2

Co-authored-by: Mariah Jacobs <114685994+mjac0bs@users.noreply.github.com>

Review updates

80aac99

jaalah-akamai added the Ready for Review label Feb 12, 2024

mjac0bs approved these changes Feb 12, 2024

View reviewed changes

mjac0bs added the Add'tl Approval Needed Waiting on another approval! label Feb 12, 2024

hana-akamai approved these changes Feb 13, 2024

View reviewed changes

hana-akamai added Approved Multiple approvals and ready to merge! and removed Add'tl Approval Needed Waiting on another approval! labels Feb 13, 2024

mjac0bs removed the Ready for Review label Feb 13, 2024

jaalah-akamai merged commit 22eb025 into linode:develop Feb 13, 2024
18 checks passed

This was referenced Feb 20, 2024

Release v1.113.0 - release → staging #10206

Merged

Release v1.113.0 – staging → master #10209

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

upcoming: [M3-7716] - Add session expiry confirmation dialog for proxy users #10152

upcoming: [M3-7716] - Add session expiry confirmation dialog for proxy users #10152

jaalah-akamai commented Feb 6, 2024 •

edited

Loading

jaalah-akamai Feb 6, 2024 •

edited

Loading

jaalah-akamai Feb 6, 2024

jaalah-akamai Feb 6, 2024

jaalah-akamai Feb 6, 2024

github-actions bot commented Feb 6, 2024 •

edited

Loading

hana-akamai left a comment

jaalah-akamai commented Feb 8, 2024

hana-akamai commented Feb 8, 2024

jaalah-akamai commented Feb 8, 2024

jaalah-akamai commented Feb 8, 2024 •

edited

Loading

hana-akamai commented Feb 9, 2024 •

edited

Loading

mjac0bs commented Feb 9, 2024

jaalah-akamai commented Feb 9, 2024

mjac0bs left a comment

upcoming: [M3-7716] - Add session expiry confirmation dialog for proxy users #10152

upcoming: [M3-7716] - Add session expiry confirmation dialog for proxy users #10152

Conversation

jaalah-akamai commented Feb 6, 2024 • edited Loading

Description 📝

Changes 🔄

Preview 📷

How to test 🧪

Should NOT show session expired dialog

Prerequisites

Reproduction steps

Verification steps

Should show session expired dialog

Prerequisites

Reproduction steps

Verification steps

As an Author I have considered 🤔

jaalah-akamai Feb 6, 2024 • edited Loading

Choose a reason for hiding this comment

jaalah-akamai Feb 6, 2024

Choose a reason for hiding this comment

jaalah-akamai Feb 6, 2024

Choose a reason for hiding this comment

jaalah-akamai Feb 6, 2024

Choose a reason for hiding this comment

github-actions bot commented Feb 6, 2024 • edited Loading

hana-akamai left a comment

Choose a reason for hiding this comment

jaalah-akamai commented Feb 8, 2024

hana-akamai commented Feb 8, 2024

jaalah-akamai commented Feb 8, 2024

jaalah-akamai commented Feb 8, 2024 • edited Loading

hana-akamai commented Feb 9, 2024 • edited Loading

mjac0bs commented Feb 9, 2024

jaalah-akamai commented Feb 9, 2024

mjac0bs left a comment

Choose a reason for hiding this comment

jaalah-akamai commented Feb 6, 2024 •

edited

Loading

jaalah-akamai Feb 6, 2024 •

edited

Loading

github-actions bot commented Feb 6, 2024 •

edited

Loading

jaalah-akamai commented Feb 8, 2024 •

edited

Loading

hana-akamai commented Feb 9, 2024 •

edited

Loading