Load array out of db once, then get a random number and get a element with the random number

I made a little QuizApp with react-native typescript and a nestjs backend and a mysql database. But I don't want to have repeated Questions. My idea here is i want to get the whole questionlist here in getQuestionList and then get a random index depending on how long the questionList is get the id out of the question/index and delete it so i can't get the same question again and then put it into getQuestions and getAnswers to get the question and the answers by the questionId. But I'm getting the questions more then once. Does anybody give me some help?

  const [questionNumber, setQuestionNumber] = useState<number>(1);  const [reset, setReset] = useState<boolean>(false);  const [answered, setAnswered] = useState<boolean>(false);  const [quiz, setQuiz] = useState<{ question: string; answers: AnswersDTO[] }>();  const [questionList, setQuestionList] = useState<QuestionDTO[]>([]);  const [number, setNumber] = useState<number>();  const [qId, setQId] = useState<number>();  const getQuestionList = async () => {    return setQuestionList(await QuestionManager.getQuestions());  };  useEffect(() => {    (async () => {      await getQuestionList();    })();    getQuestionList().catch(console.error);  }, []);  useEffect(() => {    getNumber();    if (questionList.length > 0) {      (async () => {        if (questionNumber === 1 && qId && number) {          setAnswered(false);          return setQuiz({ question: await getQuestion(qId), answers: await getAnswer(qId) });        }      })();    }  }, [questionList]);  const getQuestion = async (id: number) => {    const quest = await QuestionManager.getQuestion(id);    return quest.question;  };  const getAnswer = async (id: number) => {    return await AnswerManager.getAnswers(id);  };  const getNumber = () => {    const num = Math.floor(Math.random() * questionList.length);    if (num && questionList) {      const qid = questionList[num].id;      setQId(qid);      questionList.splice(num, 1);      setNumber(num);      return qid;    }  };  const quizReset = async () => {    setReset(true);    setAnswered(false);    getNumber();    if (qId && number) {      questionList.splice(number, 1);      return setQuiz({ question: await getQuestion(qId), answers: await getAnswer(qId) });    }  };  if (!questionList) {    return <View />;  }  return (<SafeAreaView style={styles.container}><Header timeInSeconds={timeInSeconds} logo={'AA'} highscore={highscore} />      {quiz && questionList ? (<><View style={styles.questionPosition}><QuestionCard question={quiz.question} number={questionNumber} /></View>          {quiz.answers.map((answer, key) => {            return (<View key={key} style={styles.answer}><QuestionButton                  onClick={() => {                    setAnswered(true);                    if (answer.right) {                      if (questionList.length === 0) {                        return goToWin();                      }                      return setTimeout(() => {                        setQuestionNumber(questionNumber + 1);                        return setAnswered(false);                      }, 1000);                    } else {                      return;                    }                  }}>                  {answer.answer}</QuestionButton></View>            );          })}</>      ) : (<></>      )}</SafeAreaView>  );};```