2024-05-05 21:59:33 +00:00
|
|
|
import './defaults.css'
|
2024-04-29 11:19:01 +00:00
|
|
|
import './App.css'
|
2024-05-02 20:47:28 +00:00
|
|
|
import { MovieWall } from './objects/movie-wall'
|
|
|
|
import { useState, useEffect } from 'react'
|
|
|
|
import tmdb from './objects/tmdb'
|
2024-04-29 11:19:01 +00:00
|
|
|
|
2024-05-02 20:47:28 +00:00
|
|
|
export type Config = {
|
|
|
|
language: string,
|
2024-05-06 09:09:21 +00:00
|
|
|
region: string,
|
|
|
|
page: number,
|
2024-05-02 20:47:28 +00:00
|
|
|
}
|
2024-04-29 11:19:01 +00:00
|
|
|
|
2024-05-02 20:47:28 +00:00
|
|
|
function App() {
|
|
|
|
const [config, setConfig] = useState<Config>({
|
|
|
|
language: "es",
|
2024-05-05 21:59:33 +00:00
|
|
|
region: "spain",
|
|
|
|
page: 1
|
2024-05-02 20:47:28 +00:00
|
|
|
})
|
2024-05-05 21:59:33 +00:00
|
|
|
const [movies, setMovies] = useState([])
|
|
|
|
useEffect(() => { tmdb.getPopular(config, setMovies) }, [])
|
|
|
|
useEffect(() => { console.log(movies) }, [movies])
|
2024-04-29 11:19:01 +00:00
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<header>
|
|
|
|
<h1>Movie Explorer</h1>
|
|
|
|
</header>
|
|
|
|
<main>
|
|
|
|
Let's explore!
|
2024-05-05 21:59:33 +00:00
|
|
|
<div className='flow-container'>
|
2024-05-06 09:09:21 +00:00
|
|
|
<MovieWall movies={movies} setMovies={setMovies} config={config} />
|
2024-05-05 21:59:33 +00:00
|
|
|
</div>
|
2024-04-29 11:19:01 +00:00
|
|
|
</main>
|
2024-05-02 20:47:28 +00:00
|
|
|
|
2024-04-29 11:19:01 +00:00
|
|
|
</>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
export default App
|