Get OIDC access tokens once the authentication redirect is successful #3250

npalaska · 2023-02-12T09:40:44Z

On the Pbench Dashboard when the OIDC authentication redirect request is successful, the OIDC broker will redirect the user back to the Pbench auth page with a location header containing session_id and code. We have to use this code to make a POST request against the OIDC token endpoint. If the token endpoint request is successful we log the user in and redirect the user to the overview page.

The POST request might look like the following:


http://<auth-server>/realms/pbench/protocol/openid-connect/token

grant_type=authorization_code
code=<code>
client_id=pbench-client
redirect_uri=http://<pbench-dashboard>/login

Note: This also makes a request to the OIDC userinfo endpoint to fetch and then store the user info as a state value.

This PR is currently rebased on commits from PR #3233

PBENCH-1073

dashboard/src/actions/authActions.js

webbnh

Here are a few things to consider.

dashboard/src/actions/authActions.js

dashboard/src/modules/components/AuthComponent/common-components.jsx

dbutenhof

Also ... you should look in src/utils/axiosInstance.js. We have an API interceptor that adds the bearer token and reports authentication failures. That code ought to be handling expiration by attempting to use the refresh token to negotiate a new access token; otherwise our joy in using the new dashboard code will be shortlived. 😆

(And I appear to have a mind comment pending that I "abandoned" days ago without submitting. Nice of GitHub to remember it, I guess...)

dashboard/src/actions/authActions.js

npalaska · 2023-03-21T21:33:08Z

Okay, opened for review now and I have tried to address most of the relevant comments, but many here may no longer be relevant.

- New dependency added @react-keycloak/web and keycloak-js - Checks the SSO session by wrapping the entire App inside KeycloakProvider. - Removed the current use of login and registration related components. PBENCH-1073

webbnh

There is a bunch more code to be ripped out. 🙂

dashboard/src/App.js

dashboard/src/actions/authActions.js

dashboard/src/actions/toastActions.js

dashboard/src/modules/components/AuthComponent/common-components.jsx

dashboard/src/modules/components/HeaderComponent/index.jsx

dbutenhof

Coming along nicely. As many of Webb's comments suggest, a Prettier run would be good. We should probably add the prettier hook into our eslint config to check formatting in the CI as we do for Python, which would eliminate most concerns of that nature during reviews.

dashboard/src/App.js

dashboard/src/actions/endpointAction.js

dashboard/src/modules/components/HeaderComponent/index.jsx

dbutenhof

Yeah, I almost kinda wish the prettierization had been a separate PR. It was a bit awkward to re-review this morning because, while the reformatting was segregated in a separate commit (thanks), there were new code changes on top of that commit. Ah, well; water over and/or under the bridge ...

Anyway, I think we're converging here. I'm still not sure I understand the flows around page reload and the interactions with cookies vs redux store as related to the OIDC session management, and a bit more clarity would help. Beyond that I think we're into streamlining and cleanup...

dashboard/src/App.js

dashboard/src/actions/toastActions.js

dashboard/src/App.js

dashboard/src/actions/authActions.js

dbutenhof · 2023-03-24T18:39:51Z

Wow: that's a really weird unit test failure, considering you haven't changed any server code. Hard to imagine re-submitting will make any difference, but I'm trying anyway.

npalaska · 2023-03-24T18:46:50Z

Wow: that's a really weird unit test failure, considering you haven't changed any server code. Hard to imagine re-submitting will make any difference, but I'm trying anyway.

I guess re-submitting worked mysteriously 🤔

webbnh · 2023-03-24T18:49:50Z

that's a really weird unit test failure, considering you haven't changed any server code

I'm guessing that it's a missing fixture (or a fixture scope change, or a change to a "chain" of fixture inclusions) in the test code, and that it has little or nothing to do with Server code.

webbnh · 2023-03-24T18:52:01Z

I guess re-submitting worked mysteriously

Apparently so. 😬

webbnh

These latest changes look good; we just need to conclude the discussions from the previous reviews.

dashboard/src/actions/authActions.js

webbnh

Looking good. I think you should add some more to the getDatasets error handler. Beyond that, I found what I think are a couple of unneeded async's, a handful of unneeded ?.'s, and some other small things which you should consider addressing.

And, there are a few lingering issues from my earlier passes:

Account creation date (can't we just remove the whole ProfileComponent?)
The untested ?. result in the HeaderComponent.
The if statement in authCookies().

But, I think we're getting close.

dashboard/src/actions/authActions.js

dashboard/src/actions/overviewActions.js

dashboard/src/assets/constants/authConstants.js

dashboard/src/modules/components/ProfileComponent/index.jsx

dashboard/src/reducers/authReducer.js

webbnh · 2023-03-25T01:55:45Z

dashboard/src/modules/components/ProfileComponent/index.jsx

-                  ) : (
-                    <></>
-                  )}
+                  {<></>}


