Bogdan
5 months ago
committed by
Mark McDowall
parent
6660db22ec
commit
e6e1078c15
@ -1,27 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React from 'react';
|
|
||||||
import Modal from 'Components/Modal/Modal';
|
|
||||||
import { sizes } from 'Helpers/Props';
|
|
||||||
import EditReleaseProfileModalContentConnector from './EditReleaseProfileModalContentConnector';
|
|
||||||
|
|
||||||
function EditReleaseProfileModal({ isOpen, onModalClose, ...otherProps }) {
|
|
||||||
return (
|
|
||||||
<Modal
|
|
||||||
size={sizes.MEDIUM}
|
|
||||||
isOpen={isOpen}
|
|
||||||
onModalClose={onModalClose}
|
|
||||||
>
|
|
||||||
<EditReleaseProfileModalContentConnector
|
|
||||||
{...otherProps}
|
|
||||||
onModalClose={onModalClose}
|
|
||||||
/>
|
|
||||||
</Modal>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
EditReleaseProfileModal.propTypes = {
|
|
||||||
isOpen: PropTypes.bool.isRequired,
|
|
||||||
onModalClose: PropTypes.func.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
export default EditReleaseProfileModal;
|
|
||||||
@ -0,0 +1,41 @@
|
|||||||
|
import React, { useCallback } from 'react';
|
||||||
|
import { useDispatch } from 'react-redux';
|
||||||
|
import Modal from 'Components/Modal/Modal';
|
||||||
|
import { sizes } from 'Helpers/Props';
|
||||||
|
import { clearPendingChanges } from 'Store/Actions/baseActions';
|
||||||
|
import EditReleaseProfileModalContent from './EditReleaseProfileModalContent';
|
||||||
|
|
||||||
|
interface EditReleaseProfileModalProps {
|
||||||
|
id?: number;
|
||||||
|
isOpen: boolean;
|
||||||
|
onModalClose: () => void;
|
||||||
|
onDeleteReleaseProfilePress?: () => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
function EditReleaseProfileModal({
|
||||||
|
isOpen,
|
||||||
|
onModalClose,
|
||||||
|
...otherProps
|
||||||
|
}: EditReleaseProfileModalProps) {
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
const handleModalClose = useCallback(() => {
|
||||||
|
dispatch(
|
||||||
|
clearPendingChanges({
|
||||||
|
section: 'settings.releaseProfiles',
|
||||||
|
})
|
||||||
|
);
|
||||||
|
onModalClose();
|
||||||
|
}, [dispatch, onModalClose]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Modal size={sizes.MEDIUM} isOpen={isOpen} onModalClose={handleModalClose}>
|
||||||
|
<EditReleaseProfileModalContent
|
||||||
|
{...otherProps}
|
||||||
|
onModalClose={handleModalClose}
|
||||||
|
/>
|
||||||
|
</Modal>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default EditReleaseProfileModal;
|
||||||
@ -1,39 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React, { Component } from 'react';
|
|
||||||
import { connect } from 'react-redux';
|
|
||||||
import { clearPendingChanges } from 'Store/Actions/baseActions';
|
|
||||||
import EditReleaseProfileModal from './EditReleaseProfileModal';
|
|
||||||
|
|
||||||
const mapDispatchToProps = {
|
|
||||||
clearPendingChanges
|
|
||||||
};
|
|
||||||
|
|
||||||
class EditReleaseProfileModalConnector extends Component {
|
|
||||||
|
|
||||||
//
|
|
||||||
// Listeners
|
|
||||||
|
|
||||||
onModalClose = () => {
|
|
||||||
this.props.clearPendingChanges({ section: 'settings.releaseProfiles' });
|
|
||||||
this.props.onModalClose();
|
|
||||||
};
|
|
||||||
|
|
||||||
//
|
|
||||||
// Render
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<EditReleaseProfileModal
|
|
||||||
{...this.props}
|
|
||||||
onModalClose={this.onModalClose}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
EditReleaseProfileModalConnector.propTypes = {
|
|
||||||
onModalClose: PropTypes.func.isRequired,
|
|
||||||
clearPendingChanges: PropTypes.func.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
export default connect(null, mapDispatchToProps)(EditReleaseProfileModalConnector);
|
|
||||||
@ -1,112 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React, { Component } from 'react';
|
|
||||||
import { connect } from 'react-redux';
|
|
||||||
import { createSelector } from 'reselect';
|
|
||||||
import { saveReleaseProfile, setReleaseProfileValue } from 'Store/Actions/settingsActions';
|
|
||||||
import selectSettings from 'Store/Selectors/selectSettings';
|
|
||||||
import EditReleaseProfileModalContent from './EditReleaseProfileModalContent';
|
|
||||||
|
|
||||||
const newReleaseProfile = {
|
|
||||||
enabled: true,
|
|
||||||
required: [],
|
|
||||||
ignored: [],
|
|
||||||
tags: [],
|
|
||||||
indexerId: 0
|
|
||||||
};
|
|
||||||
|
|
||||||
function createMapStateToProps() {
|
|
||||||
return createSelector(
|
|
||||||
(state, { id }) => id,
|
|
||||||
(state) => state.settings.releaseProfiles,
|
|
||||||
(id, releaseProfiles) => {
|
|
||||||
const {
|
|
||||||
isFetching,
|
|
||||||
error,
|
|
||||||
isSaving,
|
|
||||||
saveError,
|
|
||||||
pendingChanges,
|
|
||||||
items
|
|
||||||
} = releaseProfiles;
|
|
||||||
|
|
||||||
const profile = id ? items.find((i) => i.id === id) : newReleaseProfile;
|
|
||||||
const settings = selectSettings(profile, pendingChanges, saveError);
|
|
||||||
|
|
||||||
return {
|
|
||||||
id,
|
|
||||||
isFetching,
|
|
||||||
error,
|
|
||||||
isSaving,
|
|
||||||
saveError,
|
|
||||||
item: settings.settings,
|
|
||||||
...settings
|
|
||||||
};
|
|
||||||
}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const mapDispatchToProps = {
|
|
||||||
setReleaseProfileValue,
|
|
||||||
saveReleaseProfile
|
|
||||||
};
|
|
||||||
|
|
||||||
class EditReleaseProfileModalContentConnector extends Component {
|
|
||||||
|
|
||||||
//
|
|
||||||
// Lifecycle
|
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
if (!this.props.id) {
|
|
||||||
Object.keys(newReleaseProfile).forEach((name) => {
|
|
||||||
this.props.setReleaseProfileValue({
|
|
||||||
name,
|
|
||||||
value: newReleaseProfile[name]
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidUpdate(prevProps, prevState) {
|
|
||||||
if (prevProps.isSaving && !this.props.isSaving && !this.props.saveError) {
|
|
||||||
this.props.onModalClose();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//
|
|
||||||
// Listeners
|
|
||||||
|
|
||||||
onInputChange = ({ name, value }) => {
|
|
||||||
this.props.setReleaseProfileValue({ name, value });
|
|
||||||
};
|
|
||||||
|
|
||||||
onSavePress = () => {
|
|
||||||
this.props.saveReleaseProfile({ id: this.props.id });
|
|
||||||
};
|
|
||||||
|
|
||||||
//
|
|
||||||
// Render
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<EditReleaseProfileModalContent
|
|
||||||
{...this.props}
|
|
||||||
onSavePress={this.onSavePress}
|
|
||||||
onTestPress={this.onTestPress}
|
|
||||||
onInputChange={this.onInputChange}
|
|
||||||
onFieldChange={this.onFieldChange}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
EditReleaseProfileModalContentConnector.propTypes = {
|
|
||||||
id: PropTypes.number,
|
|
||||||
isFetching: PropTypes.bool.isRequired,
|
|
||||||
isSaving: PropTypes.bool.isRequired,
|
|
||||||
saveError: PropTypes.object,
|
|
||||||
item: PropTypes.object.isRequired,
|
|
||||||
setReleaseProfileValue: PropTypes.func.isRequired,
|
|
||||||
saveReleaseProfile: PropTypes.func.isRequired,
|
|
||||||
onModalClose: PropTypes.func.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
export default connect(createMapStateToProps, mapDispatchToProps)(EditReleaseProfileModalContentConnector);
|
|
||||||
@ -1,206 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React, { Component } from 'react';
|
|
||||||
import MiddleTruncate from 'react-middle-truncate';
|
|
||||||
import Card from 'Components/Card';
|
|
||||||
import Label from 'Components/Label';
|
|
||||||
import ConfirmModal from 'Components/Modal/ConfirmModal';
|
|
||||||
import TagList from 'Components/TagList';
|
|
||||||
import { kinds } from 'Helpers/Props';
|
|
||||||
import translate from 'Utilities/String/translate';
|
|
||||||
import EditReleaseProfileModalConnector from './EditReleaseProfileModalConnector';
|
|
||||||
import styles from './ReleaseProfile.css';
|
|
||||||
|
|
||||||
class ReleaseProfile extends Component {
|
|
||||||
|
|
||||||
//
|
|
||||||
// Lifecycle
|
|
||||||
|
|
||||||
constructor(props, context) {
|
|
||||||
super(props, context);
|
|
||||||
|
|
||||||
this.state = {
|
|
||||||
isEditReleaseProfileModalOpen: false,
|
|
||||||
isDeleteReleaseProfileModalOpen: false
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
//
|
|
||||||
// Listeners
|
|
||||||
|
|
||||||
onEditReleaseProfilePress = () => {
|
|
||||||
this.setState({ isEditReleaseProfileModalOpen: true });
|
|
||||||
};
|
|
||||||
|
|
||||||
onEditReleaseProfileModalClose = () => {
|
|
||||||
this.setState({ isEditReleaseProfileModalOpen: false });
|
|
||||||
};
|
|
||||||
|
|
||||||
onDeleteReleaseProfilePress = () => {
|
|
||||||
this.setState({
|
|
||||||
isEditReleaseProfileModalOpen: false,
|
|
||||||
isDeleteReleaseProfileModalOpen: true
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
onDeleteReleaseProfileModalClose = () => {
|
|
||||||
this.setState({ isDeleteReleaseProfileModalOpen: false });
|
|
||||||
};
|
|
||||||
|
|
||||||
onConfirmDeleteReleaseProfile = () => {
|
|
||||||
this.props.onConfirmDeleteReleaseProfile(this.props.id);
|
|
||||||
};
|
|
||||||
|
|
||||||
//
|
|
||||||
// Render
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const {
|
|
||||||
id,
|
|
||||||
name,
|
|
||||||
enabled,
|
|
||||||
required,
|
|
||||||
ignored,
|
|
||||||
tags,
|
|
||||||
indexerId,
|
|
||||||
tagList,
|
|
||||||
indexerList
|
|
||||||
} = this.props;
|
|
||||||
|
|
||||||
const {
|
|
||||||
isEditReleaseProfileModalOpen,
|
|
||||||
isDeleteReleaseProfileModalOpen
|
|
||||||
} = this.state;
|
|
||||||
|
|
||||||
const indexer = indexerId !== 0 && indexerList.find((i) => i.id === indexerId);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Card
|
|
||||||
className={styles.releaseProfile}
|
|
||||||
overlayContent={true}
|
|
||||||
onPress={this.onEditReleaseProfilePress}
|
|
||||||
>
|
|
||||||
{
|
|
||||||
name ?
|
|
||||||
<div className={styles.name}>
|
|
||||||
{name}
|
|
||||||
</div> :
|
|
||||||
null
|
|
||||||
}
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{
|
|
||||||
required.map((item) => {
|
|
||||||
if (!item) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Label
|
|
||||||
className={styles.label}
|
|
||||||
key={item}
|
|
||||||
kind={kinds.SUCCESS}
|
|
||||||
>
|
|
||||||
<MiddleTruncate
|
|
||||||
text={item}
|
|
||||||
start={10}
|
|
||||||
end={10}
|
|
||||||
/>
|
|
||||||
</Label>
|
|
||||||
);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{
|
|
||||||
ignored.map((item) => {
|
|
||||||
if (!item) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Label
|
|
||||||
className={styles.label}
|
|
||||||
key={item}
|
|
||||||
kind={kinds.DANGER}
|
|
||||||
>
|
|
||||||
<MiddleTruncate
|
|
||||||
text={item}
|
|
||||||
start={10}
|
|
||||||
end={10}
|
|
||||||
/>
|
|
||||||
</Label>
|
|
||||||
);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<TagList
|
|
||||||
tags={tags}
|
|
||||||
tagList={tagList}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{
|
|
||||||
!enabled &&
|
|
||||||
<Label
|
|
||||||
kind={kinds.DISABLED}
|
|
||||||
outline={true}
|
|
||||||
>
|
|
||||||
{translate('Disabled')}
|
|
||||||
</Label>
|
|
||||||
}
|
|
||||||
|
|
||||||
{
|
|
||||||
indexer &&
|
|
||||||
<Label
|
|
||||||
kind={kinds.INFO}
|
|
||||||
outline={true}
|
|
||||||
>
|
|
||||||
{indexer.name}
|
|
||||||
</Label>
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<EditReleaseProfileModalConnector
|
|
||||||
id={id}
|
|
||||||
isOpen={isEditReleaseProfileModalOpen}
|
|
||||||
onModalClose={this.onEditReleaseProfileModalClose}
|
|
||||||
onDeleteReleaseProfilePress={this.onDeleteReleaseProfilePress}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<ConfirmModal
|
|
||||||
isOpen={isDeleteReleaseProfileModalOpen}
|
|
||||||
kind={kinds.DANGER}
|
|
||||||
title={translate('DeleteReleaseProfile')}
|
|
||||||
message={translate('DeleteReleaseProfileMessageText', { name })}
|
|
||||||
confirmLabel={translate('Delete')}
|
|
||||||
onConfirm={this.onConfirmDeleteReleaseProfile}
|
|
||||||
onCancel={this.onDeleteReleaseProfileModalClose}
|
|
||||||
/>
|
|
||||||
</Card>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ReleaseProfile.propTypes = {
|
|
||||||
id: PropTypes.number.isRequired,
|
|
||||||
name: PropTypes.string,
|
|
||||||
enabled: PropTypes.bool.isRequired,
|
|
||||||
required: PropTypes.arrayOf(PropTypes.string).isRequired,
|
|
||||||
ignored: PropTypes.arrayOf(PropTypes.string).isRequired,
|
|
||||||
tags: PropTypes.arrayOf(PropTypes.number).isRequired,
|
|
||||||
indexerId: PropTypes.number.isRequired,
|
|
||||||
tagList: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
||||||
indexerList: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
||||||
onConfirmDeleteReleaseProfile: PropTypes.func.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
ReleaseProfile.defaultProps = {
|
|
||||||
enabled: true,
|
|
||||||
required: [],
|
|
||||||
ignored: [],
|
|
||||||
indexerId: 0
|
|
||||||
};
|
|
||||||
|
|
||||||
export default ReleaseProfile;
|
|
||||||
@ -0,0 +1,132 @@
|
|||||||
|
import React, { useCallback } from 'react';
|
||||||
|
// @ts-expect-error 'MiddleTruncate' isn't typed
|
||||||
|
import MiddleTruncate from 'react-middle-truncate';
|
||||||
|
import { useDispatch } from 'react-redux';
|
||||||
|
import { Tag } from 'App/State/TagsAppState';
|
||||||
|
import Card from 'Components/Card';
|
||||||
|
import Label from 'Components/Label';
|
||||||
|
import ConfirmModal from 'Components/Modal/ConfirmModal';
|
||||||
|
import TagList from 'Components/TagList';
|
||||||
|
import useModalOpenState from 'Helpers/Hooks/useModalOpenState';
|
||||||
|
import { kinds } from 'Helpers/Props';
|
||||||
|
import { deleteReleaseProfile } from 'Store/Actions/Settings/releaseProfiles';
|
||||||
|
import Indexer from 'typings/Indexer';
|
||||||
|
import ReleaseProfile from 'typings/Settings/ReleaseProfile';
|
||||||
|
import translate from 'Utilities/String/translate';
|
||||||
|
import EditReleaseProfileModal from './EditReleaseProfileModal';
|
||||||
|
import styles from './ReleaseProfileRow.css';
|
||||||
|
|
||||||
|
interface ReleaseProfileProps extends ReleaseProfile {
|
||||||
|
tagList: Tag[];
|
||||||
|
indexerList: Indexer[];
|
||||||
|
}
|
||||||
|
|
||||||
|
function ReleaseProfileRow(props: ReleaseProfileProps) {
|
||||||
|
const {
|
||||||
|
id,
|
||||||
|
name,
|
||||||
|
enabled = true,
|
||||||
|
required = [],
|
||||||
|
ignored = [],
|
||||||
|
tags,
|
||||||
|
indexerId = 0,
|
||||||
|
tagList,
|
||||||
|
indexerList,
|
||||||
|
} = props;
|
||||||
|
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
const [
|
||||||
|
isEditReleaseProfileModalOpen,
|
||||||
|
setEditReleaseProfileModalOpen,
|
||||||
|
setEditReleaseProfileModalClosed,
|
||||||
|
] = useModalOpenState(false);
|
||||||
|
|
||||||
|
const [
|
||||||
|
isDeleteReleaseProfileModalOpen,
|
||||||
|
setDeleteReleaseProfileModalOpen,
|
||||||
|
setDeleteReleaseProfileModalClosed,
|
||||||
|
] = useModalOpenState(false);
|
||||||
|
|
||||||
|
const handleDeletePress = useCallback(() => {
|
||||||
|
dispatch(deleteReleaseProfile({ id }));
|
||||||
|
}, [id, dispatch]);
|
||||||
|
|
||||||
|
const indexer =
|
||||||
|
indexerId !== 0 && indexerList.find((i) => i.id === indexerId);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Card
|
||||||
|
className={styles.releaseProfile}
|
||||||
|
overlayContent={true}
|
||||||
|
onPress={setEditReleaseProfileModalOpen}
|
||||||
|
>
|
||||||
|
{name ? <div className={styles.name}>{name}</div> : null}
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{required.map((item) => {
|
||||||
|
if (!item) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Label key={item} className={styles.label} kind={kinds.SUCCESS}>
|
||||||
|
<MiddleTruncate text={item} start={10} end={10} />
|
||||||
|
</Label>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{ignored.map((item) => {
|
||||||
|
if (!item) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Label key={item} className={styles.label} kind={kinds.DANGER}>
|
||||||
|
<MiddleTruncate text={item} start={10} end={10} />
|
||||||
|
</Label>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<TagList tags={tags} tagList={tagList} />
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{enabled ? null : (
|
||||||
|
<Label kind={kinds.DISABLED} outline={true}>
|
||||||
|
{translate('Disabled')}
|
||||||
|
</Label>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{indexer ? (
|
||||||
|
<Label kind={kinds.INFO} outline={true}>
|
||||||
|
{indexer.name}
|
||||||
|
</Label>
|
||||||
|
) : null}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<EditReleaseProfileModal
|
||||||
|
id={id}
|
||||||
|
isOpen={isEditReleaseProfileModalOpen}
|
||||||
|
onModalClose={setEditReleaseProfileModalClosed}
|
||||||
|
onDeleteReleaseProfilePress={setDeleteReleaseProfileModalOpen}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<ConfirmModal
|
||||||
|
isOpen={isDeleteReleaseProfileModalOpen}
|
||||||
|
kind={kinds.DANGER}
|
||||||
|
title={translate('DeleteReleaseProfile')}
|
||||||
|
message={translate('DeleteReleaseProfileMessageText', {
|
||||||
|
name: name ?? id,
|
||||||
|
})}
|
||||||
|
confirmLabel={translate('Delete')}
|
||||||
|
onConfirm={handleDeletePress}
|
||||||
|
onCancel={setDeleteReleaseProfileModalClosed}
|
||||||
|
/>
|
||||||
|
</Card>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ReleaseProfileRow;
|
||||||
@ -1,102 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React, { Component } from 'react';
|
|
||||||
import Card from 'Components/Card';
|
|
||||||
import FieldSet from 'Components/FieldSet';
|
|
||||||
import Icon from 'Components/Icon';
|
|
||||||
import PageSectionContent from 'Components/Page/PageSectionContent';
|
|
||||||
import { icons } from 'Helpers/Props';
|
|
||||||
import translate from 'Utilities/String/translate';
|
|
||||||
import EditReleaseProfileModalConnector from './EditReleaseProfileModalConnector';
|
|
||||||
import ReleaseProfile from './ReleaseProfile';
|
|
||||||
import styles from './ReleaseProfiles.css';
|
|
||||||
|
|
||||||
class ReleaseProfiles extends Component {
|
|
||||||
|
|
||||||
//
|
|
||||||
// Lifecycle
|
|
||||||
|
|
||||||
constructor(props, context) {
|
|
||||||
super(props, context);
|
|
||||||
|
|
||||||
this.state = {
|
|
||||||
isAddReleaseProfileModalOpen: false
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
//
|
|
||||||
// Listeners
|
|
||||||
|
|
||||||
onAddReleaseProfilePress = () => {
|
|
||||||
this.setState({ isAddReleaseProfileModalOpen: true });
|
|
||||||
};
|
|
||||||
|
|
||||||
onAddReleaseProfileModalClose = () => {
|
|
||||||
this.setState({ isAddReleaseProfileModalOpen: false });
|
|
||||||
};
|
|
||||||
|
|
||||||
//
|
|
||||||
// Render
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const {
|
|
||||||
items,
|
|
||||||
tagList,
|
|
||||||
indexerList,
|
|
||||||
onConfirmDeleteReleaseProfile,
|
|
||||||
...otherProps
|
|
||||||
} = this.props;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<FieldSet legend={translate('ReleaseProfiles')}>
|
|
||||||
<PageSectionContent
|
|
||||||
errorMessage={translate('ReleaseProfilesLoadError')}
|
|
||||||
{...otherProps}
|
|
||||||
>
|
|
||||||
<div className={styles.releaseProfiles}>
|
|
||||||
<Card
|
|
||||||
className={styles.addReleaseProfile}
|
|
||||||
onPress={this.onAddReleaseProfilePress}
|
|
||||||
>
|
|
||||||
<div className={styles.center}>
|
|
||||||
<Icon
|
|
||||||
name={icons.ADD}
|
|
||||||
size={45}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{
|
|
||||||
items.map((item) => {
|
|
||||||
return (
|
|
||||||
<ReleaseProfile
|
|
||||||
key={item.id}
|
|
||||||
tagList={tagList}
|
|
||||||
indexerList={indexerList}
|
|
||||||
{...item}
|
|
||||||
onConfirmDeleteReleaseProfile={onConfirmDeleteReleaseProfile}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<EditReleaseProfileModalConnector
|
|
||||||
isOpen={this.state.isAddReleaseProfileModalOpen}
|
|
||||||
onModalClose={this.onAddReleaseProfileModalClose}
|
|
||||||
/>
|
|
||||||
</PageSectionContent>
|
|
||||||
</FieldSet>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ReleaseProfiles.propTypes = {
|
|
||||||
isFetching: PropTypes.bool.isRequired,
|
|
||||||
error: PropTypes.object,
|
|
||||||
items: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
||||||
tagList: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
||||||
indexerList: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
||||||
onConfirmDeleteReleaseProfile: PropTypes.func.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
export default ReleaseProfiles;
|
|
||||||
@ -0,0 +1,81 @@
|
|||||||
|
import React, { useEffect } from 'react';
|
||||||
|
import { useDispatch, useSelector } from 'react-redux';
|
||||||
|
import AppState from 'App/State/AppState';
|
||||||
|
import { ReleaseProfilesAppState } from 'App/State/SettingsAppState';
|
||||||
|
import Card from 'Components/Card';
|
||||||
|
import FieldSet from 'Components/FieldSet';
|
||||||
|
import Icon from 'Components/Icon';
|
||||||
|
import PageSectionContent from 'Components/Page/PageSectionContent';
|
||||||
|
import useModalOpenState from 'Helpers/Hooks/useModalOpenState';
|
||||||
|
import { icons } from 'Helpers/Props';
|
||||||
|
import { fetchIndexers } from 'Store/Actions/Settings/indexers';
|
||||||
|
import { fetchReleaseProfiles } from 'Store/Actions/Settings/releaseProfiles';
|
||||||
|
import createClientSideCollectionSelector from 'Store/Selectors/createClientSideCollectionSelector';
|
||||||
|
import createTagsSelector from 'Store/Selectors/createTagsSelector';
|
||||||
|
import translate from 'Utilities/String/translate';
|
||||||
|
import EditReleaseProfileModal from './EditReleaseProfileModal';
|
||||||
|
import ReleaseProfileRow from './ReleaseProfileRow';
|
||||||
|
import styles from './ReleaseProfiles.css';
|
||||||
|
|
||||||
|
function ReleaseProfiles() {
|
||||||
|
const { items, isFetching, isPopulated, error }: ReleaseProfilesAppState =
|
||||||
|
useSelector(createClientSideCollectionSelector('settings.releaseProfiles'));
|
||||||
|
|
||||||
|
const tagList = useSelector(createTagsSelector());
|
||||||
|
const indexerList = useSelector(
|
||||||
|
(state: AppState) => state.settings.indexers.items
|
||||||
|
);
|
||||||
|
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
const [
|
||||||
|
isAddReleaseProfileModalOpen,
|
||||||
|
setAddReleaseProfileModalOpen,
|
||||||
|
setAddReleaseProfileModalClosed,
|
||||||
|
] = useModalOpenState(false);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
dispatch(fetchReleaseProfiles());
|
||||||
|
dispatch(fetchIndexers());
|
||||||
|
}, [dispatch]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<FieldSet legend={translate('ReleaseProfiles')}>
|
||||||
|
<PageSectionContent
|
||||||
|
errorMessage={translate('ReleaseProfilesLoadError')}
|
||||||
|
isFetching={isFetching}
|
||||||
|
isPopulated={isPopulated}
|
||||||
|
error={error}
|
||||||
|
>
|
||||||
|
<div className={styles.releaseProfiles}>
|
||||||
|
<Card
|
||||||
|
className={styles.addReleaseProfile}
|
||||||
|
onPress={setAddReleaseProfileModalOpen}
|
||||||
|
>
|
||||||
|
<div className={styles.center}>
|
||||||
|
<Icon name={icons.ADD} size={45} />
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
{items.map((item) => {
|
||||||
|
return (
|
||||||
|
<ReleaseProfileRow
|
||||||
|
key={item.id}
|
||||||
|
tagList={tagList}
|
||||||
|
indexerList={indexerList}
|
||||||
|
{...item}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<EditReleaseProfileModal
|
||||||
|
isOpen={isAddReleaseProfileModalOpen}
|
||||||
|
onModalClose={setAddReleaseProfileModalClosed}
|
||||||
|
/>
|
||||||
|
</PageSectionContent>
|
||||||
|
</FieldSet>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ReleaseProfiles;
|
||||||
@ -1,70 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React, { Component } from 'react';
|
|
||||||
import { connect } from 'react-redux';
|
|
||||||
import { createSelector } from 'reselect';
|
|
||||||
import { deleteReleaseProfile, fetchIndexers, fetchReleaseProfiles } from 'Store/Actions/settingsActions';
|
|
||||||
import createTagsSelector from 'Store/Selectors/createTagsSelector';
|
|
||||||
import ReleaseProfiles from './ReleaseProfiles';
|
|
||||||
|
|
||||||
function createMapStateToProps() {
|
|
||||||
return createSelector(
|
|
||||||
(state) => state.settings.releaseProfiles,
|
|
||||||
(state) => state.settings.indexers,
|
|
||||||
createTagsSelector(),
|
|
||||||
(releaseProfiles, indexers, tagList) => {
|
|
||||||
return {
|
|
||||||
...releaseProfiles,
|
|
||||||
tagList,
|
|
||||||
isIndexersPopulated: indexers.isPopulated,
|
|
||||||
indexerList: indexers.items
|
|
||||||
};
|
|
||||||
}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const mapDispatchToProps = {
|
|
||||||
fetchIndexers,
|
|
||||||
fetchReleaseProfiles,
|
|
||||||
deleteReleaseProfile
|
|
||||||
};
|
|
||||||
|
|
||||||
class ReleaseProfilesConnector extends Component {
|
|
||||||
|
|
||||||
//
|
|
||||||
// Lifecycle
|
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
this.props.fetchReleaseProfiles();
|
|
||||||
if (!this.props.isIndexersPopulated) {
|
|
||||||
this.props.fetchIndexers();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//
|
|
||||||
// Listeners
|
|
||||||
|
|
||||||
onConfirmDeleteReleaseProfile = (id) => {
|
|
||||||
this.props.deleteReleaseProfile({ id });
|
|
||||||
};
|
|
||||||
|
|
||||||
//
|
|
||||||
// Render
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<ReleaseProfiles
|
|
||||||
{...this.props}
|
|
||||||
onConfirmDeleteReleaseProfile={this.onConfirmDeleteReleaseProfile}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ReleaseProfilesConnector.propTypes = {
|
|
||||||
isIndexersPopulated: PropTypes.bool.isRequired,
|
|
||||||
fetchReleaseProfiles: PropTypes.func.isRequired,
|
|
||||||
deleteReleaseProfile: PropTypes.func.isRequired,
|
|
||||||
fetchIndexers: PropTypes.func.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
export default connect(createMapStateToProps, mapDispatchToProps)(ReleaseProfilesConnector);
|
|
||||||
@ -0,0 +1,12 @@
|
|||||||
|
import ModelBase from 'App/ModelBase';
|
||||||
|
|
||||||
|
interface ReleaseProfile extends ModelBase {
|
||||||
|
name: string;
|
||||||
|
enabled: boolean;
|
||||||
|
required: string[];
|
||||||
|
ignored: string[];
|
||||||
|
indexerId: number;
|
||||||
|
tags: number[];
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ReleaseProfile;
|
||||||
Loading…
Reference in new issue