그리고 이 컴포넌트를 ArticlesScreen에서 사용해보세요. 만약 아직 데이터를 불러오지 않은 상태라면 화면에 ActivityIndicator를 보여주고, 데이터가 준비되면 Articles 컴포넌트에 articles Prop을 설정하여 보여주세요.

screens/Articlescreen.tsx

import React from 'react';
import {ActivityIndicator, StyleSheet} from 'react-native';
import {useQuery} from 'react-query';
import {getArticles} from '../api/articles';
import Articles from '../components/Articles';

function ArticlesScreen() {
  const {data} = useQuery('articles', getArticles);

  if (!data) {
    return <ActivityIndicator size="large" style={styles.spinner} />;
  }

  return <Articles articles={data} />;
}

const styles = StyleSheet.create({
    spinner: {
      flex: 1,
    },
});

export default ArticlesScreen;