mirror of
https://github.com/zoriya/flood.git
synced 2026-06-02 02:56:05 +00:00
RemoveTorrentsModal: convert to Functional Component
This commit is contained in:
+80
-86
@@ -1,5 +1,5 @@
|
||||
import {Component} from 'react';
|
||||
import {FormattedMessage, injectIntl, WrappedComponentProps} from 'react-intl';
|
||||
import {FC, useRef} from 'react';
|
||||
import {FormattedMessage, useIntl} from 'react-intl';
|
||||
|
||||
import {Form, FormRow} from '../../../ui';
|
||||
import Modal from '../Modal';
|
||||
@@ -8,16 +8,27 @@ import SettingStore from '../../../stores/SettingStore';
|
||||
import TorrentActions from '../../../actions/TorrentActions';
|
||||
import TorrentStore from '../../../stores/TorrentStore';
|
||||
|
||||
import type {ModalAction} from '../../../stores/UIStore';
|
||||
const RemoveTorrentsModal: FC = () => {
|
||||
const formRef = useRef<Form>(null);
|
||||
const intl = useIntl();
|
||||
const {selectedTorrents} = TorrentStore;
|
||||
|
||||
class RemoveTorrentsModal extends Component<WrappedComponentProps> {
|
||||
formRef?: Form | null;
|
||||
|
||||
getActions(torrentCount: number): Array<ModalAction> {
|
||||
const {intl} = this.props;
|
||||
|
||||
return torrentCount === 0
|
||||
? [
|
||||
if (selectedTorrents.length === 0) {
|
||||
return (
|
||||
<Modal
|
||||
heading={intl.formatMessage({
|
||||
id: 'torrents.remove',
|
||||
})}
|
||||
content={
|
||||
<div className="modal__content inverse">
|
||||
<Form>
|
||||
<FormRow>
|
||||
<FormattedMessage id="torrents.remove.error.no.torrents.selected" />
|
||||
</FormRow>
|
||||
</Form>
|
||||
</div>
|
||||
}
|
||||
actions={[
|
||||
{
|
||||
clickHandler: null,
|
||||
content: intl.formatMessage({
|
||||
@@ -26,82 +37,65 @@ class RemoveTorrentsModal extends Component<WrappedComponentProps> {
|
||||
triggerDismiss: true,
|
||||
type: 'primary',
|
||||
},
|
||||
]
|
||||
: [
|
||||
{
|
||||
checked: SettingStore.floodSettings.deleteTorrentData,
|
||||
content: intl.formatMessage({
|
||||
id: 'torrents.remove.delete.data',
|
||||
}),
|
||||
id: 'deleteData',
|
||||
type: 'checkbox',
|
||||
},
|
||||
{
|
||||
clickHandler: null,
|
||||
content: intl.formatMessage({
|
||||
id: 'button.no',
|
||||
}),
|
||||
triggerDismiss: true,
|
||||
type: 'tertiary',
|
||||
},
|
||||
{
|
||||
clickHandler: this.handleRemovalConfirmation,
|
||||
content: intl.formatMessage({
|
||||
id: 'button.yes',
|
||||
}),
|
||||
triggerDismiss: true,
|
||||
type: 'primary',
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
getContent(torrentCount: number) {
|
||||
return (
|
||||
<div className="modal__content inverse">
|
||||
<Form
|
||||
ref={(ref) => {
|
||||
this.formRef = ref;
|
||||
}}>
|
||||
<FormRow>
|
||||
{torrentCount === 0 ? (
|
||||
<FormattedMessage id="torrents.remove.error.no.torrents.selected" />
|
||||
) : (
|
||||
<FormattedMessage id="torrents.remove.are.you.sure" values={{count: torrentCount}} />
|
||||
)}
|
||||
</FormRow>
|
||||
</Form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
handleRemovalConfirmation = () => {
|
||||
let deleteData = false;
|
||||
if (this.formRef != null && this.formRef.getFormData().deleteData) {
|
||||
deleteData = true;
|
||||
}
|
||||
|
||||
TorrentActions.deleteTorrents({
|
||||
hashes: TorrentStore.selectedTorrents,
|
||||
deleteData,
|
||||
});
|
||||
|
||||
saveDeleteTorrentsUserPreferences({deleteData});
|
||||
};
|
||||
|
||||
render() {
|
||||
const {selectedTorrents} = TorrentStore;
|
||||
const modalHeading = this.props.intl.formatMessage({
|
||||
id: 'torrents.remove',
|
||||
});
|
||||
|
||||
return (
|
||||
<Modal
|
||||
actions={this.getActions(selectedTorrents.length)}
|
||||
content={this.getContent(selectedTorrents.length)}
|
||||
heading={modalHeading}
|
||||
]}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default injectIntl(RemoveTorrentsModal);
|
||||
return (
|
||||
<Modal
|
||||
heading={intl.formatMessage({
|
||||
id: 'torrents.remove',
|
||||
})}
|
||||
content={
|
||||
<div className="modal__content inverse">
|
||||
<Form ref={formRef}>
|
||||
<FormRow>
|
||||
<FormattedMessage id="torrents.remove.are.you.sure" values={{count: selectedTorrents.length}} />
|
||||
</FormRow>
|
||||
</Form>
|
||||
</div>
|
||||
}
|
||||
actions={[
|
||||
{
|
||||
checked: SettingStore.floodSettings.deleteTorrentData,
|
||||
content: intl.formatMessage({
|
||||
id: 'torrents.remove.delete.data',
|
||||
}),
|
||||
id: 'deleteData',
|
||||
type: 'checkbox',
|
||||
},
|
||||
{
|
||||
clickHandler: null,
|
||||
content: intl.formatMessage({
|
||||
id: 'button.no',
|
||||
}),
|
||||
triggerDismiss: true,
|
||||
type: 'tertiary',
|
||||
},
|
||||
{
|
||||
clickHandler: () => {
|
||||
let deleteData = false;
|
||||
if (formRef.current != null) {
|
||||
deleteData = formRef.current.getFormData().deleteData as boolean;
|
||||
}
|
||||
|
||||
TorrentActions.deleteTorrents({
|
||||
hashes: TorrentStore.selectedTorrents,
|
||||
deleteData,
|
||||
});
|
||||
|
||||
saveDeleteTorrentsUserPreferences({deleteData});
|
||||
},
|
||||
content: intl.formatMessage({
|
||||
id: 'button.yes',
|
||||
}),
|
||||
triggerDismiss: true,
|
||||
type: 'primary',
|
||||
},
|
||||
]}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default RemoveTorrentsModal;
|
||||
|
||||
Reference in New Issue
Block a user