AuthenticationProvider dynamically add/change extraQueryParams

[chustedt]

Hello,

I want to dynamically change extraQueryParams in the AuthenticationProvider. Depending on my user clicking register or login I want to set a specific query param in the redirect to the identity server so when I call the consumer login, that specific param would be set.

Is there anyway to handle this or has someone come across this before?

Thanks!

[FrancoisDF]

I was actually looking to do the same. Did you close the issue because you found out a solution?

[FrancoisDF]

Well, actually after trying out few things, I realized that it's working as expected. Even if not part of the code, nor the example, oidc-client will automatically picked up the extraQueryParams from the configuration. Just in case someone have the same issue, it should look like that:

const configuration = {
    authority: ...,
    client_id: ...,
    extraQueryParams: {
      key: value 
    },
    ...
  }
 <AuthenticationProvider  
      configuration={configuration}
      isEnabled={true}
      UserStore={InMemoryWebStorage}>
   <Provider store={store}>
       <BrowserRouter >
          <App />
       </BrowserRouter>
   </Provider>
</AuthenticationProvider>

[chustedt]

Our project originally had two separate buttons in our react-app one for registration and login that needed to open a separate page on our IM. I wanted to able to edit the extraQueryParams after the AuthenticationProvider was established. I did find a way to change the settings, but I can't find the code anymore. We ended up moving the login/register buttons into IM itself and have a single button in the react-app.

If you really need to update them after the AuthenticationProvider is created, I can try to find my changes. I vaguely remember updating something like .settings.extraQueryParams.

[skoliver89]

Our project originally had two separate buttons in our react-app one for registration and login that needed to open a separate page on our IM. I wanted to able to edit the extraQueryParams after the AuthenticationProvider was established. I did find a way to change the settings, but I can't find the code anymore. We ended up moving the login/register buttons into IM itself and have a single button in the react-app.

If you really need to update them after the AuthenticationProvider is created, I can try to find my changes. I vaguely remember updating something like .settings.extraQueryParams.

I recently need to add extra params to pass dark mode settings to the ids4 login page. I think you are referring to something like this?

import { AuthenticationContext, getUserManager} from "@axa-fr/react-oidc-context";
const userMgr = getUserManager();
const darkMode = true;
userMgr.settings.extraQueryParams = { darkMode };

where the \~.settings.\~ line would be put where your update should be handled.