3. API

This package contains the following components:

createOidcMiddleware(userManager, shouldValidate, triggerAuthFlow)

Sample usage:

import createOidcMiddleware, { createUserManager } from 'redux-oidc';

const config = {
  // userManager config object
}

const mgr = createUserManager(config);

// a custom shouldValidate function
const shouldValidate = (state, action) => {
  if (action.type === 'DONT_VALIDATE') {
    return false;
  }

  return true;
}

const oidcMiddleware = createOidcMiddleware(userManager, shouldValidate);

Parameters:

• userManager required: a UserManager instance,
• shouldValidate default (state, action) => true: a function which gets the current state & action passed in. Returns true when validation should occur or false if it shouldn't,
• triggerAuthFlow default true: if true, the middleware triggers a redirect to the token service when the user is expired.

NOTE: When triggerAuthFlow is set to false, you are responsible for initiating the redirect. The userExpired action is dispatched when the current user is invalid. You can have your sagas, thunks listen to this action and trigger custom behavior manually. See oidc-client-js's documentation for details.

---

<OidcProvider />

Sample usage:

import { OidcProvider } from 'redux-oidc';
import { createStore } from 'redux';
import { createUserManager, Provider } from 'react-redux';

const manager = createUserManager();
const store = createStore(/* your reducers */);

ReactDOM.render(
  <Provider store={store}>
    <OidcProvider store={store} userManager={userManager} />
  </Provider>,
  document.getElementById('app')
);

Properties:

• store required: the redux store,
• userManager required: The UserManager instance.

---

Reducer

There are reducers avaiable for both classic JS and apps using immutable. They both store the current user object under the user key in the redux state.

Sample usage:

import { reducer } from 'redux-oidc'; // classic JS
// OR
import { immutableReducer } from 'redux-oidc'; // immutable JS
import { combineReducers } from 'redux';
import { connect } from 'react-redux'; 

const rootReducer = combineReducers({
  oidc: reducer,
  // your other reducers...
});

---

<CallbackComponent />

The callback component manages the token callback from the identity provider. A custom successCallback function is required to handle the redirect after the callback has been completed.

Sample usage:

import React from 'react';
import { CallbackComponent } from 'redux-oidc';

class MyCallbackPage extends React.Component {
  successCallback = (user) => {
     // the url before redirection was triggered is passed into the user object
     // and can be accessed like this
     redirect(user.state.redirectUrl);
  };

  render() {
    return (
      <CallbackComponent successCallback={this.successCallback}>
        My custom content!
      </CallbackComponent>
    )
  }
}

function mapDispatchToProps(dispatch) {
  return {
    dispatch
  };
}

export default connect(null, mapDispatchToProps)(MyCallbackPage);

Properties:

• successCallback required: A function which is called after the token callback was successfully processed.

---

createUserManager(config)

A function which returns a UserManager instance.

Usage example:

import { createUserManager } from 'redux-oidc';

const mgr = createUserManager();

Parameters:

• config optional: a config object for the UserManager. See oidc-client-js's wiki for more information.

---

processSilentRenew()

A function which is called when a silent renew is triggered. See silent renew for more information.

Usage example:

import { processSilentRenew } from 'redux-oidc';

processSilentRenew();

---