Grégoire Delattre 4cae6cc479
Some checks failed
continuous-integration/drone/push Build is failing
Add a component to show the progress of the download
2021-08-24 09:48:42 -10:00

97 lines
3.1 KiB
JavaScript

import React from "react";
import PropTypes from "prop-types";
import { useDispatch, useSelector } from "react-redux";
import { showWishlistToggle } from "../../../actions/shows";
import { prettyEpisodeName } from "../../../utils";
import { Plot } from "../../details/plot";
import { PolochonMetadata } from "../../details/polochon";
import { ReleaseDate } from "../../details/releaseDate";
import { Runtime } from "../../details/runtime";
import { Title } from "../../details/title";
import { DownloadProgress } from "../../details/downloadProgress";
import { DownloadAndStream } from "../../buttons/download";
import { ShowMore } from "../../buttons/showMore";
import { EpisodeSubtitlesButton } from "./subtitlesButton";
import { EpisodeThumb } from "./episodeThumb";
import { EpisodeTorrentsButton } from "./torrentsButton";
export const Episode = ({ season, episode }) => {
const dispatch = useDispatch();
const imdbId = useSelector((state) => state.show.show.imdb_id);
const showTitle = useSelector((state) => state.show.show.title);
const data = useSelector((state) =>
state.show.show.seasons.get(season).get(episode)
);
const isWishlisted = useSelector((state) => {
const trackedSeason = state.show.show.tracked_season;
const trackedEpisode = state.show.show.tracked_episode;
if (trackedSeason == null || trackedEpisode == null) {
return false;
}
if (trackedSeason == 0 || trackedEpisode == 0) {
return true;
}
if (season < trackedSeason) {
return false;
} else if (season > trackedSeason) {
return true;
} else {
return episode >= trackedEpisode;
}
});
return (
<div className="d-flex flex-column flex-lg-row mb-3 pb-3 border-bottom border-light">
<EpisodeThumb season={season} episode={episode} />
<div className="d-flex flex-column">
<Title
title={`${episode}. ${data.title}`}
wishlisted={isWishlisted}
wishlist={() =>
dispatch(showWishlistToggle(isWishlisted, imdbId, season, episode))
}
/>
<ReleaseDate date={data.aired} />
<Runtime runtime={data.runtime} />
<DownloadProgress imdbId={imdbId} season={season} episode={episode} />
<Plot plot={data.plot} />
<DownloadAndStream
name={prettyEpisodeName(showTitle, season, episode)}
url={data.polochon_url}
subtitles={data.subtitles}
/>
<PolochonMetadata
quality={data.quality}
releaseGroup={data.release_group}
container={data.container}
audioCodec={data.audio_codec}
videoCodec={data.video_codec}
size={data.size}
light
/>
<ShowMore
id={prettyEpisodeName(showTitle, season, episode)}
inLibrary={data.polochon_url !== ""}
>
<EpisodeTorrentsButton season={season} episode={episode} />
<EpisodeSubtitlesButton season={season} episode={episode} />
</ShowMore>
</div>
</div>
);
};
Episode.propTypes = {
season: PropTypes.number.isRequired,
episode: PropTypes.number.isRequired,
};