mirror of
https://github.com/Radarr/Radarr.git
synced 2024-08-18 08:19:38 +02:00
New: Turn MediaInfo Popover into Modal, Add AudioFeatures
This commit is contained in:
parent
5e7f0f9d78
commit
8476e36122
@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
|
||||
import React, { Component } from 'react';
|
||||
import formatBytes from 'Utilities/Number/formatBytes';
|
||||
import IconButton from 'Components/Link/IconButton';
|
||||
import { icons, kinds, tooltipPositions } from 'Helpers/Props';
|
||||
import { icons, kinds } from 'Helpers/Props';
|
||||
import TableRow from 'Components/Table/TableRow';
|
||||
import TableRowCell from 'Components/Table/Cells/TableRowCell';
|
||||
import TableRowCellButton from 'Components/Table/Cells/TableRowCellButton';
|
||||
@ -10,15 +10,13 @@ import MovieQuality from 'Movie/MovieQuality';
|
||||
import MovieFormats from 'Movie/MovieFormats';
|
||||
import MovieLanguage from 'Movie/MovieLanguage';
|
||||
import ConfirmModal from 'Components/Modal/ConfirmModal';
|
||||
import Icon from 'Components/Icon';
|
||||
import Popover from 'Components/Tooltip/Popover';
|
||||
import SelectQualityModal from 'MovieFile/Quality/SelectQualityModal';
|
||||
import SelectLanguageModal from 'MovieFile/Language/SelectLanguageModal';
|
||||
import * as mediaInfoTypes from 'MovieFile/mediaInfoTypes';
|
||||
import MediaInfoConnector from 'MovieFile/MediaInfoConnector';
|
||||
import MovieFileRowCellPlaceholder from './MovieFileRowCellPlaceholder';
|
||||
import MediaInfoPopover from './MediaInfoPopover';
|
||||
import styles from './MovieFileEditorRow.css';
|
||||
import FileDetailsModal from '../FileDetailsModal';
|
||||
|
||||
class MovieFileEditorRow extends Component {
|
||||
|
||||
@ -31,7 +29,8 @@ class MovieFileEditorRow extends Component {
|
||||
this.state = {
|
||||
isSelectQualityModalOpen: false,
|
||||
isSelectLanguageModalOpen: false,
|
||||
isConfirmDeleteModalOpen: false
|
||||
isConfirmDeleteModalOpen: false,
|
||||
isFileDetailsModalOpen: false
|
||||
};
|
||||
}
|
||||
|
||||
@ -68,6 +67,14 @@ class MovieFileEditorRow extends Component {
|
||||
this.setState({ isConfirmDeleteModalOpen: false });
|
||||
}
|
||||
|
||||
onFileDetailsPress = () => {
|
||||
this.setState({ isFileDetailsModalOpen: true });
|
||||
}
|
||||
|
||||
onFileDetailsModalClose = () => {
|
||||
this.setState({ isFileDetailsModalOpen: false });
|
||||
}
|
||||
|
||||
//
|
||||
// Render
|
||||
|
||||
@ -85,6 +92,7 @@ class MovieFileEditorRow extends Component {
|
||||
const {
|
||||
isSelectQualityModalOpen,
|
||||
isSelectLanguageModalOpen,
|
||||
isFileDetailsModalOpen,
|
||||
isConfirmDeleteModalOpen
|
||||
} = this.state;
|
||||
|
||||
@ -170,15 +178,9 @@ class MovieFileEditorRow extends Component {
|
||||
</TableRowCell>
|
||||
|
||||
<TableRowCell className={styles.actions}>
|
||||
<Popover
|
||||
anchor={
|
||||
<Icon
|
||||
name={icons.MEDIA_INFO}
|
||||
/>
|
||||
}
|
||||
title="Media Info"
|
||||
body={<MediaInfoPopover {...mediaInfo} />}
|
||||
position={tooltipPositions.LEFT}
|
||||
<IconButton
|
||||
name={icons.MEDIA_INFO}
|
||||
onPress={this.onFileDetailsPress}
|
||||
/>
|
||||
|
||||
<IconButton
|
||||
@ -188,6 +190,12 @@ class MovieFileEditorRow extends Component {
|
||||
/>
|
||||
</TableRowCell>
|
||||
|
||||
<FileDetailsModal
|
||||
isOpen={isFileDetailsModalOpen}
|
||||
onModalClose={this.onFileDetailsModalClose}
|
||||
mediaInfo={mediaInfo}
|
||||
/>
|
||||
|
||||
<ConfirmModal
|
||||
isOpen={isConfirmDeleteModalOpen}
|
||||
ids={[id]}
|
||||
|
52
frontend/src/MovieFile/FileDetailsModal.js
Normal file
52
frontend/src/MovieFile/FileDetailsModal.js
Normal file
@ -0,0 +1,52 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import { sizes } from 'Helpers/Props';
|
||||
import Button from 'Components/Link/Button';
|
||||
import Modal from 'Components/Modal/Modal';
|
||||
import ModalContent from 'Components/Modal/ModalContent';
|
||||
import ModalHeader from 'Components/Modal/ModalHeader';
|
||||
import ModalBody from 'Components/Modal/ModalBody';
|
||||
import ModalFooter from 'Components/Modal/ModalFooter';
|
||||
import MediaInfoPopover from './Editor/MediaInfoPopover';
|
||||
|
||||
function FileDetailsModal(props) {
|
||||
const {
|
||||
isOpen,
|
||||
onModalClose,
|
||||
mediaInfo
|
||||
} = props;
|
||||
|
||||
return (
|
||||
<Modal
|
||||
isOpen={isOpen}
|
||||
onModalClose={onModalClose}
|
||||
size={sizes.SMALL}
|
||||
>
|
||||
<ModalContent
|
||||
onModalClose={onModalClose}
|
||||
>
|
||||
<ModalHeader>
|
||||
Details
|
||||
</ModalHeader>
|
||||
|
||||
<ModalBody>
|
||||
<MediaInfoPopover {...mediaInfo} />
|
||||
</ModalBody>
|
||||
|
||||
<ModalFooter>
|
||||
<Button onPress={onModalClose}>
|
||||
Close
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
|
||||
FileDetailsModal.propTypes = {
|
||||
isOpen: PropTypes.bool.isRequired,
|
||||
onModalClose: PropTypes.func.isRequired,
|
||||
mediaInfo: PropTypes.object.isRequired
|
||||
};
|
||||
|
||||
export default FileDetailsModal;
|
@ -7,6 +7,7 @@ namespace Radarr.Api.V3.MovieFiles
|
||||
{
|
||||
public class MediaInfoResource : RestResource
|
||||
{
|
||||
public string AudioAdditionalFeatures { get; set; }
|
||||
public int AudioBitrate { get; set; }
|
||||
public decimal AudioChannels { get; set; }
|
||||
public string AudioCodec { get; set; }
|
||||
@ -33,6 +34,7 @@ public static MediaInfoResource ToResource(this MediaInfoModel model, string sce
|
||||
|
||||
return new MediaInfoResource
|
||||
{
|
||||
AudioAdditionalFeatures = model.AudioAdditionalFeatures,
|
||||
AudioBitrate = model.AudioBitrate,
|
||||
AudioChannels = MediaInfoFormatter.FormatAudioChannels(model),
|
||||
AudioLanguages = model.AudioLanguages,
|
||||
|
Loading…
Reference in New Issue
Block a user