fix: check for permissions on reconnection

Author: Julusian

packages/webui/src/client/ui/App.tsx

@@ -52,8 +52,7 @@ export const App: React.FC = function App() {
 
 	const [lastStart] = useState(Date.now())
 
-	const [roles, rolesReady] = useUserPermissions()
-	console.log('rolesReady', rolesReady, roles)
+	const [roles, _rolesReady] = useUserPermissions()
 	const featureFlags = useFeatureFlags()
 
 	useEffect(() => {

packages/webui/src/client/ui/UserPermissions.tsx

@@ -15,10 +15,12 @@ import { parse as queryStringParse } from 'query-string'
 import { MeteorCall } from '../lib/meteorApi'
 import { UserPermissions } from '@sofie-automation/meteor-lib/dist/userPermissions'
 import { Settings } from '../lib/Settings'
+import { useTracker } from '../lib/ReactMeteorData/ReactMeteorData'
+import { Meteor } from 'meteor/meteor'
 
 export type { UserPermissions }
 
-export const UserPermissionsContext = React.createContext<Readonly<UserPermissions>>({
+const NO_PERMISSIONS: UserPermissions = Object.freeze({
 	studio: false,
 	configure: false,
 	developer: false,
@@ -27,21 +29,16 @@ export const UserPermissionsContext = React.createContext<Readonly<UserPermissio
 	gateway: false,
 })
 
+export const UserPermissionsContext = React.createContext<Readonly<UserPermissions>>(NO_PERMISSIONS)
+
 export function useUserPermissions(): [roles: UserPermissions, ready: boolean] {
 	const location = window.location
 
 	const [ready, setReady] = useState(!Settings.enableHeaderAuth)
 
 	const [permissions, setPermissions] = useState<UserPermissions>(
 		Settings.enableHeaderAuth
-			? {
-					studio: false,
-					configure: false,
-					developer: false,
-					testing: false,
-					service: false,
-					gateway: false,
-			  }
+			? NO_PERMISSIONS
 			: {
 					studio: getLocalAllowStudio(),
 					configure: getLocalAllowConfigure(),
@@ -52,44 +49,36 @@ export function useUserPermissions(): [roles: UserPermissions, ready: boolean] {
 			  }
 	)
 
+	const isConnected = useTracker(() => Meteor.status().connected, [], false)
+
 	useEffect(() => {
 		if (!Settings.enableHeaderAuth) return
 
-		const interval = setInterval(() => {
-			// TODO - this is a temorary hack!
-			// TODO - this should also be triggered by ddp reconnecting
+		// Do nothing when not connected. Persist the previous values.
+		if (!isConnected) return
+
+		const checkPermissions = () => {
 			MeteorCall.user
 				.getUserPermissions()
 				.then((v) => {
-					setPermissions(
-						v || {
-							studio: false,
-							configure: false,
-							developer: false,
-							testing: false,
-							service: false,
-							gateway: false,
-						}
-					)
+					setPermissions(v || NO_PERMISSIONS)
 					setReady(true)
 				})
 				.catch((e) => {
 					console.error('Failed to set level', e)
-					setPermissions({
-						studio: false,
-						configure: false,
-						developer: false,
-						testing: false,
-						service: false,
-						gateway: false,
-					})
+					setPermissions(NO_PERMISSIONS)
 				})
-		}, 30000) // Arbitrary poll interval
+		}
+
+		const interval = setInterval(checkPermissions, 30000) // Arbitrary poll interval
+
+		// Initial check now
+		checkPermissions()
 
 		return () => {
 			clearInterval(interval)
 		}
-	}, [Settings.enableHeaderAuth])
+	}, [Settings.enableHeaderAuth, isConnected])
 
 	useEffect(() => {
 		if (Settings.enableHeaderAuth) return