Изменить состояние пользовательской кнопки в React Native

Я только начинаю работать с React Native и хочу обновить состояние с моей домашней страницы, нажав пользовательскую кнопку. Я сделал этот код чуть ниже. Когда я нажимаю на свои кнопки, я не вижу изменения состояния.

const Home = () => {
  const welcomeSentence =
    "Bonjour, est ce que tu as fais ton workout aujourd'hui ?";
    const [isWorkoutDone, setIsWorkoutDone] = useState(false);

  return (
    <View style = {styles.container}>
      <Text style = {styles.homePageText}>{welcomeSentence}</Text>
      <View style = {styles.buttonContainer}>
        <AppButton title  = "OUI" onPress = {()=>this.setIsWorkoutDone(true)}/>
        <AppButton title  = "NON" onPress = {()=>this.setIsWorkoutDone(false)}/>
      </View>
      <Text>{isWorkoutDone ? "OK" : "KO"}</Text>
    </View>
  );
};

С этим кодом на моей кнопке cutom:

const AppButton = (props) => {
  return (
    <Button
      title = {props.title}
      onPress = {props.onPress}
      style = {styles.appButton}
    />
  );
};

Я проверил и сделал поиск, но я не нашел, почему мое состояние не изменилось.