New: Add Custom Formats to episode details modal

This commit is contained in:
Mark McDowall 2022-12-02 23:24:00 -08:00
parent 998768bcf2
commit 154da57dc5
4 changed files with 41 additions and 2 deletions

View File

@ -11,6 +11,12 @@
width: 100px;
}
.customFormats {
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 175px;
}
.actions {
composes: cell from '~Components/Table/Cells/TableRowCell.css';

View File

@ -1,6 +1,7 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import Icon from 'Components/Icon';
import Label from 'Components/Label';
import IconButton from 'Components/Link/IconButton';
import ConfirmModal from 'Components/Modal/ConfirmModal';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
@ -52,6 +53,7 @@ class EpisodeFileRow extends Component {
size,
languages,
quality,
customFormats,
languageCutoffNotMet,
qualityCutoffNotMet,
mediaInfo,
@ -115,6 +117,25 @@ class EpisodeFileRow extends Component {
);
}
if (name === 'customFormats') {
return (
<TableRowCell
key={name}
className={styles.customFormats}
>
{
customFormats.map((format) => {
return (
<Label key={format.id}>
{format.name}
</Label>
);
})
}
</TableRowCell>
);
}
if (name === 'actions') {
return (
<TableRowCell
@ -171,6 +192,7 @@ EpisodeFileRow.propTypes = {
languageCutoffNotMet: PropTypes.bool.isRequired,
quality: PropTypes.object.isRequired,
qualityCutoffNotMet: PropTypes.bool.isRequired,
customFormats: PropTypes.arrayOf(PropTypes.object),
mediaInfo: PropTypes.object,
columns: PropTypes.arrayOf(PropTypes.object).isRequired,
onDeleteEpisodeFile: PropTypes.func.isRequired

View File

@ -35,6 +35,12 @@ const columns = [
isSortable: false,
isVisible: true
},
{
name: 'customFormats',
label: 'Formats',
isSortable: false,
isVisible: true
},
{
name: 'actions',
label: '',
@ -86,6 +92,7 @@ class EpisodeSummary extends Component {
size,
languages,
quality,
customFormats,
languageCutoffNotMet,
qualityCutoffNotMet,
onDeleteEpisodeFile
@ -136,6 +143,7 @@ class EpisodeSummary extends Component {
languageCutoffNotMet={languageCutoffNotMet}
quality={quality}
qualityCutoffNotMet={qualityCutoffNotMet}
customFormats={customFormats}
mediaInfo={mediaInfo}
columns={columns}
onDeleteEpisodeFile={onDeleteEpisodeFile}
@ -172,6 +180,7 @@ EpisodeSummary.propTypes = {
languageCutoffNotMet: PropTypes.bool,
quality: PropTypes.object,
qualityCutoffNotMet: PropTypes.bool,
customFormats: PropTypes.arrayOf(PropTypes.object),
onDeleteEpisodeFile: PropTypes.func.isRequired
};

View File

@ -31,7 +31,8 @@ function createMapStateToProps() {
languages,
languageCutoffNotMet,
quality,
qualityCutoffNotMet
qualityCutoffNotMet,
customFormats
} = episodeFile;
return {
@ -45,7 +46,8 @@ function createMapStateToProps() {
languages,
languageCutoffNotMet,
quality,
qualityCutoffNotMet
qualityCutoffNotMet,
customFormats
};
}
);