Remove support for x509 authentication and add conditional checks for the authenticated state

src/js/OidcConfiguration.js

@@ -2,8 +2,8 @@ const baseUrl = window.location.protocol + "//" + window.location.host
 const initData = {
 	client_id: "ringfs",
 	redirect_uri: baseUrl + "/authentication/callback",
-	response_type: "id_token token",
-	scope: "openid profile email",
+	response_type: "code",
+	scope: "openid profile email offline_access opensvc:om2 opensvc:om2:root opensvc:om2:guest grant",
 	silent_redirect_uri: baseUrl + "/authentication/silent_callback",
 	automaticSilentRenew: true,
 	loadUserInfo: false,

src/js/api.js

@@ -92,8 +92,6 @@ function hasAuthorizationHeader(auth) {
 		return (auth.username && auth.password) ? true : false
 	} else if (auth.authChoice == "openid") {
 		return auth.access_token ? true : false
-	} else if (auth.authChoice == "x509") {
-		return true
 	}
 	return false
 }

src/js/components/App.jsx

@@ -141,6 +141,7 @@ const AppStateProvider = (props) => {
 		basicLogin: {},
 		alerts: [],      // ex: [{level: "warning", body: (<div>foo</div>)}],
 		eventSourceAlive: false,
+        authenticated: false,
 	}
 
 	const reducer = (state, action) => {
@@ -151,6 +152,12 @@ const AppStateProvider = (props) => {
 					user: action.data
 				}
 
+            case 'setAuthenticated':
+                return {
+                    ...state,
+                    authenticated: action.data
+                }
+
 			case 'setEventSourceAlive':
 				if (action.data == state.eventSourceAlive) {
 					return state

src/js/components/AuthChoice.jsx

@@ -32,9 +32,6 @@ function AuthChoice(props) {
                                         OpenId
                                 </Button>
 				}
-                                <Button onClick={() => dispatch({type: "setAuthChoice", data: "x509"})}>
-                                        x509
-                                </Button>
 				{authInfo && authInfo.methods && authInfo.methods.indexOf("basic") >= 0 &&
                                 <Button onClick={() => dispatch({type: "setAuthChoice", data: "basic"})}>
                                         Basic

src/js/components/LoginCallback.jsx

@@ -1,15 +1,5 @@
-import useClusterStatus from '../hooks/ClusterStatus.jsx'
-import { useStateValue } from "../state.js"
-
 function LoginCallback(props) {
-	const { close } = useClusterStatus()
-	const [{ authChoice }, dispatch] = useStateValue()
-	console.log("login callback")
-	if (authChoice != "openid") {
-		dispatch({type: "setAuthChoice", data: "openid"})
-	}
-	close()
-	return null
+    console.log("auth completed, returning to application")
 }
 
 export default LoginCallback

src/js/components/NotAuthorized.jsx

@@ -33,9 +33,6 @@ function NotAuthorized(props) {
                                         OpenId
                                 </Button>
                                 }
-                                <Button onClick={() => dispatch({type: "setAuthChoice", data: "x509"})}>
-                                        x509
-                                </Button>
                         </DialogActions>
 		</Dialog>
 	)

src/js/components/User.jsx

@@ -55,8 +55,6 @@ function UserDigest(props) {
 
 	function handleLogout(e) {
 		logout()
-		dispatch({type: "setAuthChoice", data: ""})
-		dispatch({type: "setBasicLogin", data: {}})
 		unloadUser()
 		close()
 	}

src/js/hooks/ClusterStatus.jsx

@@ -16,7 +16,7 @@ const context = {
 }
 
 function useClusterStatus(props) {
-	const [{cstat, user, eventSourceAlive}, dispatch] = useStateValue()
+	const [{cstat, user, eventSourceAlive, authenticated}, dispatch] = useStateValue()
 	const { auth } = useUser()
 	const lastDispatch = useRef(Date.now())
 	const limit = 1000
@@ -36,6 +36,7 @@ function useClusterStatus(props) {
 	}
 
 	function initEventSource() {
+        if (!authenticated) {return;}
 		if (context.eventSource !== null && context.eventSource.readyState != 2) {
 			return
 		}
@@ -98,6 +99,7 @@ function useClusterStatus(props) {
 	}
 
 	async function loadCstat() {
+        if (!authenticated) {return;}
 		if (!hasAuthorizationHeader(auth)) {
 			console.log("loadCstat", false, auth)
 			return
@@ -151,20 +153,22 @@ function useClusterStatus(props) {
 	}
 
 	function init() {
-		if (!context.cstat) {
+        if (!authenticated) {return}
+        if (!context.cstat) {
 			loadCstat()
 		}
 		initEventSource()
 	}
 
 	useEffect(() => {
-		if (!context.auth || (context.auth.access_token == auth.access_token) && (context.auth.username == auth.username)) {
+        if (!authenticated) {return}
+        if (!context.auth || (context.auth.access_token == auth.access_token) && (context.auth.username == auth.username)) {
 			init()
 		} else {
 			reset()
 		}
 		context.auth = auth
-	}, [])
+	}, [authenticated])
 
 	return {
 		cstat: cstat,

src/js/hooks/NetworksStatus.jsx

@@ -1,9 +1,11 @@
 import { useState, useEffect } from "react";
 import useUser from "./User.jsx"
 import { apiGetAny } from "../api.js";
+import {useStateValue} from "../state";
 
 function useNetworksStatus() {
-	const [data, setData] = useState(null)
+    const [{authenticated}] = useStateValue()
+    const [data, setData] = useState(null)
 	const { auth } = useUser()
 
 	function getData() {
@@ -16,8 +18,8 @@ function useNetworksStatus() {
 	}
 
 	useEffect(() => {
-		getData()
-	}, [])
+        if (authenticated) {getData()}
+	}, [authenticated])
 
 	return data
 }

src/js/hooks/PoolsStatus.jsx

@@ -1,9 +1,11 @@
 import { useState, useEffect } from "react";
 import useUser from "./User.jsx"
 import { apiGetAny } from "../api.js";
+import {useStateValue} from "../state";
 
 function usePoolsStatus() {
-	const [data, setData] = useState(null)
+    const [{authenticated}] = useStateValue()
+    const [data, setData] = useState(null)
 	const { auth } = useUser()
 
 	function getData() {
@@ -16,8 +18,8 @@ function usePoolsStatus() {
 	}
 
 	useEffect(() => {
-		getData()
-	}, [])
+        if (authenticated) {getData()}
+    }, [authenticated])
 
 	return data
 }

src/js/hooks/User.jsx

@@ -19,11 +19,11 @@ function useUser(props) {
 		context.isLoading = false
 		context.auth = null
 		context.error = null
-		dispatch({
-			type: "loadUser",
-			data: {},
-		})
-	}
+		dispatch({type: "loadUser", data: {}})
+        dispatch({type: "setAuthChoice", data: ""})
+        dispatch({type: "setBasicLogin", data: {}})
+        dispatch({type: "setAuthenticated", data: false})
+    }
 
 	useEffect(() => {
 		async function fetchData() {
@@ -48,22 +48,19 @@ function useUser(props) {
 				const data = await fetcher.json()
 				console.log("I am", data)
 				if ((data.name == "nobody") && (authChoice != "x509")) {
-					// return to the auth form except for x509
-					// to avoid looping on GET /whoami
-					dispatch({
-						type: "setBasicLogin",
-						data: {},
-					})
+					// return to the auth form to avoid looping on GET /whoami
 					unloadUser()
 				} else {
 					dispatch({
 						type: "loadUser",
 						data: data,
 					})
+                    dispatch({type: "setAuthenticated", data: true})
 				}
 			} catch (error) {
 				context.auth = null
 				context.error = error
+                unloadUser()
 			} finally {
 				context.isLoading = false
 			}