Déplacement des providers dans un dossier dédié

client/components/providers/GameProvider.tsx

@@ -0,0 +1,114 @@
+import { useAuth } from '@/hooks/useAuth'
+import { useChallengeActions, useDownloadChallengeActions } from '@/hooks/useChallengeActions'
+import { useDownloadChallenges } from '@/hooks/useChallenges'
+import { useGame, useUpdateActiveChallengeId, useUpdateGameState, useUpdateMoney, useUpdatePenalty } from '@/hooks/useGame'
+import { useDownloadMoneyUpdates } from '@/hooks/useMoneyUpdates'
+import { useDownloadTrains } from '@/hooks/useTrain'
+import { isAuthValid } from '@/utils/features/auth/authSlice'
+import { ChallengeAction, ChallengeActionPayload } from '@/utils/features/challengeActions/challengeActionsSlice'
+import { Challenge } from '@/utils/features/challenges/challengesSlice'
+import { useQuery } from '@tanstack/react-query'
+import { ReactNode, useEffect } from 'react'
+
+export default function GameProvider({ children }: { children: ReactNode }) {
+  const auth = useAuth()
+  const game = useGame()
+  const challengeActions = useChallengeActions()
+  const updateGameState = useUpdateGameState()
+  const updatePenalty = useUpdatePenalty()
+  const updateMoney = useUpdateMoney()
+  const updateActiveChallengeId = useUpdateActiveChallengeId()
+  const downloadTrains = useDownloadTrains()
+  const downloadChallenges = useDownloadChallenges()
+  const downloadChallengeActions = useDownloadChallengeActions()
+  const downloadMoneyUpdates = useDownloadMoneyUpdates()
+
+  const gameQuery = useQuery({
+    queryKey: ['get-game', auth.token],
+    queryFn: () => fetch(`${process.env.EXPO_PUBLIC_TRAINTRAPE_MOI_SERVER}/game/`, {
+      headers: { "Authorization": `Bearer ${auth.token}` }}
+    ).then(resp => resp.json()),
+    enabled: isAuthValid(auth),
+    refetchInterval: 5000,
+  })
+  useEffect(() => {
+    if (gameQuery.isSuccess && gameQuery.data)
+      updateGameState(gameQuery.data)
+  }, [gameQuery.status, gameQuery.dataUpdatedAt])
+
+  const playerQuery = useQuery({
+    queryKey: ['get-player', game.playerId, auth.token],
+    queryFn: () => fetch(`${process.env.EXPO_PUBLIC_TRAINTRAPE_MOI_SERVER}/players/${game.playerId}/`, {
+      headers: { "Authorization": `Bearer ${auth.token}` }}
+    ).then(resp => resp.json()),
+    enabled: isAuthValid(auth) && !!game.playerId,
+    refetchInterval: 5000,
+  })
+  useEffect(() => {
+    if (playerQuery.isSuccess && playerQuery.data) {
+      updateMoney(playerQuery.data.money)
+      updateActiveChallengeId(playerQuery.data.activeChallengeId)
+    }
+  }, [playerQuery.status, playerQuery.dataUpdatedAt])
+
+  const trainsQuery = useQuery({
+    queryKey: ['get-trains', game.playerId, auth.token],
+    queryFn: () => fetch(`${process.env.EXPO_PUBLIC_TRAINTRAPE_MOI_SERVER}/trains/?playerId=${game.playerId}&size=10000`, {
+      headers: { "Authorization": `Bearer ${auth.token}` }}
+    ).then(resp => resp.json()),
+    enabled: isAuthValid(auth) && !!game.playerId,
+    initialData: { data: [], meta: { currentPage: 0, lastPage: 0, nextPage: 0, prevPage: 0, total: 0, totalPerPage: 0 } },
+    refetchInterval: 5000,
+  })
+  useEffect(() => {
+    if (trainsQuery.isSuccess && trainsQuery.data)
+      downloadTrains(trainsQuery.data)
+  }, [trainsQuery.status, trainsQuery.dataUpdatedAt])
+
+  const challengesQuery = useQuery({
+    queryKey: ['get-challenges', auth.token],
+    queryFn: () => fetch(`${process.env.EXPO_PUBLIC_TRAINTRAPE_MOI_SERVER}/challenges/?size=10000`, {
+      headers: { "Authorization": `Bearer ${auth.token}` }}
+    ).then(resp => resp.json()),
+    enabled: isAuthValid(auth),
+    initialData: { data: [], meta: { currentPage: 0, lastPage: 0, nextPage: 0, prevPage: 0, total: 0, totalPerPage: 0 } },
+    refetchInterval: 5000,
+  })
+  useEffect(() => {
+    if (challengesQuery.isSuccess && challengesQuery.data) {
+      downloadChallenges(challengesQuery.data)
+      const dataWithPlayerActions = challengesQuery.data.data.filter(
+        (challenge: (Challenge & {action: ChallengeActionPayload | null})) => challenge.action !== null && challenge.action.playerId === game.playerId)
+      downloadChallengeActions({ data: dataWithPlayerActions })
+    }
+  }, [challengesQuery.status, challengesQuery.dataUpdatedAt])
+
+  const moneyUpdatesQuery = useQuery({
+    queryKey: ['get-money-updates', game.playerId, auth.token],
+    queryFn: () => fetch(`${process.env.EXPO_PUBLIC_TRAINTRAPE_MOI_SERVER}/money-updates/?playerId=${game.playerId}&size=10000`, {
+      headers: { "Authorization": `Bearer ${auth.token}` }}
+    ).then(resp => resp.json()),
+    enabled: isAuthValid(auth) && !!game.playerId,
+    refetchInterval: 5000,
+  })
+  useEffect(() => {
+    if (moneyUpdatesQuery.isSuccess && moneyUpdatesQuery.data)
+      downloadMoneyUpdates(moneyUpdatesQuery.data)
+  }, [moneyUpdatesQuery.status, moneyUpdatesQuery.dataUpdatedAt])
+
+  useEffect(() => {
+    const now = new Date().getTime()
+    const activeChallenge: ChallengeAction | undefined = challengeActions
+      .find(challengeAction => challengeAction.penaltyStart && challengeAction.penaltyEnd
+        && challengeAction.penaltyStart <= now && now <= challengeAction.penaltyEnd)
+    if (!activeChallenge || !game.currentRunner || game.runId !== activeChallenge.runId)
+      updatePenalty({ penaltyStart: null, penaltyEnd: null })
+    else if (activeChallenge && (activeChallenge.penaltyStart !== game.penaltyStart || activeChallenge.penaltyEnd)) {
+      updatePenalty({ penaltyStart: activeChallenge.penaltyStart, penaltyEnd: activeChallenge.penaltyEnd })
+    }
+  }, [game.currentRunner, challengeActions])
+
+  return <>
+    {children}
+  </>
+}

