comprend rien du tout

api/tmdb.tsx

@@ -1,15 +1,75 @@
 import axios from "axios";
+import {Cast, People} from "../components/Movie";
+import Movie from "../components/Movie";
+import Config from "../constants/config";
+
+interface idMovie {
+    id: string
+
+}
+
 
 class apiTMBD {
-    api_key: string = "a133422b5b1f22428e8074470d32186";
-    base_url: string = "https://api.themoviedb.org/3/";
 
-    apiTMDB() {
-    };
 
-    getPopularMovie() {
+    async getTrendingMovie() {
+        const movielist: string[] = [];
+        try {
+            axios.get(Config.base_url + "trending/all/day?api_key=" + Config.api_key).then(async (response) => {
+                await response.data.results.forEach(async function (id: idMovie) {
+                    movielist.push(id.id);
+                    console.log(id.id);
+                    return movielist;
+
+                })
+            })
+        } catch (err) {
+            return movielist;
+        }
+        return [];
+
 
     }
 
+    async getInfoMovie(id: string) {
+        try {
+            axios.get<Movie>(Config.base_url + "movie/" + id + "?api_key=" + Config.api_key).then(async (response) => {
+                let director = await this.getDirector(response.data.id);
+                console.log("----------");
+                console.log(director);
+                console.log("----------");
+            })
+
 
+            /*let newmovie = new Movie(movie.id, movie.original_title, movie.poster_path, movie.runtime, movie.vote_average, director)
+            console.log(newmovie);*/
+            return null;
+        } catch (err) {
+            return null;
+        }
     }
+
+
+    async getDirector(id: string): Promise<string | undefined> {
+        try {
+            const {data: cast} = await axios.get(Config.base_url + "movie/" + id + "/credits?api_key=" + Config.api_key);
+            cast.crew.forEach((people: People) => {
+                if (people.job == "Director") {
+                    console.log(people.name);
+
+                    return people.name;
+                }
+
+            })
+        } catch (err) {
+            return undefined;
+        }
+
+
+    }
+
+
+}
+
+
+export default apiTMBD;

components/ListWidget.tsx

@@ -59,7 +59,7 @@ export function ListWidget(props: ListWidgetProps) {
                     fontWeight: "bold",
                     fontSize: 25,
                     paddingRight: 50
-                }}>{props.director}</Text>
+                }}>{props.name}</Text>
                 <Text style={{color: "grey", fontWeight: "bold", fontSize: 17}}>{formatTime(props.runtime)}</Text>
                 <View style={{marginVertical: 10}}>
                     <BadgeFilm name={"Science-Ficton"}/>

components/Movie.tsx

@@ -0,0 +1,35 @@
+import apiTMBD from "../api/tmdb";
+
+class Movie {
+    id: string
+    original_title: string
+    poster_path: string
+    runtime: number
+    vote_average: number
+
+    director: string | undefined
+
+    constructor(id: string, original_title: string, poster_path: string, runtime: number, vote_average: number, director: string | undefined) {
+        this.id = id;
+        this.original_title = original_title;
+        this.poster_path = poster_path;
+        this.runtime = runtime;
+        this.vote_average = vote_average;
+        this.director = director;
+    }
+
+
+}
+
+export interface Cast {
+    cast: string
+
+}
+
+export interface People {
+    name: string
+    job: string
+
+}
+
+export default Movie;

components/MovieList.tsx

@@ -1,8 +1,9 @@
 import {useEffect, useState} from "react";
 import {FlatList, View} from "react-native";
 import {ListWidget} from "./ListWidget";
-import tmdb from "../api/tmdb"
 import axios from "axios";
