fix: [PDI-3249] - Use sessionStorage for codeVerifier and nonce: update OAuth and storage

[mkaminsk-akamai]

Description 📝

@pmakode-akamai This is a code snipplet which can help to reproduce the case when user who has multiple CM tabs open receives message in console that codeVerifier not being found. You can reproduce it locally when you point local APIV4 environment to production APIV4 so CM will get 401s each time.
Without changes to storage.ts you should be able to reproduce the message with codeVerifier not being found.
If you apply changes from storage.ts the issue seems to be gone, since when there are multiple tabs open the codeVerifier may overwritten in local storage, thus I switching in this code snipplet to use sessionStorage seems to resolve it.

Scope 🚢

Upon production release, changes in this PR will be visible to:

• All customers
• Some customers (e.g. in Beta or Limited Availability)
• No customers / Not applicable

Target release date 🗓️

April End

How to test 🧪

Reproduction steps

You can use this config for reproducing it: Login in DevCloud will work fine, APIv4 will give 401s. You can use this client id from DevCloud 'c19a605edc88b07242fa':

REACT_APP_APP_ROOT='http://localhost:3000'
REACT_APP_API_ROOT='https://api.linode.com/v4'
REACT_APP_LOGIN_ROOT='https://login.devcloud.linode.com'
REACT_APP_CLIENT_ID='c19a605edc88b07242fa'

Verification steps

• Add alert('No code codeVerifier found in local storage when running OAuth callback.'); after L208 here
• No code verifier found in local storage. Please try logging in again. alert should not appear while testing in multiple tabs. (Note: this alert message appears intermittently without these changes, and these PR changes are supposed to fix this problem)

Note

alert('No code codeVerifier found in local storage when running OAuth callback.'); should be removed before merging this PR

Author Checklists

As an Author, to speed up the review process, I considered 🤔

👀 Doing a self review
❔ Our contribution guidelines
🤏 Splitting feature into small PRs
➕ Adding a changeset
🧪 Providing/improving test coverage
🔐 Removing all sensitive information from the code and PR description
🚩 Using a feature flag to protect the release
👣 Providing comprehensive reproduction steps
📑 Providing or updating our documentation
🕛 Scheduling a pair reviewing session
📱 Providing mobile support
♿ Providing accessibility support

• I have read and considered all applicable items listed above.

As an Author, before moving this PR from Draft to Open, I confirmed ✅

• All tests and CI checks are passing
• TypeScript compilation succeeded without errors
• Code passes all linting rules

[abailly-akamai]

I think this is a good approach - am not seeing any regression from my initial testing and this def addresses the multiple tab issue.

This fixes an edge case with multiple tabs session expiration, however we will still have to decide it that's a fix worth introducing. It appears safe but it will have to be tested well. thanks @mkaminsk-akamai

[pmakode-akamai]

Validated the latest changes on multiple tabs and didn't observe any regressions ✅

[linode-gh-bot]

Cloud Manager UI test results

🔺 1 failing test on test run #9 ↗︎

❌ Failing	✅ Passing	↪️ Skipped	🕐 Duration
1 Failing	901 Passing	11 Skipped	40m 45s

Details

Failing Tests
	Spec	Test
❌	object-storage.e2e.spec.ts	Cloud Manager Cypress Tests→object storage end-to-end tests » can update bucket access

Troubleshooting

Use this command to re-run the failing tests:

pnpm cy:run -s "cypress/e2e/core/objectStorage/object-storage.e2e.spec.ts"

[jdamore-linode]

Thanks @pmakode-akamai and @mkaminsk-akamai! I wasn't able to observe any regressions. These are some of the flows I tested:

• ✅ Signing in against develop, then switching to this branch and remaining signed in as expected on this branch (i.e. to simulate what'll happen to users who are already signed in after we deploy)
• ✅ Signing in fresh against this branch
• ✅ Logging out in one tab, confirmed other tabs get booted to login

I tested all this a few times, and I'm happy to take a second look if you make any other changes but otherwise lgtm

(cc @abailly-akamai)