This looks like an orphan which should have been removed. (I.e., I think this was a placeholder for the second half of a ternary; you removed the first half, so now we don't need the "no-op" second half.)

dashboard/src/actions/authActions.js

MVarshini

The less files formatting has been changed.

Also, imports in few files are changed from " " to ' '

dashboard/src/actions/authActions.js

dashboard/src/actions/endpointAction.js

npalaska · 2023-03-27T13:31:59Z

Also, imports in few files are changed from " " to ' '

I just re-checked, prettier took care of it and it seems like all the imports in all the files now have " "

The less files formatting has been changed.

Are we not supposed to change less files. prettier actually re-formatted them.

webbnh

This looks good enough for now.

I think there is an orphan bit of code which should have been removed, but it's the HTML/Javascript equivalent of a no-op, so it's not worth haggling over.

And, I'm still unsettled by the if statement in authCookies(), but we can work on "flow" later.

dbutenhof

I'm not thrilled about the error formatting, but this is a problem throughout the dashboard we probably need to address separately.

dbutenhof · 2023-03-27T17:39:11Z

dashboard/src/actions/overviewActions.js

-      dispatch(showToast(DANGER, error?.response?.data?.message));
+      const msg = error.response?.data?.message;
+      dispatch(
+        showToast(DANGER, msg ? msg : `Error response: ${error.response}`)


How will Javascript format a Response object? Is that really what we want to appear in the toast? If the response body is a JSON and has message we want to show it; it could also be JSON without a message, or a non-JSON response payload, or there could be no payload at all. I'm not sure how "clever" we want to be here, but probably the final fallback would be the HTTP status code and the code's generic message (response.reason, I think, in Python, though I'm not sure offhand how the Javascript response object differs.) So, maybe, just error.response.data.message or the HTTP status and reason? (But what if we get an error exception that doesn't even have a Response object? In this code we're back to a stringified undefined.)

How will Javascript format a Response object?

It's a valid question which I decided to punt on the principal of the perfect being the enemy of the done. This is something that we can iterate on.

Is that really what we want to appear in the toast?

Probably, not; but my instinct was that it was better than a generic (local fixed-text) message.

I'm not sure how "clever" we want to be here

Only as clever as we need to be and no cleverer. If you're reasonably sure that there will be a response.reason, I'm OK with using that instead of the whole response (I was hoping that Javascript would do something reasonable, and that having the whole response might be be illuminating). If we use the chaining dereference, I'm OK with seeing an undefined in the rare case that we get an error with no other information (i.e., that's not much different from getting a literal "something went wrong" message....)

…distributed-system-analysis#3250) * Dashboard integration with keycloak - New dependency added @react-keycloak/web and keycloak-js - Checks the SSO session by wrapping the entire App inside KeycloakProvider. - Removed the current use of login and registration related components. - Removed all the changes and files that got void after this authentication change. - Also ran prettier on the entire src directory. PBENCH-1073

…#3250) * Dashboard integration with keycloak - New dependency added @react-keycloak/web and keycloak-js - Checks the SSO session by wrapping the entire App inside KeycloakProvider. - Removed the current use of login and registration related components. - Removed all the changes and files that got void after this authentication change. - Also ran prettier on the entire src directory. PBENCH-1073

npalaska requested a review from MVarshini February 12, 2023 09:40

npalaska self-assigned this Feb 12, 2023

npalaska added Dashboard Of and relating to the Dashboard GUI Users Of and relating to working with users. labels Feb 12, 2023

npalaska added this to In progress in v0.72 via automation Feb 12, 2023

npalaska added this to the v0.72 milestone Feb 12, 2023

dbutenhof reviewed Feb 13, 2023

View reviewed changes

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

webbnh reviewed Feb 14, 2023

View reviewed changes

dbutenhof reviewed Feb 17, 2023

View reviewed changes

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

npalaska mentioned this pull request Feb 23, 2023

Enable OIDC redirect in dashboard #3233

Merged

npalaska added 3 commits March 2, 2023 16:29

Get OIDC access tokens once the authentication redirect is successful

f1d8670

address partial comments

9995f7d

remove redundant endpoints reload

b3a052c

portante modified the milestones: v0.72, v0.73 Mar 14, 2023

portante removed this from In progress in v0.72 Mar 14, 2023

npalaska force-pushed the pbench_1073 branch 2 times, most recently from 94d4730 to 7a62855 Compare March 21, 2023 21:28

npalaska marked this pull request as ready for review March 21, 2023 21:29

Dashboard integration with keyclok

474457e

- New dependency added @react-keycloak/web and keycloak-js - Checks the SSO session by wrapping the entire App inside KeycloakProvider. - Removed the current use of login and registration related components. PBENCH-1073

npalaska force-pushed the pbench_1073 branch from 7a62855 to 474457e Compare March 21, 2023 21:36

npalaska requested review from webbnh and dbutenhof March 21, 2023 23:01

webbnh requested changes Mar 22, 2023

View reviewed changes

dbutenhof requested changes Mar 22, 2023

View reviewed changes

dashboard/src/App.js Outdated Show resolved Hide resolved

dashboard/src/App.js Outdated Show resolved Hide resolved

dashboard/src/actions/endpointAction.js Outdated Show resolved Hide resolved

dashboard/src/modules/components/HeaderComponent/index.jsx Outdated Show resolved Hide resolved

npalaska added 2 commits March 22, 2023 23:36

run prettier

4952208

Comments and more cleanups

d2f5799

npalaska force-pushed the pbench_1073 branch from c764b6a to d2f5799 Compare March 23, 2023 03:36

dbutenhof requested changes Mar 23, 2023

View reviewed changes

dashboard/src/App.js Outdated Show resolved Hide resolved

dashboard/src/actions/toastActions.js Outdated Show resolved Hide resolved

dashboard/src/App.js Outdated Show resolved Hide resolved

npalaska requested a review from dbutenhof March 24, 2023 15:07

remove chaining operation for getting keycloak credentials

08c8fde

dbutenhof previously approved these changes Mar 24, 2023

View reviewed changes

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

refactor function name and a comment

a51215d

npalaska dismissed dbutenhof’s stale review via a51215d March 24, 2023 17:59

npalaska requested a review from dbutenhof March 24, 2023 18:00

dbutenhof previously approved these changes Mar 24, 2023

View reviewed changes

webbnh reviewed Mar 24, 2023

View reviewed changes

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

more code removal and refactor

762940d

npalaska dismissed dbutenhof’s stale review via 762940d March 24, 2023 21:31

use async func instead of callback

ba08a2c

webbnh reviewed Mar 25, 2023

View reviewed changes

more comments

bc129b8

npalaska requested review from webbnh and dbutenhof March 25, 2023 05:53

MVarshini reviewed Mar 27, 2023

View reviewed changes

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

dashboard/src/actions/authActions.js Outdated Show resolved Hide resolved

dashboard/src/actions/endpointAction.js Show resolved Hide resolved

webbnh approved these changes Mar 27, 2023

View reviewed changes

dbutenhof approved these changes Mar 27, 2023

View reviewed changes

npalaska merged commit 480dcdd into distributed-system-analysis:openid-connect Mar 27, 2023
1 check passed

npalaska mentioned this pull request Mar 31, 2023

Openid connect -> main #3353

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Get OIDC access tokens once the authentication redirect is successful #3250

Get OIDC access tokens once the authentication redirect is successful #3250

npalaska commented Feb 12, 2023

webbnh left a comment

dbutenhof left a comment

npalaska commented Mar 21, 2023

webbnh left a comment

dbutenhof left a comment

dbutenhof left a comment

dbutenhof commented Mar 24, 2023

npalaska commented Mar 24, 2023

webbnh commented Mar 24, 2023

webbnh commented Mar 24, 2023

webbnh left a comment

webbnh left a comment •

edited

webbnh Mar 25, 2023

MVarshini left a comment

npalaska commented Mar 27, 2023

webbnh left a comment

dbutenhof left a comment

dbutenhof Mar 27, 2023

webbnh Mar 27, 2023

Get OIDC access tokens once the authentication redirect is successful #3250

Get OIDC access tokens once the authentication redirect is successful #3250

Conversation

npalaska commented Feb 12, 2023

webbnh left a comment

Choose a reason for hiding this comment

dbutenhof left a comment

Choose a reason for hiding this comment

npalaska commented Mar 21, 2023

webbnh left a comment

Choose a reason for hiding this comment

dbutenhof left a comment

Choose a reason for hiding this comment

dbutenhof left a comment

Choose a reason for hiding this comment

dbutenhof commented Mar 24, 2023

npalaska commented Mar 24, 2023

webbnh commented Mar 24, 2023

webbnh commented Mar 24, 2023

webbnh left a comment

Choose a reason for hiding this comment

webbnh left a comment • edited

Choose a reason for hiding this comment

webbnh Mar 25, 2023

Choose a reason for hiding this comment

MVarshini left a comment

Choose a reason for hiding this comment

npalaska commented Mar 27, 2023

webbnh left a comment

Choose a reason for hiding this comment

dbutenhof left a comment

Choose a reason for hiding this comment

dbutenhof Mar 27, 2023

Choose a reason for hiding this comment

webbnh Mar 27, 2023

Choose a reason for hiding this comment

webbnh left a comment •

edited