diff --git a/frontend/src/Components/Form/Form.js b/frontend/src/Components/Form/Form.js index 9a3579b45..9a605297a 100644 --- a/frontend/src/Components/Form/Form.js +++ b/frontend/src/Components/Form/Form.js @@ -1,6 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; -import styles from './Form.css'; +import { kinds } from 'Helpers/Props'; +import Alert from 'Components/Alert'; function Form({ children, validationErrors, validationWarnings, ...otherProps }) { return ( @@ -9,12 +10,12 @@ function Form({ children, validationErrors, validationWarnings, ...otherProps }) { validationErrors.map((error, index) => { return ( -
{error.errorMessage} -
+ ); }) } @@ -22,12 +23,12 @@ function Form({ children, validationErrors, validationWarnings, ...otherProps }) { validationWarnings.map((warning, index) => { return ( -
{warning.errorMessage} -
+ ); }) } diff --git a/frontend/src/Components/Page/Sidebar/PageSidebar.js b/frontend/src/Components/Page/Sidebar/PageSidebar.js index 965f7d4d6..8b38466d9 100644 --- a/frontend/src/Components/Page/Sidebar/PageSidebar.js +++ b/frontend/src/Components/Page/Sidebar/PageSidebar.js @@ -247,9 +247,9 @@ class PageSidebar extends Component { window.addEventListener('click', this.onWindowClick, { capture: true }); window.addEventListener('scroll', this.onWindowScroll); window.addEventListener('touchstart', this.onTouchStart); + window.addEventListener('touchmove', this.onTouchMove); window.addEventListener('touchend', this.onTouchEnd); window.addEventListener('touchcancel', this.onTouchCancel); - window.addEventListener('touchmove', this.onTouchMove); } } @@ -274,9 +274,9 @@ class PageSidebar extends Component { window.removeEventListener('click', this.onWindowClick, { capture: true }); window.removeEventListener('scroll', this.onWindowScroll); window.removeEventListener('touchstart', this.onTouchStart); + window.removeEventListener('touchmove', this.onTouchMove); window.removeEventListener('touchend', this.onTouchEnd); window.removeEventListener('touchcancel', this.onTouchCancel); - window.removeEventListener('touchmove', this.onTouchMove); } } @@ -322,20 +322,22 @@ class PageSidebar extends Component { onTouchStart = (event) => { const touches = event.touches; - const touchStart = touches[0].pageX; + const touchStartX = touches[0].pageX; + const touchStartY = touches[0].pageY; const isSidebarVisible = this.props.isSidebarVisible; if (touches.length !== 1) { return; } - if (isSidebarVisible && (touchStart > 210 || touchStart < 50)) { + if (isSidebarVisible && (touchStartX > 210 || touchStartX < 50)) { return; - } else if (!isSidebarVisible && touchStart > 50) { + } else if (!isSidebarVisible && touchStartX > 50) { return; } - this._touchStartX = touchStart; + this._touchStartX = touchStartX; + this._touchStartY = touchStartY; } onTouchEnd = (event) => { diff --git a/frontend/src/InteractiveImport/Album/SelectAlbumModalContentConnector.js b/frontend/src/InteractiveImport/Album/SelectAlbumModalContentConnector.js index 81593379c..7e178ade8 100644 --- a/frontend/src/InteractiveImport/Album/SelectAlbumModalContentConnector.js +++ b/frontend/src/InteractiveImport/Album/SelectAlbumModalContentConnector.js @@ -54,7 +54,7 @@ class SelectAlbumModalContentConnector extends Component { this.props.updateInteractiveImportItem({ id, album, - episodes: [] + tracks: [] }); }); diff --git a/frontend/src/InteractiveImport/Interactive/InteractiveImportModalContent.css b/frontend/src/InteractiveImport/Interactive/InteractiveImportModalContent.css index 964faac31..f85538fdb 100644 --- a/frontend/src/InteractiveImport/Interactive/InteractiveImportModalContent.css +++ b/frontend/src/InteractiveImport/Interactive/InteractiveImportModalContent.css @@ -33,6 +33,24 @@ @media only screen and (max-width: $breakpointSmall) { .footer { + .leftButtons, + .centerButtons, + .rightButtons { + flex-direction: column; + } + + .leftButtons { + align-items: flex-start; + } + + .centerButtons { + align-items: center; + } + + .rightButtons { + align-items: flex-end; + } + a, button { margin-left: 0; diff --git a/frontend/src/InteractiveImport/Interactive/InteractiveImportRow.js b/frontend/src/InteractiveImport/Interactive/InteractiveImportRow.js index e19d588de..1835e07a4 100644 --- a/frontend/src/InteractiveImport/Interactive/InteractiveImportRow.js +++ b/frontend/src/InteractiveImport/Interactive/InteractiveImportRow.js @@ -74,7 +74,7 @@ class InteractiveImportRow extends Component { const isValid = !!( artist && - album != null && + album && tracks.length && quality && language diff --git a/frontend/src/Settings/DownloadClients/DownloadClients/EditDownloadClientModalConnector.js b/frontend/src/Settings/DownloadClients/DownloadClients/EditDownloadClientModalConnector.js index 7991f4edc..982b675b8 100644 --- a/frontend/src/Settings/DownloadClients/DownloadClients/EditDownloadClientModalConnector.js +++ b/frontend/src/Settings/DownloadClients/DownloadClients/EditDownloadClientModalConnector.js @@ -6,17 +6,19 @@ import { cancelTestDownloadClient, cancelSaveDownloadClient } from 'Store/Action import EditDownloadClientModal from './EditDownloadClientModal'; function createMapDispatchToProps(dispatch, props) { + const section = 'downloadClients'; + return { dispatchClearPendingChanges() { - dispatch(clearPendingChanges); + dispatch(clearPendingChanges({ section })); }, dispatchCancelTestDownloadClient() { - dispatch(cancelTestDownloadClient); + dispatch(cancelTestDownloadClient({ section })); }, dispatchCancelSaveDownloadClient() { - dispatch(cancelSaveDownloadClient); + dispatch(cancelSaveDownloadClient({ section })); } }; } @@ -27,9 +29,9 @@ class EditDownloadClientModalConnector extends Component { // Listeners onModalClose = () => { - this.props.dispatchClearPendingChanges({ section: 'downloadClients' }); - this.props.dispatchCancelTestDownloadClient({ section: 'downloadClients' }); - this.props.dispatchCancelSaveDownloadClient({ section: 'downloadClients' }); + this.props.dispatchClearPendingChanges(); + this.props.dispatchCancelTestDownloadClient(); + this.props.dispatchCancelSaveDownloadClient(); this.props.onModalClose(); } diff --git a/frontend/src/Settings/Indexers/Indexers/EditIndexerModalConnector.js b/frontend/src/Settings/Indexers/Indexers/EditIndexerModalConnector.js index 3168e90f0..e616957e7 100644 --- a/frontend/src/Settings/Indexers/Indexers/EditIndexerModalConnector.js +++ b/frontend/src/Settings/Indexers/Indexers/EditIndexerModalConnector.js @@ -6,17 +6,19 @@ import { cancelTestIndexer, cancelSaveIndexer } from 'Store/Actions/settingsActi import EditIndexerModal from './EditIndexerModal'; function createMapDispatchToProps(dispatch, props) { + const section = 'indexers'; + return { dispatchClearPendingChanges() { - dispatch(clearPendingChanges); + dispatch(clearPendingChanges)({ section }); }, dispatchCancelTestIndexer() { - dispatch(cancelTestIndexer); + dispatch(cancelTestIndexer({ section })); }, dispatchCancelSaveIndexer() { - dispatch(cancelSaveIndexer); + dispatch(cancelSaveIndexer({ section })); } }; } @@ -27,9 +29,9 @@ class EditIndexerModalConnector extends Component { // Listeners onModalClose = () => { - this.props.dispatchClearPendingChanges({ section: 'indexers' }); - this.props.dispatchCancelTestIndexer({ section: 'indexers' }); - this.props.dispatchCancelSaveIndexer({ section: 'indexers' }); + this.props.dispatchClearPendingChanges(); + this.props.dispatchCancelTestIndexer(); + this.props.dispatchCancelSaveIndexer(); this.props.onModalClose(); } diff --git a/frontend/src/Settings/Metadata/Metadata/EditMetadataModalConnector.js b/frontend/src/Settings/Metadata/Metadata/EditMetadataModalConnector.js index a065e2f08..0e2c46be9 100644 --- a/frontend/src/Settings/Metadata/Metadata/EditMetadataModalConnector.js +++ b/frontend/src/Settings/Metadata/Metadata/EditMetadataModalConnector.js @@ -4,9 +4,15 @@ import { connect } from 'react-redux'; import { clearPendingChanges } from 'Store/Actions/baseActions'; import EditMetadataModal from './EditMetadataModal'; -const mapDispatchToProps = { - clearPendingChanges -}; +function createMapDispatchToProps(dispatch, props) { + const section = 'metadata'; + + return { + dispatchClearPendingChanges() { + dispatch(clearPendingChanges)({ section }); + } + }; +} class EditMetadataModalConnector extends Component { @@ -36,4 +42,4 @@ EditMetadataModalConnector.propTypes = { clearPendingChanges: PropTypes.func.isRequired }; -export default connect(null, mapDispatchToProps)(EditMetadataModalConnector); +export default connect(null, createMapDispatchToProps)(EditMetadataModalConnector); diff --git a/frontend/src/Settings/Notifications/Notifications/EditNotificationModalConnector.js b/frontend/src/Settings/Notifications/Notifications/EditNotificationModalConnector.js index 3e47e7384..77566f9e1 100644 --- a/frontend/src/Settings/Notifications/Notifications/EditNotificationModalConnector.js +++ b/frontend/src/Settings/Notifications/Notifications/EditNotificationModalConnector.js @@ -2,11 +2,26 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; import { connect } from 'react-redux'; import { clearPendingChanges } from 'Store/Actions/baseActions'; +import { cancelTestNotification, cancelSaveNotification } from 'Store/Actions/settingsActions'; import EditNotificationModal from './EditNotificationModal'; -const mapDispatchToProps = { - clearPendingChanges -}; +function createMapDispatchToProps(dispatch, props) { + const section = 'notifications'; + + return { + dispatchClearPendingChanges() { + dispatch(clearPendingChanges({ section })); + }, + + dispatchCancelTestNotification() { + dispatch(cancelTestNotification({ section })); + }, + + dispatchCancelSaveNotification() { + dispatch(cancelSaveNotification({ section })); + } + }; +} class EditNotificationModalConnector extends Component { @@ -14,7 +29,9 @@ class EditNotificationModalConnector extends Component { // Listeners onModalClose = () => { - this.props.clearPendingChanges({ section: 'notifications' }); + this.props.dispatchClearPendingChanges(); + this.props.dispatchCancelTestNotification(); + this.props.dispatchCancelSaveNotification(); this.props.onModalClose(); } @@ -22,9 +39,16 @@ class EditNotificationModalConnector extends Component { // Render render() { + const { + dispatchClearPendingChanges, + dispatchCancelTestNotification, + dispatchCancelSaveNotification, + ...otherProps + } = this.props; + return ( ); @@ -33,7 +57,9 @@ class EditNotificationModalConnector extends Component { EditNotificationModalConnector.propTypes = { onModalClose: PropTypes.func.isRequired, - clearPendingChanges: PropTypes.func.isRequired + dispatchClearPendingChanges: PropTypes.func.isRequired, + dispatchCancelTestNotification: PropTypes.func.isRequired, + dispatchCancelSaveNotification: PropTypes.func.isRequired }; -export default connect(null, mapDispatchToProps)(EditNotificationModalConnector); +export default connect(null, createMapDispatchToProps)(EditNotificationModalConnector); diff --git a/frontend/src/Store/Actions/Creators/createSaveProviderHandler.js b/frontend/src/Store/Actions/Creators/createSaveProviderHandler.js index 2d2d50371..6b6d89314 100644 --- a/frontend/src/Store/Actions/Creators/createSaveProviderHandler.js +++ b/frontend/src/Store/Actions/Creators/createSaveProviderHandler.js @@ -7,10 +7,12 @@ const abortCurrentRequests = {}; export function createCancelSaveProviderHandler(section) { return function(payload) { - if (abortCurrentRequests[section]) { - abortCurrentRequests[section](); - abortCurrentRequests[section] = null; - } + return function(dispatch, getState) { + if (abortCurrentRequests[section]) { + abortCurrentRequests[section](); + abortCurrentRequests[section] = null; + } + }; }; } diff --git a/frontend/src/Store/Actions/Creators/createTestProviderHandler.js b/frontend/src/Store/Actions/Creators/createTestProviderHandler.js index 236b7bcd4..f3cf354bc 100644 --- a/frontend/src/Store/Actions/Creators/createTestProviderHandler.js +++ b/frontend/src/Store/Actions/Creators/createTestProviderHandler.js @@ -6,10 +6,12 @@ const abortCurrentRequests = {}; export function createCancelTestProviderHandler(section) { return function(payload) { - if (abortCurrentRequests[section]) { - abortCurrentRequests[section](); - abortCurrentRequests[section] = null; - } + return function(dispatch, getState) { + if (abortCurrentRequests[section]) { + abortCurrentRequests[section](); + abortCurrentRequests[section] = null; + } + }; }; }