diff --git a/examples/react/react-native/src/components/ListItem.tsx b/examples/react/react-native/src/components/ListItem.tsx index ee52729efd..4544f3937c 100644 --- a/examples/react/react-native/src/components/ListItem.tsx +++ b/examples/react/react-native/src/components/ListItem.tsx @@ -1,10 +1,11 @@ import * as React from 'react' import { View, StyleSheet } from 'react-native' import { Paragraph, TouchableRipple } from 'react-native-paper' +import { MovieDetails } from '../lib/api' type Props = { - item: any - onPress: (item: any) => void + item: MovieDetails + onPress: (item: MovieDetails) => void } export function ListItem({ item, onPress }: Props) { diff --git a/examples/react/react-native/src/lib/api.ts b/examples/react/react-native/src/lib/api.ts index fe7f2c927c..73eb2c3995 100644 --- a/examples/react/react-native/src/lib/api.ts +++ b/examples/react/react-native/src/lib/api.ts @@ -18,27 +18,27 @@ function delay(t: number) { }) } -export async function fetchMovies() { +export async function fetchMovies(): Promise { console.log('fetchMovies') await delay(200 + Math.floor(Math.random() * 2000)) - return movies - .slice(0, 100) - .map((movie) => ({ title: movie.title, year: movie.year })) as Promise< - Movie[] - > + return Promise.resolve( + movies + .slice(0, 100) + .map((movie) => ({ title: movie.title, year: movie.year })), + ) } -export async function fetchMovie(title: string) { +export async function fetchMovie(title: string): Promise { console.log('fetchMovie', title) await delay(200 + Math.floor(Math.random() * 2000)) const result = movies.filter((item) => item.title === title) - if (result.length == 0) { + if (result.length === 0) { throw new Error('Movie not found') } - return result[0] as Promise + return Promise.resolve(result[0] as MovieDetails) } diff --git a/examples/react/react-native/src/screens/MoviesListScreen.tsx b/examples/react/react-native/src/screens/MoviesListScreen.tsx index 3bc8a37d25..ad34c776f6 100644 --- a/examples/react/react-native/src/screens/MoviesListScreen.tsx +++ b/examples/react/react-native/src/screens/MoviesListScreen.tsx @@ -9,7 +9,7 @@ import { Divider } from '../components/Divider' import { ListItem } from '../components/ListItem' import { useRefreshByUser } from '../hooks/useRefreshByUser' import { useRefreshOnFocus } from '../hooks/useRefreshOnFocus' -import { fetchMovies, Movie } from '../lib/api' +import { fetchMovies, Movie, MovieDetails } from '../lib/api' import { MoviesStackNavigator } from '../navigation/types' type MoviesListScreenNavigationProp = StackNavigationProp< @@ -30,7 +30,7 @@ export function MoviesListScreen({ navigation }: Props) { useRefreshOnFocus(refetch) const onListItemPress = React.useCallback( - (movie) => { + (movie: MovieDetails) => { navigation.navigate('MovieDetails', { movie, }) @@ -39,7 +39,7 @@ export function MoviesListScreen({ navigation }: Props) { ) const renderItem = React.useCallback( - ({ item }) => { + ({ item }: { item: MovieDetails }) => { return }, [onListItemPress], @@ -48,7 +48,6 @@ export function MoviesListScreen({ navigation }: Props) { if (isPending) return if (error) return - return (