feat: 🎸 Added useAppState hook and logs out user if not authenticated (#328)

- Tracks if the app has been put to background or foreground
- Verifies if the user is valid when going into foreground

packages/app/components/navigation.component.tsx

@@ -1,7 +1,7 @@
 import { useApi } from '@skolplattformen/api-hooks'
 import { NavigationContainer } from '@react-navigation/native'
 import { createStackNavigator } from '@react-navigation/stack'
-import React from 'react'
+import React, { useEffect } from 'react'
 import { StatusBar } from 'react-native'
 import { schema } from '../app.json'
 import Absence from './absence.component'
@@ -14,6 +14,7 @@ import {
   Child as ChildType,
   NewsItem as NewsItemType,
 } from '@skolplattformen/embedded-api'
+import { useAppState } from '../hooks/useAppState'
 
 export type RootStackParamList = {
   Login: undefined
@@ -38,8 +39,25 @@ const linking = {
     },
   },
 }
+
 export const AppNavigator = () => {
-  const { isLoggedIn } = useApi()
+  const { isLoggedIn, api } = useApi()
+
+  const currentAppState = useAppState()
+
+  useEffect(() => {
+    const checkUser = async () => {
+      if (currentAppState === 'active' && isLoggedIn) {
+        const { isAuthenticated } = await api.getUser()
+
+        if (!isAuthenticated) {
+          await api.logout()
+        }
+      }
+    }
+    checkUser()
+  }, [currentAppState, isLoggedIn, api])
+
   return (
     <NavigationContainer linking={linking}>
       <StatusBar />

packages/app/hooks/useAppState.tsx

@@ -0,0 +1,21 @@
+import { useEffect, useState } from 'react'
+import { AppState, AppStateStatus } from 'react-native'
+
+export const useAppState = () => {
+  const currentState = AppState.currentState
+  const [appState, setAppState] = useState(currentState)
+
+  function onChange(newState: AppStateStatus) {
+    setAppState(newState)
+  }
+
+  useEffect(() => {
+    AppState.addEventListener('change', onChange)
+
+    return () => {
+      AppState.removeEventListener('change', onChange)
+    }
+  }, [])
+
+  return appState
+}

packages/app/package.json

@@ -26,7 +26,7 @@
     "@react-navigation/native": "5.9.4",
     "@react-navigation/stack": "5.14.4",
     "@skolplattformen/api-hooks": "2.1.1",
-    "@skolplattformen/embedded-api": "4.4.0",
+    "@skolplattformen/embedded-api": "4.4.1",
     "@ui-kitten/components": "5.0.0",
     "@ui-kitten/eva-icons": "5.0.0",
     "buffer": "6.0.3",

packages/app/yarn.lock

@@ -1501,10 +1501,10 @@
   resolved "https://registry.yarnpkg.com/@skolplattformen/curriculum/-/curriculum-1.2.0.tgz#f6975bf241c09e05bb81f3493ac7cf35aa23d6c4"
   integrity sha512-26/R+ZN1P0jrH26xVrn6ue8WxDPag/TRWqEKyMckSbPWFUpuDRv7/FXRF3q4cRIIowvus6V4L63y3u4ao7Yj3A==
 
-"@skolplattformen/embedded-api@4.4.0":
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/@skolplattformen/embedded-api/-/embedded-api-4.4.0.tgz#668a0c05cd7b94edfeee02dfebe859a823b68669"
-  integrity sha512-oU6mCsMfHE7U42SYMhjlL2tHRkt4vehIiuN2a0gNOUqdkeL3/xhH2EDFds2ae2Jh1NVcczMASQxctggOiFs4zQ==
+"@skolplattformen/embedded-api@4.4.1":
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/@skolplattformen/embedded-api/-/embedded-api-4.4.1.tgz#c8802c0f8bcf208dbf1ba9c67d3a9a3a156ce7f6"
+  integrity sha512-2+MTs0AK0Qe9vPRyC0P2Y7/kh6QWk40rXh+VQ9e5vRakYIflbNDpdFg7Jo6ULkebF92eG+XnQlzj0QgCmlx0mg==
   dependencies:
     "@skolplattformen/curriculum" "^1.2.0"
     "@types/he" "^1.1.1"