Merge upstream develop
This commit is contained in:
Fallenbagel
@@ -6,6 +6,7 @@ import useSWR from 'swr';
|
||||
|
||||
const messages = defineMessages({
|
||||
somethingwentwrong: 'Something went wrong while retrieving season data.',
|
||||
noepisodes: 'Episode list unavailable.',
|
||||
});
|
||||
|
||||
type SeasonProps = {
|
||||
@@ -29,32 +30,38 @@ const Season = ({ seasonNumber, tvId }: SeasonProps) => {
|
||||
|
||||
return (
|
||||
<div className="flex flex-col justify-center divide-y divide-gray-700">
|
||||
{data.episodes
|
||||
.slice()
|
||||
.reverse()
|
||||
.map((episode) => {
|
||||
return (
|
||||
<div
|
||||
className="flex flex-col space-y-4 py-4 xl:flex-row xl:space-y-4 xl:space-x-4"
|
||||
key={`season-${seasonNumber}-episode-${episode.episodeNumber}`}
|
||||
>
|
||||
<div className="flex-1">
|
||||
<div className="flex flex-col space-y-2 xl:flex-row xl:items-center xl:space-y-0 xl:space-x-2">
|
||||
<h3 className="text-lg">{episode.name}</h3>
|
||||
<AirDateBadge airDate={episode.airDate} />
|
||||
{data.episodes.length === 0 ? (
|
||||
<p>{intl.formatMessage(messages.noepisodes)}</p>
|
||||
) : (
|
||||
data.episodes
|
||||
.slice()
|
||||
.reverse()
|
||||
.map((episode) => {
|
||||
return (
|
||||
<div
|
||||
className="flex flex-col space-y-4 py-4 xl:flex-row xl:space-y-4 xl:space-x-4"
|
||||
key={`season-${seasonNumber}-episode-${episode.episodeNumber}`}
|
||||
>
|
||||
<div className="flex-1">
|
||||
<div className="flex flex-col space-y-2 xl:flex-row xl:items-center xl:space-y-0 xl:space-x-2">
|
||||
<h3 className="text-lg">{episode.name}</h3>
|
||||
{episode.airDate && (
|
||||
<AirDateBadge airDate={episode.airDate} />
|
||||
)}
|
||||
</div>
|
||||
{episode.overview && <p>{episode.overview}</p>}
|
||||
</div>
|
||||
{episode.overview && <p>{episode.overview}</p>}
|
||||
{episode.stillPath && (
|
||||
<img
|
||||
className="h-auto w-full rounded-lg xl:h-32 xl:w-auto"
|
||||
src={`https://image.tmdb.org/t/p/original/${episode.stillPath}`}
|
||||
alt=""
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
{episode.stillPath && (
|
||||
<img
|
||||
className="h-auto w-full rounded-lg xl:h-32 xl:w-auto"
|
||||
src={`https://image.tmdb.org/t/p/original/${episode.stillPath}`}
|
||||
alt=""
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
);
|
||||
})
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -10,6 +10,7 @@ import LoadingSpinner from '@app/components/Common/LoadingSpinner';
|
||||
import PageTitle from '@app/components/Common/PageTitle';
|
||||
import type { PlayButtonLink } from '@app/components/Common/PlayButton';
|
||||
import PlayButton from '@app/components/Common/PlayButton';
|
||||
import StatusBadgeMini from '@app/components/Common/StatusBadgeMini';
|
||||
import Tooltip from '@app/components/Common/Tooltip';
|
||||
import ExternalLinkBlock from '@app/components/ExternalLinkBlock';
|
||||
import IssueModal from '@app/components/IssueModal';
|
||||
@@ -595,75 +596,149 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
|
||||
{((!mSeason &&
|
||||
request?.status === MediaRequestStatus.APPROVED) ||
|
||||
mSeason?.status === MediaStatus.PROCESSING) && (
|
||||
<Badge badgeType="primary">
|
||||
{intl.formatMessage(globalMessages.requested)}
|
||||
</Badge>
|
||||
<>
|
||||
<div className="hidden md:flex">
|
||||
<Badge badgeType="primary">
|
||||
{intl.formatMessage(globalMessages.requested)}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex md:hidden">
|
||||
<StatusBadgeMini
|
||||
status={MediaStatus.PROCESSING}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{((!mSeason &&
|
||||
request?.status === MediaRequestStatus.PENDING) ||
|
||||
mSeason?.status === MediaStatus.PENDING) && (
|
||||
<Badge badgeType="warning">
|
||||
{intl.formatMessage(globalMessages.pending)}
|
||||
</Badge>
|
||||
<>
|
||||
<div className="hidden md:flex">
|
||||
<Badge badgeType="warning">
|
||||
{intl.formatMessage(globalMessages.pending)}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex md:hidden">
|
||||
<StatusBadgeMini status={MediaStatus.PENDING} />
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{mSeason?.status ===
|
||||
MediaStatus.PARTIALLY_AVAILABLE && (
|
||||
<Badge badgeType="success">
|
||||
{intl.formatMessage(
|
||||
globalMessages.partiallyavailable
|
||||
)}
|
||||
</Badge>
|
||||
<>
|
||||
<div className="hidden md:flex">
|
||||
<Badge badgeType="success">
|
||||
{intl.formatMessage(
|
||||
globalMessages.partiallyavailable
|
||||
)}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex md:hidden">
|
||||
<StatusBadgeMini
|
||||
status={MediaStatus.PARTIALLY_AVAILABLE}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{mSeason?.status === MediaStatus.AVAILABLE && (
|
||||
<Badge badgeType="success">
|
||||
{intl.formatMessage(globalMessages.available)}
|
||||
</Badge>
|
||||
<>
|
||||
<div className="hidden md:flex">
|
||||
<Badge badgeType="success">
|
||||
{intl.formatMessage(globalMessages.available)}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex md:hidden">
|
||||
<StatusBadgeMini
|
||||
status={MediaStatus.AVAILABLE}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{((!mSeason4k &&
|
||||
request4k?.status ===
|
||||
MediaRequestStatus.APPROVED) ||
|
||||
mSeason4k?.status4k === MediaStatus.PROCESSING) &&
|
||||
show4k && (
|
||||
<Badge badgeType="primary">
|
||||
{intl.formatMessage(messages.status4k, {
|
||||
status: intl.formatMessage(
|
||||
globalMessages.requested
|
||||
),
|
||||
})}
|
||||
</Badge>
|
||||
<>
|
||||
<div className="hidden md:flex">
|
||||
<Badge badgeType="primary">
|
||||
{intl.formatMessage(messages.status4k, {
|
||||
status: intl.formatMessage(
|
||||
globalMessages.requested
|
||||
),
|
||||
})}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex md:hidden">
|
||||
<StatusBadgeMini
|
||||
status={MediaStatus.PROCESSING}
|
||||
is4k={true}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{((!mSeason4k &&
|
||||
request4k?.status === MediaRequestStatus.PENDING) ||
|
||||
mSeason?.status4k === MediaStatus.PENDING) &&
|
||||
show4k && (
|
||||
<Badge badgeType="warning">
|
||||
{intl.formatMessage(messages.status4k, {
|
||||
status: intl.formatMessage(
|
||||
globalMessages.pending
|
||||
),
|
||||
})}
|
||||
</Badge>
|
||||
<>
|
||||
<div className="hidden md:flex">
|
||||
<Badge badgeType="warning">
|
||||
{intl.formatMessage(messages.status4k, {
|
||||
status: intl.formatMessage(
|
||||
globalMessages.pending
|
||||
),
|
||||
})}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex md:hidden">
|
||||
<StatusBadgeMini
|
||||
status={MediaStatus.PENDING}
|
||||
is4k={true}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{mSeason4k?.status4k ===
|
||||
MediaStatus.PARTIALLY_AVAILABLE &&
|
||||
show4k && (
|
||||
<Badge badgeType="success">
|
||||
{intl.formatMessage(messages.status4k, {
|
||||
status: intl.formatMessage(
|
||||
globalMessages.partiallyavailable
|
||||
),
|
||||
})}
|
||||
</Badge>
|
||||
<>
|
||||
<div className="hidden md:flex">
|
||||
<Badge badgeType="success">
|
||||
{intl.formatMessage(messages.status4k, {
|
||||
status: intl.formatMessage(
|
||||
globalMessages.partiallyavailable
|
||||
),
|
||||
})}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex md:hidden">
|
||||
<StatusBadgeMini
|
||||
status={MediaStatus.PARTIALLY_AVAILABLE}
|
||||
is4k={true}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{mSeason4k?.status4k === MediaStatus.AVAILABLE &&
|
||||
show4k && (
|
||||
<Badge badgeType="success">
|
||||
{intl.formatMessage(messages.status4k, {
|
||||
status: intl.formatMessage(
|
||||
globalMessages.available
|
||||
),
|
||||
})}
|
||||
</Badge>
|
||||
<>
|
||||
<div className="hidden md:flex">
|
||||
<Badge badgeType="success">
|
||||
{intl.formatMessage(messages.status4k, {
|
||||
status: intl.formatMessage(
|
||||
globalMessages.available
|
||||
),
|
||||
})}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex md:hidden">
|
||||
<StatusBadgeMini
|
||||
status={MediaStatus.AVAILABLE}
|
||||
is4k={true}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
<ChevronUpIcon
|
||||
className={`${
|
||||
@@ -788,6 +863,7 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
|
||||
</div>
|
||||
)}
|
||||
{data.nextEpisodeToAir &&
|
||||
data.nextEpisodeToAir.airDate &&
|
||||
data.nextEpisodeToAir.airDate !== data.firstAirDate && (
|
||||
<div className="media-fact">
|
||||
<span>{intl.formatMessage(messages.nextAirDate)}</span>
|
||||
|
||||
Reference in New Issue
Block a user