client/components/providers/GeolocationProvider.tsx

@@ -0,0 +1,53 @@
+import { ReactNode, useEffect, useState } from 'react'
+import { useAuth } from '@/hooks/useAuth'
+import { useQueuedLocations, useSetLastPlayerLocations, useUnqueueLocation } from '@/hooks/useLocation'
+import { useGeolocationMutation } from '@/hooks/mutations/useGeolocationMutation'
+import { useStartGeolocationServiceEffect } from '@/utils/geolocation'
+import { Platform } from 'react-native'
+import { useQuery } from '@tanstack/react-query'
+import { isAuthValid } from '@/utils/features/auth/authSlice'
+
+export default function GeolocationProvider({ children }: { children: ReactNode }) {
+  useStartGeolocationServiceEffect()
+
+  const auth = useAuth()
+  const geolocationsQueue = useQueuedLocations()
+  const unqueueLocation = useUnqueueLocation()
+  const setLastPlayerLocations = useSetLastPlayerLocations()
+  const geolocationMutation = useGeolocationMutation({
+    auth,
+    onPostSuccess: (data, variables) => unqueueLocation(variables),
+    onError: ({ response, error }) => console.error(response, error),
+  })
+  
+  if (Platform.OS !== "web") {
+    useEffect(() => {
+      if (geolocationsQueue.length === 0 || geolocationMutation.isPending || !isAuthValid(auth))
+        return
+        const locToSend = geolocationsQueue[0]
+        geolocationMutation.mutate(locToSend)
+    }, [auth, geolocationMutation.status, geolocationsQueue])
+  }
+
+  const lastLocationsQuery = useQuery({
+    queryKey: ['get-last-locations', auth.token],
+    queryFn: () => fetch(`${process.env.EXPO_PUBLIC_TRAINTRAPE_MOI_SERVER}/geolocations/last-locations/`, {
+      method: "GET",
+      headers: {
+        "Authorization": `Bearer ${auth.token}`,
+        "Content-Type": "application/json",
+      },
+    }).then(resp => resp.json()),
+    initialData: [],
+    enabled: isAuthValid(auth),
+    refetchInterval: 5000,
+  })
+  useEffect(() => {
+    if (lastLocationsQuery.isSuccess && lastLocationsQuery.data)
+      setLastPlayerLocations(lastLocationsQuery.data)
+  }, [lastLocationsQuery.status, lastLocationsQuery.dataUpdatedAt])
+
+  return <>
+    {children}
+  </>
+}

