Mirrors/Radarr
1
0
Fork 0
mirror of https://github.com/Radarr/Radarr.git synced 2024-11-20 01:42:35 +01:00
Code Issues Releases Wiki Activity

New: Add option to show tags on movies Poster and Overview

Browse Source 
(cherry picked from commit e35b39b4b1c88e13f9b1515c68b4d0942f84fa6d)

Closes #10176
This commit is contained in:
Mark McDowall 2024-07-14 11:56:25 -07:00 committed by Bogdan
parent f2af7a1b72
commit a54f54eb6e
12 changed files with 95 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/App/State/MoviesAppState.ts
View File

@ -25,6 +25,7 @@ export interface MovieIndexAppState {
showTmdbRating: boolean;
showImdbRating: boolean;
showRottenTomatoesRating: boolean;
showTags: boolean;
showSearchAction: boolean;
};
@ -37,6 +38,7 @@ export interface MovieIndexAppState {
showAdded: boolean;
showPath: boolean;
showSizeOnDisk: boolean;
showTags: boolean;
showSearchAction: boolean;
};

14
frontend/src/Movie/Index/Overview/MovieIndexOverview.css
View File

@ -80,14 +80,26 @@ $hoverScale: 1.05;
flex: 1 0 auto;
}
.overviewContainer {
display: flex;
justify-content: space-between;
flex: 0 1 1000px;
flex-direction: column;
}
.overview {
composes: link;
flex: 0 1 1000px;
overflow: hidden;
min-height: 0;
}
.tags {
display: flex;
justify-content: space-around;
overflow: hidden;
}
@media only screen and (max-width: $breakpointSmall) {
.overview {
display: none;

2
frontend/src/Movie/Index/Overview/MovieIndexOverview.css.d.ts vendored
View File

@ -10,9 +10,11 @@ interface CssExports {
'info': string;
'link': string;
'overview': string;
'overviewContainer': string;
'poster': string;
'posterContainer': string;
'queue': string;
'tags': string;
'title': string;
'titleRow': string;
}

25
frontend/src/Movie/Index/Overview/MovieIndexOverview.tsx
View File

@ -6,6 +6,7 @@ import Icon from 'Components/Icon';
import IconButton from 'Components/Link/IconButton';
import Link from 'Components/Link/Link';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import TagListConnector from 'Components/TagListConnector';
import Popover from 'Components/Tooltip/Popover';
import { icons } from 'Helpers/Props';
import DeleteMovieModal from 'Movie/Delete/DeleteMovieModal';
@ -69,6 +70,7 @@ function MovieIndexOverview(props: MovieIndexOverviewProps) {
overview,
statistics = {} as Statistics,
images,
tags,
hasFile,
isAvailable,
tmdbId,
@ -212,15 +214,22 @@ function MovieIndexOverview(props: MovieIndexOverviewProps) {
</div>
<div className={styles.details}>
<Link className={styles.overview} to={link}>
<TextTruncate
line={Math.floor(
overviewHeight / (defaultFontSize * lineHeight)
)}
text={overview}
/>
</Link>
<div className={styles.overviewContainer}>
<Link className={styles.overview} to={link}>
<TextTruncate
line={Math.floor(
overviewHeight / (defaultFontSize * lineHeight)
)}
text={overview}
/>
</Link>
{overviewOptions.showTags ? (
<div className={styles.tags}>
<TagListConnector tags={tags} />
</div>
) : null}
</div>
<MovieIndexOverviewInfo
height={overviewHeight}
monitored={monitored}

12
frontend/src/Movie/Index/Overview/Options/MovieIndexOverviewOptionsModalContent.tsx
View File

@ -53,6 +53,7 @@ function MovieIndexOverviewOptionsModalContent(
showAdded,
showPath,
showSizeOnDisk,
showTags,
showSearchAction,
} = useSelector(selectOverviewOptions);
@ -161,6 +162,17 @@ function MovieIndexOverviewOptionsModalContent(
/>
</FormGroup>
<FormGroup>
<FormLabel>{translate('ShowTags')}</FormLabel>
<FormInputGroup
type={inputTypes.CHECK}
name="showTags"
value={showTags}
onChange={onOverviewOptionChange}
/>
</FormGroup>
<FormGroup>
<FormLabel>{translate('ShowSearch')}</FormLabel>

14
frontend/src/Movie/Index/Posters/MovieIndexPoster.css
View File

@ -75,6 +75,20 @@ $hoverScale: 1.05;
}
}
.tags {
display: flex;
align-items: center;
justify-content: space-around;
padding: 0 3px;
height: 21px;
background-color: var(--movieBackgroundColor);
}
.tagsList {
display: flex;
overflow: hidden;
}
.ended {
position: absolute;
top: 0;

2
frontend/src/Movie/Index/Posters/MovieIndexPoster.css.d.ts vendored
View File

@ -13,6 +13,8 @@ interface CssExports {
'overlayTitle': string;
'poster': string;
'posterContainer': string;
'tags': string;
'tagsList': string;
'title': string;
}
export const cssExports: CssExports;

11
frontend/src/Movie/Index/Posters/MovieIndexPoster.tsx
View File

@ -8,6 +8,7 @@ import IconButton from 'Components/Link/IconButton';
import Link from 'Components/Link/Link';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import RottenTomatoRating from 'Components/RottenTomatoRating';
import TagListConnector from 'Components/TagListConnector';
import TmdbRating from 'Components/TmdbRating';
import Popover from 'Components/Tooltip/Popover';
import { icons } from 'Helpers/Props';
@ -51,6 +52,7 @@ function MovieIndexPoster(props: MovieIndexPosterProps) {
showTmdbRating,
showImdbRating,
showRottenTomatoesRating,
showTags,
showSearchAction,
} = useSelector(selectPosterOptions);
@ -80,6 +82,7 @@ function MovieIndexPoster(props: MovieIndexPosterProps) {
certification,
originalTitle,
originalLanguage,
tags,
} = movie;
const { sizeOnDisk = 0 } = statistics;
@ -284,6 +287,14 @@ function MovieIndexPoster(props: MovieIndexPosterProps) {
</div>
) : null}
{showTags && tags.length ? (
<div className={styles.tags}>
<div className={styles.tagsList}>
<TagListConnector tags={tags} />
</div>
</div>
) : null}
<MovieIndexPosterInfo
studio={studio}
qualityProfile={qualityProfile}

5
frontend/src/Movie/Index/Posters/MovieIndexPosters.tsx
View File

@ -148,6 +148,7 @@ export default function MovieIndexPosters(props: MovieIndexPostersProps) {
showTmdbRating,
showImdbRating,
showRottenTomatoesRating,
showTags,
} = posterOptions;
const nextAiringHeight = 19;
@ -191,6 +192,10 @@ export default function MovieIndexPosters(props: MovieIndexPostersProps) {
heights.push(19);
}
if (showTags) {
heights.push(21);
}
switch (sortKey) {
case 'studio':
case 'added':

13
frontend/src/Movie/Index/Posters/Options/MovieIndexPosterOptionsModalContent.tsx
View File

@ -57,6 +57,7 @@ function MovieIndexPosterOptionsModalContent(
showTmdbRating,
showImdbRating,
showRottenTomatoesRating,
showTags,
showSearchAction,
} = posterOptions;
@ -195,6 +196,18 @@ function MovieIndexPosterOptionsModalContent(
/>
</FormGroup>
<FormGroup>
<FormLabel>{translate('ShowTags')}</FormLabel>
<FormInputGroup
type={inputTypes.CHECK}
name="showTags"
value={showTags}
helpText={translate('ShowTagsHelpText')}
onChange={onPosterOptionChange}
/>
</FormGroup>
<FormGroup>
<FormLabel>{translate('ShowSearch')}</FormLabel>

2
frontend/src/Store/Actions/movieIndexActions.js
View File

@ -38,6 +38,7 @@ export const defaultState = {
showTmdbRating: false,
showImdbRating: false,
showRottenTomatoesRating: false,
showTags: false,
showSearchAction: false
},
@ -50,6 +51,7 @@ export const defaultState = {
showAdded: false,
showPath: false,
showSizeOnDisk: false,
showTags: false,
showSearchAction: false
},

2
src/NzbDrone.Core/Localization/Core/en.json
View File

@ -1579,6 +1579,8 @@
"ShowSearchHelpText": "Show search button on hover",
"ShowSizeOnDisk": "Show Size on Disk",
"ShowStudio": "Show Studio",
"ShowTags": "Show Tags",
"ShowTagsHelpText": "Show tags under poster",
"ShowTitle": "Show Title",
"ShowTitleHelpText": "Show movie title under poster",
"ShowTmdbRating": "Show TMDb Rating",