moviebox/src/app/odkrywaj/page.tsx

100 lines
2.7 KiB
TypeScript

import {
getNowPlayingMovies,
getPopularMovies,
getTrendingMovies,
getUpcomingMovies,
} from "@/lib/tmdb/server";
import { Hero } from "@/components/organisms/Hero";
import { FaCalendar, FaChartLine, FaFire, FaPlay } from "react-icons/fa";
import { MovieList } from "@/components/molecules/MovieList";
import { GenreList } from "@/components/molecules/GenreList";
// 12 hours
export const revalidate = 43200;
export default async function Home() {
const lastModified = new Date().toISOString();
const [nowPlayingData, popularData, trendingData, upcomingData] =
await Promise.all([
getNowPlayingMovies(),
getPopularMovies(),
getTrendingMovies(),
getUpcomingMovies(),
]);
// Convert TMDB movie format to our Movie type.
const convertMovies = (movies: any[]) =>
movies.map((movie) => ({
...movie,
genre_ids: JSON.stringify(movie.genre_ids),
seen: false,
favorite: false,
}));
const heroMovies = convertMovies(trendingData.results.slice(0, 5));
const popularMovies = convertMovies(popularData.results);
const trendingMovies = convertMovies(trendingData.results).slice(5);
const nowPlayingMovies = convertMovies(nowPlayingData.results);
const upcomingMovies = convertMovies(upcomingData.results);
return (
<>
<Hero movies={heroMovies} autoRotate />
<section className="blocks">
<MovieList
overrideMovies={nowPlayingMovies}
heading="Teraz w kinach"
loadMore
icon={<FaPlay />}
colors="blue"
showFilters={false}
displayType="list"
/>
</section>
<section className="blocks">
<MovieList
overrideMovies={upcomingMovies}
heading="Nadchodzące filmy"
loadMore
icon={<FaCalendar />}
colors="blue"
showFilters={false}
displayType="list"
/>
</section>
<section className="blocks">
<MovieList
overrideMovies={popularMovies}
heading="Popularne filmy"
loadMore
icon={<FaFire />}
colors="red"
showFilters={false}
displayType="list"
/>
</section>
<section className="blocks">
<MovieList
overrideMovies={trendingMovies}
heading="Trendy dnia"
loadMore
icon={<FaChartLine />}
colors="green"
showFilters={false}
displayType="list"
/>
</section>
<GenreList heading="Odkrywaj filmy według gatunku" />
<div className="p-2 text-center text-xs text-gray-500">
<p>Ostatnia aktualizacja: {lastModified}</p>
</div>
</>
);
}