feat: OAuth flow for VS Code

[heyzec]

Description

VSC PR: source-academy/vscode#47

To support the "Log in with NUSNET ID" option.

Unlike the SAML flow in source-academy/backend#1240, the changes needed to support this requires more code change on the frontend and none on the backend.

The OAuth 2.0 standard mandates single use for authorization codes (https://stackoverflow.com/a/26564117). Hence, we do not need to make use of the exchange table created in the earlier backend PR for SAML.

Modified login flow for VSC

1. User clicks any of the provider buttons on the login page within the Webview of VSC. This triggers the opening of browser window to the auth code link (NUS VAFS).

   • Change is made here to redirect_uri = /login/vscode_callback instead of the usual /login/callback. (We need a way to tell frontend to act differently later on)

2. Normal OAuth flow

   • User authorises application
   • Auth code received via callback

3. Handling auth code

   • An additional step is added here. Instead of immediately contacting /login of the backend, the frontend uses VS Code deeplink to send code and client-request-id to the extension.
     
   • VSC forwards these again by telling embedded frontend to visit /login/vscode_callback with the relevant query params. From here on, we resume the typical flow of contacting backend /login.

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update
• Code quality improvements

How to test

Tested by pushing (a modified variant) of this branch to deploy-stg.

Checklist

• I have tested this code

[coveralls]

Pull Request Test Coverage Report for Build 15956901283

Warning: This coverage report may be inaccurate.

This pull request's base commit is no longer the HEAD commit of its target branch. This means it includes changes from outside the original pull request, including, potentially, unrelated coverage changes.

• For more information on this, see Tracking coverage changes with pull request builds.
• To avoid this issue with future PRs, see these Recommended CI Configurations.
• For a quick fix, rebase this PR at GitHub. Your next report should be accurate.

Details

• 10 of 21 (47.62%) changed or added relevant lines in 6 files are covered.
• 70 unchanged lines in 6 files lost coverage.
• Overall coverage decreased (-0.09%) to 44.632%

---

Changes Missing Coverage	Covered Lines	Changed/Added Lines	%
src/commons/sagas/BackendSaga.ts	0	1	0.0%
src/commons/utils/AuthHelper.ts	4	5	80.0%
src/pages/login/LoginVscodeCallback.tsx	0	9	0.0%

Files with Coverage Reduction	New Missed Lines	%
src/commons/sagas/BackendSaga.ts	2	45.71%
src/features/vscode/messages.ts	4	45.95%
src/routes/routerConfig.tsx	8	35.94%
src/pages/login/LoginVscodeCallback.tsx	11	0.0%
src/commons/utils/AuthHelper.ts	14	42.86%
src/commons/sagas/LoginSaga.ts	31	25.84%

Totals
Change from base Build 15941847223:	-0.09%
Covered Lines:	10109
Relevant Lines:	21216

---

💛 - Coveralls

[RichDom2185]

Just some minor nits :)

[RichDom2185]

LGTM, thanks!

[heyzec]

Pushed to stg and OAuth stil works. Tested a mission (Rune Trials) and looks good, both within and outside extension.