traintrape-moi/client/app/(tabs)/settings.tsx

import { useGameRepairMutation, useGameResetMutation, useGameStartMutation, useGameStopMutation, useGameSwitchPlayerMutation } from '@/hooks/mutations/useGameMutation'
import { useAuth } from '@/hooks/useAuth'
import { useGame, useUpdateGameState } from '@/hooks/useGame'
import { useRouter } from 'expo-router'
import { useState } from 'react'
import { Button, Dialog, FAB, List, Portal, Surface, Text } from 'react-native-paper'

export default function HistoryScreen() {
  const router = useRouter()
  const auth = useAuth()
  const game = useGame()
  const updateGameState = useUpdateGameState()

  const gameStartMutation = useGameStartMutation({
    auth,
    updateGameState,
  })
  const gameStopMutation = useGameStopMutation({
    auth,
    updateGameState,
  })
  const gameSwitchMutation = useGameSwitchPlayerMutation({
    auth,
    updateGameState,
  })
  const gameRepairMutation = useGameRepairMutation({
    auth,
    updateGameState,
  })
  const gameResetMutation = useGameResetMutation({
    auth,
    updateGameState,
  })

  const [resetConfirmVisible, setResetConfirmVisible] = useState(false)

  return (
    <Surface
      style={{ flex: 1 }}>
      <List.Section title={"Paramètres"}>
        <List.Item
            key={"login"}
            title="Connexion au serveur"
            description={auth.loggedIn ? "Vous êtes déjà connecté⋅e" : "Vous n'êtes pas connecté⋅e"}
            right={() => <FAB icon="login" size="small" onPress={() => router.navigate('/login')} />}
            onPress={() => router.navigate('/login')} />
      </List.Section>
      <List.Section title={"Gestion du jeu"}>
        <List.Item
            key={"start"}
            title="Démarrer le jeu"
            disabled={game.gameStarted}
            right={() => <FAB icon="play" size="small" disabled={game.gameStarted} />}
            onPress={() => gameStartMutation.mutate()} />
        <List.Item
            key={"stop"}
            title="Arrêter le jeu"
            disabled={!game.gameStarted}
            right={() => <FAB icon="stop" size="small" disabled={!game.gameStarted} />}
            onPress={() => gameStopMutation.mutate()} />
        <List.Item
            key={"switch"}
            title="Changer de joueur⋅se en course"
            description="À utiliser après une capture"
            disabled={!game.gameStarted}
            right={() => <FAB icon="exit-run" size="small" disabled={!game.gameStarted} />}
            onPress={() => gameSwitchMutation.mutate()} />
      </List.Section>
      <List.Section title={"Avancé"}>
        <List.Item
            key={"repair"}
            title="Réparer"
            description="Permet de réparer les soldes des joueur⋅ses à partir des défis réalisés et des trains emprunter. À manipuler avec précaution."
            right={() => <FAB icon="reload-alert" size="small" variant={'tertiary'} />}
            onPress={() => gameRepairMutation.mutate()} />
        <List.Item
            key={"reset"}
            title="Réinitialiser les données de jeu"
            description="Permet de détruire toutes les données. À manipuler avec précaution."
            right={() => <FAB icon="reload-alert" size="small" variant={'tertiary'} />}
            onPress={() => setResetConfirmVisible(true)} />
      </List.Section>
      <Portal>
        <Dialog key="confirmReset" visible={resetConfirmVisible} onDismiss={() => setResetConfirmVisible(false)}>
          <Dialog.Title>Confirmer</Dialog.Title>
          <Dialog.Content>
            <Text variant="bodyMedium">
              Cette action va réinitialiser TOUTES les données de jeu : l'historique des positions, les défis réalisés et les trains empruntés.
              Êtes-vous réellement sûr⋅e de vouloir tout supprimer ?
            </Text>
          </Dialog.Content>
          <Dialog.Actions>
            <Button onPress={() => setResetConfirmVisible(false)}>Annuler</Button>
            <Button onPress={() => { setResetConfirmVisible(false); gameResetMutation.mutate() }}>Confirmer</Button>
          </Dialog.Actions>
        </Dialog>
      </Portal>
    </Surface>
  )
}