+import apiTMBD from "../api/tmdb";
+
 
 interface idMovie {
     id: string
@@ -10,17 +11,6 @@ interface idMovie {
 }
 
 
-interface Cast {
-    cast: string
-
-}
-
-interface People {
-    name: string
-    job: string
-
-}
-
 interface Movie {
     id: string
     original_title: string

constants/config.ts

@@ -0,0 +1,4 @@
+export default {
+    api_key: "a133422b5b1f22428e8074470d321865",
+    base_url: "https://api.themoviedb.org/3/"
+}

navigation/index.tsx

@@ -61,7 +61,7 @@ function BottomTabNavigator() {
 
     return (
         <BottomTab.Navigator
-      initialRouteName="Favorite"
+            initialRouteName="Home"
             screenOptions={{
                 tabBarActiveTintColor: "purple",
 

screens/HomeScreen.tsx

@@ -1,15 +1,29 @@
 import * as React from 'react';
-import {Button,TouchableOpacity,ScrollView,View, Text, StyleSheet, Image, ImageBackground, SafeAreaView} from 'react-native';
+import {
+    Button,
+    TouchableOpacity,
+    ScrollView,
+    View,
+    Text,
+    StyleSheet,
+    Image,
+    ImageBackground,
+    SafeAreaView
+} from 'react-native';
 import {RootStackScreenProps} from "../types.js";
 import Rive from 'rive-react-native';
 import {useEffect, useRef, useState} from "react";
 import {RiveViewManager} from "rive-react-native/lib/typescript/Rive.js";
 import {useSafeAreaInsets} from "react-native-safe-area-context";
+import {Movie} from "../interfaces";
+import apiTMBD from '../api/tmdb';
 
 export default function App({navigation}: RootStackScreenProps<'Home'>) {
     const insets = useSafeAreaInsets();
-
+    let [movies, setMovies] = useState<Movie[]>([]);
-
+    var api = new apiTMBD();
+    let moviess: string[] = api.getTrendingMovie();
+    api.getInfoMovie("505642");
 
     const styles = StyleSheet.create({
         background: {
@@ -94,37 +108,58 @@ export default function App({ navigation }: RootStackScreenProps<'Home'>) {
                     <BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
 
 
-
                 </ScrollView>
             </View>
-            <View style={{ flexDirection: 'column', alignSelf: 'flex-start', alignItems: 'flex-start', paddingHorizontal: 30, flex: 1 }}>
+            <View style={{
-
+                flexDirection: 'column',
-                <View style={{ flexDirection: 'row', alignSelf: 'flex-start', justifyContent: 'flex-start', width: "100%"}}>
+                alignSelf: 'flex-start',
+                alignItems: 'flex-start',
+                paddingHorizontal: 30,
+                flex: 1
+            }}>
+
+                <View style={{
+                    flexDirection: 'row',
+                    alignSelf: 'flex-start',
+                    justifyContent: 'flex-start',
+                    width: "100%"
+                }}>
                     <BadgeFilm name={"Science-fiction"}></BadgeFilm>
                     <BadgeFilm name={"Science-fiction"}></BadgeFilm>
                     <BadgeFilm name={"9:11"}></BadgeFilm>
                 </View>
                 <View>
-                        <Text numberOfLines={1} style={{color: "white", fontSize: 28, fontWeight: "bold", paddingTop: 5}}>SPIDER-MAN No Way Home</Text>
+                    <Text numberOfLines={1} style={{color: "white", fontSize: 28, fontWeight: "bold", paddingTop: 5}}>SPIDER-MAN
+                        No Way Home</Text>
                 </View>
                 <Text style={{color: "grey", fontSize: 20, fontWeight: "bold"}}>Jean-Marc généreux</Text>
             </View>
-            <View style={{ flexDirection: 'row' ,alignItems: 'center', justifyContent: "space-evenly", paddingHorizontal: 30, height: '15%', width:'100%'}}>
+            <View style={{
+                flexDirection: 'row',
+                alignItems: 'center',
+                justifyContent: "space-evenly",
+                paddingHorizontal: 30,
+                height: '15%',
+                width: '100%'
+            }}>
                 <TouchableOpacity>
                     <Image
-                    source={require('../assets/images/WatchLater.png')} style={{ resizeMode:"stretch",  height:'65%', aspectRatio: 1,}}
+                        source={require('../assets/images/WatchLater.png')}
+                        style={{resizeMode: "stretch", height: '65%', aspectRatio: 1,}}
                     />
 
                 </TouchableOpacity>
                 <TouchableOpacity>
                     <Image
-                    source={require('../assets/images/Generate.png')} style={{resizeMode:"stretch", height:'85%',aspectRatio: 1,}}
+                        source={require('../assets/images/Generate.png')}
+                        style={{resizeMode: "stretch", height: '85%', aspectRatio: 1,}}
                     />
 
                 </TouchableOpacity>
                 <TouchableOpacity>
                     <Image
-                    source={require('../assets/images/Favorite.png')} style={{ resizeMode:"stretch", height:'65%', aspectRatio: 1,}}
+                        source={require('../assets/images/Favorite.png')}
+                        style={{resizeMode: "stretch", height: '65%', aspectRatio: 1,}}
                     />
 
                 </TouchableOpacity>
@@ -142,15 +177,30 @@ type BadgeGenreProps = {
 export function BadgeGenre(props: BadgeGenreProps) {
     if (props.isSelected == false) {
         return (
-            <View style={{paddingHorizontal: 20,  marginHorizontal: 5,height: 35, backgroundColor: '#2E2E2E', borderRadius: 20, justifyContent: "center"}} >
+            <View style={{
+                paddingHorizontal: 20,
+                marginHorizontal: 5,
+                height: 35,
+                backgroundColor: '#2E2E2E',
+                borderRadius: 20,
+                justifyContent: "center"
+            }}>
                 <Text style={{color: "white"}}>{props.name}</Text>
             </View>
 
         );
-    }
+    } else {
-    else{
         return (
-            <View style={{paddingHorizontal: 20,  marginHorizontal: 5,height: 35, backgroundColor: '#5C5C5C', borderRadius: 20, borderWidth: 1, borderColor: "white" ,justifyContent: "center"}} >
+            <View style={{
+                paddingHorizontal: 20,
+                marginHorizontal: 5,
+                height: 35,
+                backgroundColor: '#5C5C5C',
+                borderRadius: 20,
+                borderWidth: 1,
+                borderColor: "white",
+                justifyContent: "center"
+            }}>
                 <Text style={{color: "white"}}>{props.name}</Text>
             </View>
 
@@ -164,10 +214,19 @@ type BadgeFilmProps = {
     name: String
 
 }
+
 export function BadgeFilm(props: BadgeFilmProps) {
 
     return (
-            <View style={{paddingHorizontal: 15,  marginHorizontal: 5,height: 30, backgroundColor: '#8906B8', borderRadius: 15, justifyContent: "center", alignSelf: "flex-start"}} >
+        <View style={{
+            paddingHorizontal: 15,
+            marginHorizontal: 5,
+            height: 30,
+            backgroundColor: '#8906B8',
+            borderRadius: 15,
+            justifyContent: "center",
+            alignSelf: "flex-start"
+        }}>
             <Text style={{color: "white", fontSize: 12, fontWeight: "bold"}}>{props.name}</Text>
         </View>