112 lines
3.0 KiB
JavaScript
112 lines
3.0 KiB
JavaScript
import React, { useEffect, useCallback } from "react";
|
|
import PropTypes from "prop-types";
|
|
import { useSelector, useDispatch } from "react-redux";
|
|
|
|
import {
|
|
selectMovie,
|
|
movieWishlistToggle,
|
|
fetchMovies,
|
|
getMovieExploreOptions,
|
|
} from "../../actions/movies";
|
|
|
|
import ListDetails from "../list/details";
|
|
import ListPosters from "../list/posters";
|
|
|
|
import { ShowMore } from "../buttons/showMore";
|
|
|
|
import { MovieSubtitlesButton } from "./subtitlesButton";
|
|
import { MovieTorrentsButton } from "./torrentsButton";
|
|
|
|
const fetchUrl = (match) => {
|
|
switch (match.path) {
|
|
case "/movies/polochon":
|
|
return "/movies/polochon";
|
|
case "/movies/wishlist":
|
|
return "/wishlist/movies";
|
|
case "/movies/search/:search":
|
|
return "/movies/search/" + match.params.search;
|
|
case "/movies/explore/:source/:category":
|
|
return (
|
|
"/movies/explore?source=" +
|
|
encodeURI(match.params.source) +
|
|
"&category=" +
|
|
encodeURI(match.params.category)
|
|
);
|
|
default:
|
|
return null;
|
|
}
|
|
};
|
|
|
|
const MovieList = ({ match }) => {
|
|
const dispatch = useDispatch();
|
|
|
|
useEffect(() => {
|
|
const url = fetchUrl(match);
|
|
if (url !== null) {
|
|
dispatch(fetchMovies(url));
|
|
}
|
|
}, [dispatch, match]);
|
|
|
|
const loading = useSelector((state) => state.movies.loading);
|
|
const movies = useSelector((state) => state.movies.movies);
|
|
const selectedImdbId = useSelector((state) => state.movies.selectedImdbId);
|
|
const exploreOptions = useSelector((state) => state.movies.exploreOptions);
|
|
|
|
let selectedMovie = {};
|
|
if (movies !== undefined && movies.has(selectedImdbId)) {
|
|
selectedMovie = movies.get(selectedImdbId);
|
|
}
|
|
|
|
const selectFunc = useCallback((id) => dispatch(selectMovie(id)), [dispatch]);
|
|
const exploreFetchOptions = useCallback(
|
|
() => dispatch(getMovieExploreOptions()),
|
|
[dispatch]
|
|
);
|
|
|
|
return (
|
|
<div className="row">
|
|
<ListPosters
|
|
data={movies}
|
|
type="movies"
|
|
placeHolder="Filter movies..."
|
|
exploreFetchOptions={exploreFetchOptions}
|
|
exploreOptions={exploreOptions}
|
|
selectedImdbId={selectedImdbId}
|
|
onClick={selectFunc}
|
|
onDoubleClick={() => {}}
|
|
onKeyEnter={() => {}}
|
|
params={match.params}
|
|
loading={loading}
|
|
/>
|
|
<ListDetails
|
|
data={selectedMovie}
|
|
loading={loading}
|
|
wishlisted={selectedMovie.wishlisted}
|
|
wishlist={() =>
|
|
dispatch(
|
|
movieWishlistToggle(selectedMovie.imdb_id, selectedMovie.wishlisted)
|
|
)
|
|
}
|
|
>
|
|
<ShowMore
|
|
id={selectedMovie.imdb_id}
|
|
inLibrary={selectedMovie.polochon_url !== ""}
|
|
>
|
|
<MovieTorrentsButton />
|
|
<MovieSubtitlesButton />
|
|
</ShowMore>
|
|
</ListDetails>
|
|
</div>
|
|
);
|
|
};
|
|
MovieList.propTypes = {
|
|
fetchMovies: PropTypes.func,
|
|
getMovieExploreOptions: PropTypes.func,
|
|
updateFilter: PropTypes.func,
|
|
movieWishlistToggle: PropTypes.func,
|
|
selectMovie: PropTypes.func,
|
|
match: PropTypes.object,
|
|
};
|
|
|
|
export default MovieList;
|