client/components/providers/LoginProvider.tsx

@@ -0,0 +1,77 @@
+import { Href, useRouter } from 'expo-router'
+import { useRouteInfo } from 'expo-router/build/hooks'
+import { ReactNode, useEffect } from 'react'
+import { useAuth, useAuthLogin } from '@/hooks/useAuth'
+import * as SecureStore from '@/utils/SecureStore'
+import { useLoginMutation } from '@/hooks/mutations/useLoginMutation'
+import { useGame, useSetPlayerId } from '@/hooks/useGame'
+
+type Props = {
+  loginRedirect: Href
+  children: ReactNode
+}
+
+export default function LoginProvider({ loginRedirect, children }: Props) {
+  const router = useRouter()
+  const route = useRouteInfo()
+  const auth = useAuth()
+  const authLogin = useAuthLogin()
+  const loginMutation = useLoginMutation({
+    authLogin,
+    onError: ({ response }) => {
+      if (response)
+        authLogin({ name: auth.name ?? "", password: null, token: null })
+      else
+        authLogin({ name: auth.name ?? "", token: null })
+    }
+  })
+  const game = useGame()
+  const setPlayerId = useSetPlayerId()
+
+  useEffect(() => {
+    (async () => {
+      const storedName = await SecureStore.getItemAsync('apiName')
+      const storedToken = await SecureStore.getItemAsync('apiToken')
+      if (!auth.loggedIn && storedName !== null && storedName !== auth.name && storedToken !== auth.token) {
+        authLogin({ name: storedName, token: storedToken })
+        return
+      }
+
+      // Si on est pas connecté⋅e, on reste sur la fenêtre de connexion
+      if ((!auth.loggedIn || !auth.token) && route.pathname !== loginRedirect)
+        router.navigate(loginRedirect)
+    })()
+  }, [auth, authLogin, router, route])
+
+  useEffect(() => {
+    // Renouvellement auto du jeton d'authentification
+    const { name, token } = auth
+    const password = SecureStore.getItem('apiPassword')
+    if (name === null || (password === null && token === null))
+      return
+    let waitTime = 0
+    if (token !== null && token !== undefined) {
+      const arrayToken = token.split('.')
+      const tokenPayload = JSON.parse(atob(arrayToken[1]))
+      const expTime: number = tokenPayload.exp * 1000
+      const now: number = Math.floor(new Date().getTime())
+      waitTime = expTime - now
+
+      const playerId = tokenPayload.playerId
+      if (playerId !== game.playerId)
+        setPlayerId(playerId)
+    }
+    const timeout = setTimeout(async () => {
+      const password = SecureStore.getItem('apiPassword')
+      if (password)
+        loginMutation.mutate({ name, password })
+      else
+        authLogin({ name: name, token: null })
+    }, waitTime)
+    return () => clearTimeout(timeout)
+  }, [auth, authLogin, game, setPlayerId])
+
+  return <>
+    {children}
+  </>
+}