Qstick
4 years ago
committed by
GitHub
parent
54bcf9eed3
commit
361ffe353d
@ -0,0 +1,27 @@
|
||||
import { connect } from 'react-redux';
|
||||
import { createSelector } from 'reselect';
|
||||
import createImportListSelector from 'Store/Selectors/createImportListSelector';
|
||||
import FilterBuilderRowValue from './FilterBuilderRowValue';
|
||||
|
||||
function createMapStateToProps() {
|
||||
return createSelector(
|
||||
createImportListSelector(),
|
||||
(importLists) => {
|
||||
return {
|
||||
tagList: importLists.map((importList) => {
|
||||
const {
|
||||
id,
|
||||
name
|
||||
} = importList;
|
||||
|
||||
return {
|
||||
id,
|
||||
name
|
||||
};
|
||||
})
|
||||
};
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export default connect(createMapStateToProps)(FilterBuilderRowValue);
|
||||
@ -0,0 +1,3 @@
|
||||
.lists {
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
@ -0,0 +1,43 @@
|
||||
import _ from 'lodash';
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import { kinds, sizes } from 'Helpers/Props';
|
||||
import Label from './Label';
|
||||
import styles from './ImportListList.css';
|
||||
|
||||
function ImportListList({ lists, importListList }) {
|
||||
return (
|
||||
<div className={styles.lists}>
|
||||
{
|
||||
lists.map((t) => {
|
||||
const list = _.find(importListList, { id: t });
|
||||
|
||||
if (!list) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<Label
|
||||
key={list.id}
|
||||
kind={kinds.INFO}
|
||||
size={sizes.MEDIUM}
|
||||
>
|
||||
{list.name}
|
||||
</Label>
|
||||
);
|
||||
})
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
ImportListList.propTypes = {
|
||||
lists: PropTypes.arrayOf(PropTypes.number).isRequired,
|
||||
importListList: PropTypes.arrayOf(PropTypes.object).isRequired
|
||||
};
|
||||
|
||||
ImportListList.defaultProps = {
|
||||
lists: []
|
||||
};
|
||||
|
||||
export default ImportListList;
|
||||
@ -0,0 +1,17 @@
|
||||
import { connect } from 'react-redux';
|
||||
import { createSelector } from 'reselect';
|
||||
import createImportListSelector from 'Store/Selectors/createImportListSelector';
|
||||
import ImportListList from './ImportListList';
|
||||
|
||||
function createMapStateToProps() {
|
||||
return createSelector(
|
||||
createImportListSelector(),
|
||||
(importListList) => {
|
||||
return {
|
||||
importListList
|
||||
};
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export default connect(createMapStateToProps)(ImportListList);
|
||||
@ -0,0 +1,12 @@
|
||||
.infos {
|
||||
display: flex;
|
||||
flex: 0 0 250px;
|
||||
flex-direction: column;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $breakpointSmall) {
|
||||
.infos {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,147 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import { icons } from 'Helpers/Props';
|
||||
import dimensions from 'Styles/Variables/dimensions';
|
||||
import DiscoverMovieOverviewInfoRow from './DiscoverMovieOverviewInfoRow';
|
||||
import styles from './DiscoverMovieOverviewInfo.css';
|
||||
|
||||
const infoRowHeight = parseInt(dimensions.movieIndexOverviewInfoRowHeight);
|
||||
|
||||
const rows = [
|
||||
{
|
||||
name: 'year',
|
||||
showProp: 'showYear',
|
||||
valueProp: 'year'
|
||||
},
|
||||
{
|
||||
name: 'genres',
|
||||
showProp: 'showGenres',
|
||||
valueProp: 'genres'
|
||||
},
|
||||
{
|
||||
name: 'ratings',
|
||||
showProp: 'showRatings',
|
||||
valueProp: 'ratings'
|
||||
},
|
||||
{
|
||||
name: 'certification',
|
||||
showProp: 'showCertification',
|
||||
valueProp: 'certification'
|
||||
},
|
||||
{
|
||||
name: 'studio',
|
||||
showProp: 'showStudio',
|
||||
valueProp: 'studio'
|
||||
}
|
||||
];
|
||||
|
||||
function isVisible(row, props) {
|
||||
const {
|
||||
name,
|
||||
showProp,
|
||||
valueProp
|
||||
} = row;
|
||||
|
||||
if (props[valueProp] == null) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return props[showProp] || props.sortKey === name;
|
||||
}
|
||||
|
||||
function getInfoRowProps(row, props) {
|
||||
const { name } = row;
|
||||
|
||||
if (name === 'year') {
|
||||
return {
|
||||
title: 'Year',
|
||||
iconName: icons.CALENDAR,
|
||||
label: props.year
|
||||
};
|
||||
}
|
||||
|
||||
if (name === 'genres') {
|
||||
return {
|
||||
title: 'Genres',
|
||||
iconName: icons.GENRE,
|
||||
label: props.genres.slice(0, 2).join(', ')
|
||||
};
|
||||
}
|
||||
|
||||
if (name === 'ratings') {
|
||||
return {
|
||||
title: 'Ratings',
|
||||
iconName: icons.HEART,
|
||||
label: `${props.ratings.value * 10}%`
|
||||
};
|
||||
}
|
||||
|
||||
if (name === 'certification') {
|
||||
return {
|
||||
title: 'Certification',
|
||||
iconName: icons.FILM,
|
||||
label: props.certification
|
||||
};
|
||||
}
|
||||
|
||||
if (name === 'studio') {
|
||||
return {
|
||||
title: 'Studio',
|
||||
iconName: icons.STUDIO,
|
||||
label: props.studio
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function DiscoverMovieOverviewInfo(props) {
|
||||
const {
|
||||
height
|
||||
} = props;
|
||||
|
||||
let shownRows = 1;
|
||||
const maxRows = Math.floor(height / (infoRowHeight + 4));
|
||||
|
||||
return (
|
||||
<div className={styles.infos}>
|
||||
{
|
||||
rows.map((row) => {
|
||||
if (!isVisible(row, props)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (shownRows >= maxRows) {
|
||||
return null;
|
||||
}
|
||||
|
||||
shownRows++;
|
||||
|
||||
const infoRowProps = getInfoRowProps(row, props);
|
||||
|
||||
return (
|
||||
<DiscoverMovieOverviewInfoRow
|
||||
key={row.name}
|
||||
{...infoRowProps}
|
||||
/>
|
||||
);
|
||||
})
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
DiscoverMovieOverviewInfo.propTypes = {
|
||||
height: PropTypes.number.isRequired,
|
||||
showStudio: PropTypes.bool.isRequired,
|
||||
showYear: PropTypes.bool.isRequired,
|
||||
showRatings: PropTypes.bool.isRequired,
|
||||
showCertification: PropTypes.bool.isRequired,
|
||||
showGenres: PropTypes.bool.isRequired,
|
||||
studio: PropTypes.string,
|
||||
year: PropTypes.number,
|
||||
certification: PropTypes.string,
|
||||
ratings: PropTypes.object,
|
||||
genres: PropTypes.arrayOf(PropTypes.string).isRequired,
|
||||
sortKey: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
export default DiscoverMovieOverviewInfo;
|
||||
@ -0,0 +1,10 @@
|
||||
.infoRow {
|
||||
flex: 0 0 $movieIndexOverviewInfoRowHeight;
|
||||
margin: 2px 0;
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin-right: 5px;
|
||||
width: 25px !important;
|
||||
text-align: center;
|
||||
}
|
||||
@ -0,0 +1,35 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import Icon from 'Components/Icon';
|
||||
import styles from './DiscoverMovieOverviewInfoRow.css';
|
||||
|
||||
function DiscoverMovieOverviewInfoRow(props) {
|
||||
const {
|
||||
title,
|
||||
iconName,
|
||||
label
|
||||
} = props;
|
||||
|
||||
return (
|
||||
<div
|
||||
className={styles.infoRow}
|
||||
title={title}
|
||||
>
|
||||
<Icon
|
||||
className={styles.icon}
|
||||
name={iconName}
|
||||
size={14}
|
||||
/>
|
||||
|
||||
{label}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
DiscoverMovieOverviewInfoRow.propTypes = {
|
||||
title: PropTypes.string,
|
||||
iconName: PropTypes.object.isRequired,
|
||||
label: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired
|
||||
};
|
||||
|
||||
export default DiscoverMovieOverviewInfoRow;
|
||||
@ -1,133 +0,0 @@
|
||||
import _ from 'lodash';
|
||||
import PropTypes from 'prop-types';
|
||||
import React, { Component } from 'react';
|
||||
import Form from 'Components/Form/Form';
|
||||
import FormGroup from 'Components/Form/FormGroup';
|
||||
import FormInputGroup from 'Components/Form/FormInputGroup';
|
||||
import FormLabel from 'Components/Form/FormLabel';
|
||||
import Button from 'Components/Link/Button';
|
||||
import ModalBody from 'Components/Modal/ModalBody';
|
||||
import ModalContent from 'Components/Modal/ModalContent';
|
||||
import ModalFooter from 'Components/Modal/ModalFooter';
|
||||
import ModalHeader from 'Components/Modal/ModalHeader';
|
||||
import { inputTypes } from 'Helpers/Props';
|
||||
import translate from 'Utilities/String/translate';
|
||||
|
||||
const posterSizeOptions = [
|
||||
{ key: 'small', value: 'Small' },
|
||||
{ key: 'medium', value: 'Medium' },
|
||||
{ key: 'large', value: 'Large' }
|
||||
];
|
||||
|
||||
class AddListMovieOverviewOptionsModalContent extends Component {
|
||||
|
||||
//
|
||||
// Lifecycle
|
||||
|
||||
constructor(props, context) {
|
||||
super(props, context);
|
||||
|
||||
this.state = {
|
||||
size: props.size,
|
||||
showStudio: props.showStudio
|
||||
};
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const {
|
||||
size,
|
||||
showStudio
|
||||
} = this.props;
|
||||
|
||||
const state = {};
|
||||
|
||||
if (size !== prevProps.size) {
|
||||
state.size = size;
|
||||
}
|
||||
|
||||
if (showStudio !== prevProps.showStudio) {
|
||||
state.showStudio = showStudio;
|
||||
}
|
||||
|
||||
if (!_.isEmpty(state)) {
|
||||
this.setState(state);
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Listeners
|
||||
|
||||
onChangeOverviewOption = ({ name, value }) => {
|
||||
this.setState({
|
||||
[name]: value
|
||||
}, () => {
|
||||
this.props.onChangeOverviewOption({ [name]: value });
|
||||
});
|
||||
}
|
||||
|
||||
//
|
||||
// Render
|
||||
|
||||
render() {
|
||||
const {
|
||||
onModalClose
|
||||
} = this.props;
|
||||
|
||||
const {
|
||||
size,
|
||||
showStudio
|
||||
} = this.state;
|
||||
|
||||
return (
|
||||
<ModalContent onModalClose={onModalClose}>
|
||||
<ModalHeader>
|
||||
Overview Options
|
||||
</ModalHeader>
|
||||
|
||||
<ModalBody>
|
||||
<Form>
|
||||
<FormGroup>
|
||||
<FormLabel>{translate('PosterSize')}</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.SELECT}
|
||||
name="size"
|
||||
value={size}
|
||||
values={posterSizeOptions}
|
||||
onChange={this.onChangeOverviewOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
<FormGroup>
|
||||
<FormLabel>{translate('ShowStudio')}</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.CHECK}
|
||||
name="showStudio"
|
||||
value={showStudio}
|
||||
onChange={this.onChangeOverviewOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
</Form>
|
||||
</ModalBody>
|
||||
|
||||
<ModalFooter>
|
||||
<Button
|
||||
onPress={onModalClose}
|
||||
>
|
||||
{translate('Close')}
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
AddListMovieOverviewOptionsModalContent.propTypes = {
|
||||
size: PropTypes.string.isRequired,
|
||||
showStudio: PropTypes.bool.isRequired,
|
||||
onChangeOverviewOption: PropTypes.func.isRequired,
|
||||
onModalClose: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
export default AddListMovieOverviewOptionsModalContent;
|
||||
@ -0,0 +1,239 @@
|
||||
import _ from 'lodash';
|
||||
import PropTypes from 'prop-types';
|
||||
import React, { Component } from 'react';
|
||||
import Form from 'Components/Form/Form';
|
||||
import FormGroup from 'Components/Form/FormGroup';
|
||||
import FormInputGroup from 'Components/Form/FormInputGroup';
|
||||
import FormLabel from 'Components/Form/FormLabel';
|
||||
import Button from 'Components/Link/Button';
|
||||
import ModalBody from 'Components/Modal/ModalBody';
|
||||
import ModalContent from 'Components/Modal/ModalContent';
|
||||
import ModalFooter from 'Components/Modal/ModalFooter';
|
||||
import ModalHeader from 'Components/Modal/ModalHeader';
|
||||
import { inputTypes } from 'Helpers/Props';
|
||||
import translate from 'Utilities/String/translate';
|
||||
|
||||
const posterSizeOptions = [
|
||||
{ key: 'small', value: 'Small' },
|
||||
{ key: 'medium', value: 'Medium' },
|
||||
{ key: 'large', value: 'Large' }
|
||||
];
|
||||
|
||||
class DiscoverMovieOverviewOptionsModalContent extends Component {
|
||||
|
||||
//
|
||||
// Lifecycle
|
||||
|
||||
constructor(props, context) {
|
||||
super(props, context);
|
||||
|
||||
this.state = {
|
||||
size: props.size,
|
||||
showStudio: props.showStudio,
|
||||
showCertification: props.showCertification,
|
||||
showRatings: props.showRatings,
|
||||
showYear: props.showYear,
|
||||
showGenres: props.showGenres,
|
||||
includeRecommendations: props.includeRecommendations
|
||||
};
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const {
|
||||
size,
|
||||
showStudio,
|
||||
showYear,
|
||||
showRatings,
|
||||
showCertification,
|
||||
showGenres,
|
||||
includeRecommendations
|
||||
} = this.props;
|
||||
|
||||
const state = {};
|
||||
|
||||
if (size !== prevProps.size) {
|
||||
state.size = size;
|
||||
}
|
||||
|
||||
if (showStudio !== prevProps.showStudio) {
|
||||
state.showStudio = showStudio;
|
||||
}
|
||||
|
||||
if (showYear !== prevProps.showYear) {
|
||||
state.showYear = showYear;
|
||||
}
|
||||
|
||||
if (showRatings !== prevProps.showRatings) {
|
||||
state.showRatings = showRatings;
|
||||
}
|
||||
|
||||
if (showCertification !== prevProps.showCertification) {
|
||||
state.showCertification = showCertification;
|
||||
}
|
||||
|
||||
if (showGenres !== prevProps.showGenres) {
|
||||
state.showGenres = showGenres;
|
||||
}
|
||||
|
||||
if (includeRecommendations !== prevProps.includeRecommendations) {
|
||||
state.includeRecommendations = includeRecommendations;
|
||||
}
|
||||
|
||||
if (!_.isEmpty(state)) {
|
||||
this.setState(state);
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Listeners
|
||||
|
||||
onChangeOverviewOption = ({ name, value }) => {
|
||||
this.setState({
|
||||
[name]: value
|
||||
}, () => {
|
||||
this.props.onChangeOverviewOption({ [name]: value });
|
||||
});
|
||||
}
|
||||
|
||||
onChangeOption = ({ name, value }) => {
|
||||
this.setState({
|
||||
[name]: value
|
||||
}, () => {
|
||||
this.props.onChangeOption({
|
||||
[name]: value
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
//
|
||||
// Render
|
||||
|
||||
render() {
|
||||
const {
|
||||
onModalClose
|
||||
} = this.props;
|
||||
|
||||
const {
|
||||
size,
|
||||
showStudio,
|
||||
showCertification,
|
||||
showRatings,
|
||||
showYear,
|
||||
showGenres,
|
||||
includeRecommendations
|
||||
} = this.state;
|
||||
|
||||
return (
|
||||
<ModalContent onModalClose={onModalClose}>
|
||||
<ModalHeader>
|
||||
Overview Options
|
||||
</ModalHeader>
|
||||
|
||||
<ModalBody>
|
||||
<Form>
|
||||
<FormGroup>
|
||||
<FormLabel>Include Radarr Recommendations</FormLabel>
|
||||
<FormInputGroup
|
||||
type={inputTypes.CHECK}
|
||||
name="includeRecommendations"
|
||||
value={includeRecommendations}
|
||||
helpText="Include Radarr recommended movies in discovery view"
|
||||
onChange={this.onChangeOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
<FormGroup>
|
||||
<FormLabel>{translate('PosterSize')}</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.SELECT}
|
||||
name="size"
|
||||
value={size}
|
||||
values={posterSizeOptions}
|
||||
onChange={this.onChangeOverviewOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
<FormGroup>
|
||||
<FormLabel>Show Genres</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.CHECK}
|
||||
name="showGenres"
|
||||
value={showGenres}
|
||||
onChange={this.onChangeOverviewOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
<FormGroup>
|
||||
<FormLabel>{translate('ShowStudio')}</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.CHECK}
|
||||
name="showStudio"
|
||||
value={showStudio}
|
||||
onChange={this.onChangeOverviewOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
<FormGroup>
|
||||
<FormLabel>Show Year</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.CHECK}
|
||||
name="showYear"
|
||||
value={showYear}
|
||||
onChange={this.onChangeOverviewOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
<FormGroup>
|
||||
<FormLabel>Show Ratings</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.CHECK}
|
||||
name="showRatings"
|
||||
value={showRatings}
|
||||
onChange={this.onChangeOverviewOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
|
||||
<FormGroup>
|
||||
<FormLabel>Show Certification</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.CHECK}
|
||||
name="showCertification"
|
||||
value={showCertification}
|
||||
onChange={this.onChangeOverviewOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
</Form>
|
||||
</ModalBody>
|
||||
|
||||
<ModalFooter>
|
||||
<Button
|
||||
onPress={onModalClose}
|
||||
>
|
||||
{translate('Close')}
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
DiscoverMovieOverviewOptionsModalContent.propTypes = {
|
||||
size: PropTypes.string.isRequired,
|
||||
showStudio: PropTypes.bool.isRequired,
|
||||
showYear: PropTypes.bool.isRequired,
|
||||
showRatings: PropTypes.bool.isRequired,
|
||||
showCertification: PropTypes.bool.isRequired,
|
||||
showGenres: PropTypes.bool.isRequired,
|
||||
includeRecommendations: PropTypes.bool.isRequired,
|
||||
onChangeOverviewOption: PropTypes.func.isRequired,
|
||||
onChangeOption: PropTypes.func.isRequired,
|
||||
onModalClose: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
export default DiscoverMovieOverviewOptionsModalContent;
|
||||
@ -1,30 +0,0 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import styles from './AddListMoviePosterInfo.css';
|
||||
|
||||
function AddListMoviePosterInfo(props) {
|
||||
const {
|
||||
studio,
|
||||
sortKey
|
||||
} = props;
|
||||
|
||||
if (sortKey === 'studio' && studio) {
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
{studio}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
AddListMoviePosterInfo.propTypes = {
|
||||
studio: PropTypes.string,
|
||||
sortKey: PropTypes.string.isRequired,
|
||||
showRelativeDates: PropTypes.bool.isRequired,
|
||||
shortDateFormat: PropTypes.string.isRequired,
|
||||
timeFormat: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
export default AddListMoviePosterInfo;
|
||||
@ -0,0 +1,139 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import HeartRating from 'Components/HeartRating';
|
||||
import { getMovieStatusDetails } from 'Movie/MovieStatus';
|
||||
import formatRuntime from 'Utilities/Date/formatRuntime';
|
||||
import getRelativeDate from 'Utilities/Date/getRelativeDate';
|
||||
import styles from './DiscoverMoviePosterInfo.css';
|
||||
|
||||
function DiscoverMoviePosterInfo(props) {
|
||||
const {
|
||||
status,
|
||||
studio,
|
||||
inCinemas,
|
||||
digitalRelease,
|
||||
physicalRelease,
|
||||
certification,
|
||||
runtime,
|
||||
ratings,
|
||||
sortKey,
|
||||
showRelativeDates,
|
||||
shortDateFormat,
|
||||
timeFormat
|
||||
} = props;
|
||||
|
||||
if (sortKey === 'status' && status) {
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
{getMovieStatusDetails(status).title}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (sortKey === 'studio' && studio) {
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
{studio}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (sortKey === 'inCinemas' && inCinemas) {
|
||||
const inCinemasDate = getRelativeDate(
|
||||
inCinemas,
|
||||
shortDateFormat,
|
||||
showRelativeDates,
|
||||
{
|
||||
timeFormat,
|
||||
timeForToday: false
|
||||
}
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
{`In Cinemas ${inCinemasDate}`}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (sortKey === 'digitalRelease' && digitalRelease) {
|
||||
const digitalReleaseDate = getRelativeDate(
|
||||
digitalRelease,
|
||||
shortDateFormat,
|
||||
showRelativeDates,
|
||||
{
|
||||
timeFormat,
|
||||
timeForToday: false
|
||||
}
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
{`Digital ${digitalReleaseDate}`}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (sortKey === 'physicalRelease' && physicalRelease) {
|
||||
const physicalReleaseDate = getRelativeDate(
|
||||
physicalRelease,
|
||||
shortDateFormat,
|
||||
showRelativeDates,
|
||||
{
|
||||
timeFormat,
|
||||
timeForToday: false
|
||||
}
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
{`Released ${physicalReleaseDate}`}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (sortKey === 'certification' && certification) {
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
{certification}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (sortKey === 'runtime' && runtime) {
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
{formatRuntime(runtime)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (sortKey === 'ratings' && ratings) {
|
||||
return (
|
||||
<div className={styles.info}>
|
||||
<HeartRating
|
||||
rating={ratings.value}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
DiscoverMoviePosterInfo.propTypes = {
|
||||
status: PropTypes.string,
|
||||
studio: PropTypes.string,
|
||||
inCinemas: PropTypes.string,
|
||||
certification: PropTypes.string,
|
||||
digitalRelease: PropTypes.string,
|
||||
physicalRelease: PropTypes.string,
|
||||
runtime: PropTypes.number,
|
||||
ratings: PropTypes.object,
|
||||
sortKey: PropTypes.string.isRequired,
|
||||
showRelativeDates: PropTypes.bool.isRequired,
|
||||
shortDateFormat: PropTypes.string.isRequired,
|
||||
timeFormat: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
export default DiscoverMoviePosterInfo;
|
||||
@ -0,0 +1,73 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React, { Component } from 'react';
|
||||
import FormGroup from 'Components/Form/FormGroup';
|
||||
import FormInputGroup from 'Components/Form/FormInputGroup';
|
||||
import FormLabel from 'Components/Form/FormLabel';
|
||||
import { inputTypes } from 'Helpers/Props';
|
||||
|
||||
class DiscoverMovieTableOptions extends Component {
|
||||
|
||||
//
|
||||
// Lifecycle
|
||||
|
||||
constructor(props, context) {
|
||||
super(props, context);
|
||||
|
||||
this.state = {
|
||||
includeRecommendations: props.includeRecommendations
|
||||
};
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const { includeRecommendations } = this.props;
|
||||
|
||||
if (includeRecommendations !== prevProps.includeRecommendations) {
|
||||
this.setState({
|
||||
includeRecommendations
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Listeners
|
||||
|
||||
onChangeOption = ({ name, value }) => {
|
||||
this.setState({
|
||||
[name]: value
|
||||
}, () => {
|
||||
this.props.onChangeOption({
|
||||
[name]: value
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
//
|
||||
// Render
|
||||
|
||||
render() {
|
||||
const {
|
||||
includeRecommendations
|
||||
} = this.state;
|
||||
|
||||
return (
|
||||
<FormGroup>
|
||||
<FormLabel>Include Radarr Recommendations</FormLabel>
|
||||
|
||||
<FormInputGroup
|
||||
type={inputTypes.CHECK}
|
||||
name="includeRecommendations"
|
||||
value={includeRecommendations}
|
||||
helpText="Include Radarr recommended movies in discovery view"
|
||||
onChange={this.onChangeOption}
|
||||
/>
|
||||
</FormGroup>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
DiscoverMovieTableOptions.propTypes = {
|
||||
includeRecommendations: PropTypes.bool.isRequired,
|
||||
onChangeOption: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
export default DiscoverMovieTableOptions;
|
||||
@ -0,0 +1,24 @@
|
||||
import { connect } from 'react-redux';
|
||||
import { createSelector } from 'reselect';
|
||||
import { setListMovieOption } from 'Store/Actions/discoverMovieActions';
|
||||
import DiscoverMovieTableOptions from './DiscoverMovieTableOptions';
|
||||
|
||||
function createMapStateToProps() {
|
||||
return createSelector(
|
||||
(state) => state.discoverMovie,
|
||||
(discoverMovie) => {
|
||||
return discoverMovie.options;
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
function createMapDispatchToProps(dispatch, props) {
|
||||
return {
|
||||
onChangeOption(payload) {
|
||||
dispatch(setListMovieOption(payload));
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(createMapStateToProps, createMapDispatchToProps)(DiscoverMovieTableOptions);
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.netImportExclusion {
|
||||
.importExclusion {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
margin-bottom: 10px;
|
||||
@ -0,0 +1,59 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React, { Component } from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { createSelector } from 'reselect';
|
||||
import { deleteImportExclusion, fetchImportExclusions } from 'Store/Actions/settingsActions';
|
||||
import ImportExclusions from './ImportExclusions';
|
||||
|
||||
function createMapStateToProps() {
|
||||
return createSelector(
|
||||
(state) => state.settings.importExclusions,
|
||||
(importExclusions) => {
|
||||
return {
|
||||
...importExclusions
|
||||
};
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
const mapDispatchToProps = {
|
||||
fetchImportExclusions,
|
||||
deleteImportExclusion
|
||||
};
|
||||
|
||||
class ImportExclusionsConnector extends Component {
|
||||
|
||||
//
|
||||
// Lifecycle
|
||||
|
||||
componentDidMount() {
|
||||
this.props.fetchImportExclusions();
|
||||
}
|
||||
|
||||
//
|
||||
// Listeners
|
||||
|
||||
onConfirmDeleteImportExclusion = (id) => {
|
||||
this.props.deleteImportExclusion({ id });
|
||||
}
|
||||
|
||||
//
|
||||
// Render
|
||||
|
||||
render() {
|
||||
return (
|
||||
<ImportExclusions
|
||||
{...this.state}
|
||||
{...this.props}
|
||||
onConfirmDeleteImportExclusion={this.onConfirmDeleteImportExclusion}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
ImportExclusionsConnector.propTypes = {
|
||||
fetchImportExclusions: PropTypes.func.isRequired,
|
||||
deleteImportExclusion: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
export default connect(createMapStateToProps, mapDispatchToProps)(ImportExclusionsConnector);
|
||||
@ -1,4 +1,4 @@
|
||||
.netImport {
|
||||
.importList {
|
||||
composes: card from '~Components/Card.css';
|
||||
|
||||
position: relative;
|
||||
@ -1,4 +1,4 @@
|
||||
.netImports {
|
||||
.importLists {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
@ -0,0 +1,65 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React, { Component } from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { clearPendingChanges } from 'Store/Actions/baseActions';
|
||||
import { cancelSaveImportList, cancelTestImportList } from 'Store/Actions/settingsActions';
|
||||
import EditImportListModal from './EditImportListModal';
|
||||
|
||||
function createMapDispatchToProps(dispatch, props) {
|
||||
const section = 'settings.importLists';
|
||||
|
||||
return {
|
||||
dispatchClearPendingChanges() {
|
||||
dispatch(clearPendingChanges({ section }));
|
||||
},
|
||||
|
||||
dispatchCancelTestImportList() {
|
||||
dispatch(cancelTestImportList({ section }));
|
||||
},
|
||||
|
||||
dispatchCancelSaveImportList() {
|
||||
dispatch(cancelSaveImportList({ section }));
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
class EditImportListModalConnector extends Component {
|
||||
|
||||
//
|
||||
// Listeners
|
||||
|
||||
onModalClose = () => {
|
||||
this.props.dispatchClearPendingChanges();
|
||||
this.props.dispatchCancelTestImportList();
|
||||
this.props.dispatchCancelSaveImportList();
|
||||
this.props.onModalClose();
|
||||
}
|
||||
|
||||
//
|
||||
// Render
|
||||
|
||||
render() {
|
||||
const {
|
||||
dispatchClearPendingChanges,
|
||||
dispatchCancelTestImportList,
|
||||
dispatchCancelSaveImportList,
|
||||
...otherProps
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
<EditImportListModal
|
||||
{...otherProps}
|
||||
onModalClose={this.onModalClose}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
EditImportListModalConnector.propTypes = {
|
||||
onModalClose: PropTypes.func.isRequired,
|
||||
dispatchClearPendingChanges: PropTypes.func.isRequired,
|
||||
dispatchCancelTestImportList: PropTypes.func.isRequired,
|
||||
dispatchCancelSaveImportList: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
export default connect(null, createMapDispatchToProps)(EditImportListModalConnector);
|
||||
@ -1,4 +1,4 @@
|
||||
.netImport {
|
||||
.importList {
|
||||
composes: card from '~Components/Card.css';
|
||||
|
||||
width: 290px;
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue