trepa-web/src/components/TmdbSearch.tsx
2024-07-08 21:25:31 +02:00

31 lines
752 B
TypeScript

import { useState } from "react";
import type { Movie } from "../types";
import TmdbSearchInput from "./TmdbSearchInput";
import GroupMoviesList from "./lists/movies/GroupMoviesList";
interface TmdbSearchProps {
onSearch: (movie: Movie) => void;
}
export default function TmdbSearch({ onSearch }: TmdbSearchProps) {
const [movies, setMovies] = useState<Movie[]>([]);
function handleOnSearch(movies: Movie[]) {
setMovies(movies);
}
return (
<>
<div className="row">
<div className="col">
<TmdbSearchInput onSearch={handleOnSearch} />
</div>
</div>
<div style={{ marginTop: "8px" }} className="row">
<div className="col">
<GroupMoviesList movies={movies} onClick={onSearch} />
</div>
</div>
</>
);
}