react-infinite-scrollerでfirestoreのデータ取得

    const loadMore = async (page) => {
      
      const response = await fetch(`http://localhost:3000/api/test?page=${page}`);  //API通信
      const data = await response.json();  //取得データ

      //データ件数が0件の場合、処理終了
      if (data.length < 1) {
        setHasMore(false);
        return;
      }
      //取得データをリストに追加
      setList([...list, ...data])
    }

  interface Question {
    id: string;
    senderuid: string;
    receiverUid: string;
    body: string;
    isReplied: boolean;
    createdAt: firebase.firestore.Timestamp;
  }



  const [questions, setQuestions] = useState<Question[]>([]);
  const [hasMore, setHasMore] = useState(true);

  const loadMore = async () => {
    function createBaseQuery() {
      return firebase
        .firestore()
        .collection('questions')
        .where('receiverUid', '==', user.uid)
        .orderBy('createdAt', 'desc')
        .limit(10);
    }

    function appendQuestions(
      snapshot: firebase.firestore.QuerySnapshot<firebase.firestore.DocumentData>,
    ) {
      const gotQuestions = snapshot.docs.map((doc) => {
        const question = doc.data() as Question;
        question.id = doc.id;
        return question;
      });
      setQuestions(questions.concat(gotQuestions));
    }

    const lastQuestion = questions[questions.length - 1];
    
    const data = !questions.length
      ? await createBaseQuery().get()
      : await createBaseQuery().startAfter(lastQuestion.createdAt).get();

    //データ件数が0件の場合、処理終了
    if (data.empty) {
      setHasMore(false);
      return;
    }
    //取得データをリストに追加
    appendQuestions(data);
  };