fix: sort collection parts by release date (#2368)

* fix: order collection parts by release date

* feat(frontend): add posters & release years to collection request modal

* fix(frontend): wrap movie titles in collection request modal
pull/2374/head
TheCatLady 3 years ago committed by GitHub
parent 340f1a2119
commit 1b3797cf6e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -1,3 +1,4 @@
import { sortBy } from 'lodash';
import type { TmdbCollection } from '../api/themoviedb/interfaces';
import { MediaType } from '../constants/media';
import Media from '../entity/Media';
@ -21,7 +22,7 @@ export const mapCollection = (
overview: collection.overview,
posterPath: collection.poster_path,
backdropPath: collection.backdrop_path,
parts: collection.parts.map((part) =>
parts: sortBy(collection.parts, 'release_date').map((part) =>
mapMovieResult(
part,
media?.find(

@ -16,6 +16,7 @@ import { useUser } from '../../hooks/useUser';
import globalMessages from '../../i18n/globalMessages';
import Alert from '../Common/Alert';
import Badge from '../Common/Badge';
import CachedImage from '../Common/CachedImage';
import Modal from '../Common/Modal';
import AdvancedRequester, { RequestOverrides } from './AdvancedRequester';
import QuotaDisplay from './QuotaDisplay';
@ -396,8 +397,29 @@ const CollectionRequestModal: React.FC<RequestModalProps> = ({
></span>
</span>
</td>
<td className="px-1 py-4 text-sm font-medium leading-5 text-gray-100 md:px-6 whitespace-nowrap">
{part.title}
<td className="flex items-center px-1 py-4 text-sm font-medium leading-5 text-gray-100 md:px-6">
<div className="relative flex-shrink-0 w-10 h-auto overflow-hidden rounded-md">
<CachedImage
src={
part.posterPath
? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${part.posterPath}`
: '/images/overseerr_poster_not_found.png'
}
alt=""
layout="responsive"
width={600}
height={900}
objectFit="cover"
/>
</div>
<div className="flex flex-col justify-center pl-2">
<div className="text-xs font-medium">
{part.releaseDate?.slice(0, 4)}
</div>
<div className="text-base font-bold">
{part.title}
</div>
</div>
</td>
<td className="py-4 pr-2 text-sm leading-5 text-gray-200 md:px-6 whitespace-nowrap">
{!partMedia && !partRequest && (

Loading…
Cancel
Save