I'm trying to implement SSO on my React-Redux app using an OpenID-Connect provider. The intent is to protect all components and redirect the user to the Identity Provider's login page if the session ends. This is why I cannot have a dedicated Login page (component) in the application. I've read that saving JWTs in the localStorage could be a good idea so I was thinking of using a flag isAuthenticated in the Redux store and keep JWTs in the localStorage. I can then fetch the JWTs from the localStorage to authenticate other APIs I'd be calling from within my app. Is this approach appropriate?
Moreover can anyone point me to a library/package that I can use to fetch (and refresh) JWTs for this purpose? I went through a lot of documentation and tried out the following but couldn't get these to work:
redux-oidc: I don't have any specific Callback component in my application so I don't quite know how to apply this approach to my app.
passport-openid-connect: Passport relies on storing sessions in cookies but I'd like to use the localSorage instead.
redux-auth-wrapper: A higher order component sounds great but I still cannot figure out how to integrate it without any dedicated Login component.
Could someone please guide me through? I'm a newbie to the React ecosystem so please excuse my incomprehension.
Any help would be much appreciated!
Thanks