import React, { useState } from 'react';

import { View, Text, Button } from 'react-native';

const GameScreen = () => {

  const [userChoice, setUserChoice] = useState(null);

  const [computerChoice, setComputerChoice] = useState(null);

  const [result, setResult] = useState(null);

  const choices = ['fire', 'wood'];

  const generateComputerChoice = () => {

    const randomIndex = Math.floor(Math.random() * choices.length);

    return choices[randomIndex];

  };

  const determineWinner = (user, computer) => {

    if (user === computer) {

      return 'It\'s a draw!';

    } else if (user === 'fire' && computer === 'wood') {

      return 'You win!';

    } else if (user === 'wood' && computer === 'fire') {

      return 'Computer wins!';

    } else {

      return 'Something went wrong!';

    }

  };

  const playGame = (userChoice) => {

    const computerChoice = generateComputerChoice();

    const gameResult = determineWinner(userChoice, computerChoice);

    setUserChoice(userChoice);

    setComputerChoice(computerChoice);

    setResult(gameResult);

  };

  return (

    <View>

      <Text>User's Choice: {userChoice}</Text>

      <Text>Computer's Choice: {computerChoice}</Text>

      <Text>Result: {result}</Text>

      <Button title="Choose Fire" onPress={() => playGame('fire')} />

      <Button title="Choose Wood" onPress={() => playGame('wood')} />

    </View>

  );

};

export default GameScreen;