Basically, all that needs to be done to implement it is: Add AuthProvider wrapper to the app component (see here, optionally load the clientID etc from config), and then just use the useAuth hook and call the signIn / signOut functions (see here)
Could also write your own API provider which is a child component of the Auth provider, and make it call the useAuth hook and automagically add the Bearer token to all requires
You define the actual context values in the Producer component. You can use the useContext hook & pass in the context value to access that data from anywhere. The cheeky part is, since the producer is a react component, you can have state values and use hooks to update the context value. If you were to make an API context, you can call the useAuth hook from it's producer component & check whether the user is authenticated & retrieve the bearer token. The values you would provide to the context could be functions that make API calls, generated by the Producer component with the bearer token automatically included in the header. Example of it here.
Enhancements to authentication and user profile features
[ ] When logged in, show drop-down menu with avatar and initials (or similar)
Jack has a sample React project that uses the ALA OIDC authentication service:
https://github.com/AtlasOfLivingAustralia/ala-oidc-react
Enhancements to authentication and user profile features