Upgraded to webpack 4

pull/2984/head
Mark McDowall 5 years ago
parent ca32434535
commit 08990dd58a

@ -28,6 +28,12 @@
"react"
],
"settings": {
"react": {
"version": "detect"
}
},
"rules": {
"filenames/match-exported": ["error"],

@ -0,0 +1,41 @@
const loose = true;
module.exports = {
plugins: [
// Stage 1
'@babel/plugin-proposal-export-default-from',
['@babel/plugin-proposal-optional-chaining', { loose }],
['@babel/plugin-proposal-nullish-coalescing-operator', { loose }],
// Stage 2
'@babel/plugin-proposal-export-namespace-from',
// Stage 3
['@babel/plugin-proposal-class-properties', { loose }],
'@babel/plugin-syntax-dynamic-import'
],
env: {
test: {
presets: [
['@babel/preset-env', { loose, modules: 'commonjs' }],
['@babel/preset-react']
]
},
development: {
presets: [
['@babel/preset-react', { development: true }]
],
plugins: [
'babel-plugin-inline-classnames'
]
},
production: {
presets: [
'@babel/preset-react'
],
plugins: [
'babel-plugin-transform-react-remove-prop-types'
]
}
}
};

@ -4,14 +4,14 @@ const livereload = require('gulp-livereload');
const path = require('path');
const webpack = require('webpack');
const errorHandler = require('./helpers/errorHandler');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const uiFolder = 'UI';
const root = path.join(__dirname, '..', 'src');
const srcFolder = path.join(__dirname, '..', 'src');
const frontendFolder = path.join(__dirname, '..');
const isProduction = process.argv.indexOf('--production') > -1;
console.log('ROOT:', root);
console.log('Source Folder:', srcFolder);
console.log('isProduction:', isProduction);
const cssVarsFiles = [
@ -21,40 +21,19 @@ const cssVarsFiles = [
'../src/Styles/Variables/animations'
].map(require.resolve);
const extractCSSPlugin = new ExtractTextPlugin({
filename: path.join('_output', uiFolder, 'Content', 'styles.css'),
allChunks: true,
disable: false,
ignoreOrder: true
});
const plugins = [
extractCSSPlugin,
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor'
}),
new webpack.DefinePlugin({
__DEV__: !isProduction,
'process.env.NODE_ENV': isProduction ? JSON.stringify('production') : JSON.stringify('development')
}),
new MiniCssExtractPlugin({
filename: path.join('_output', uiFolder, 'Content', 'styles.css')
})
];
if (isProduction) {
plugins.push(new UglifyJSPlugin({
sourceMap: true,
uglifyOptions: {
mangle: false,
output: {
comments: false,
beautify: true
}
}
}));
}
const config = {
mode: isProduction ? 'production' : 'development',
devtool: '#source-map',
stats: {
@ -73,8 +52,8 @@ const config = {
resolve: {
modules: [
root,
path.join(root, 'Shims'),
srcFolder,
path.join(srcFolder, 'Shims'),
'node_modules'
],
alias: {
@ -87,6 +66,10 @@ const config = {
sourceMapFilename: '[file].map'
},
optimization: {
chunkIds: 'named'
},
plugins,
resolveLoader: {
@ -101,53 +84,44 @@ const config = {
{
test: /\.js?$/,
exclude: /(node_modules|JsLibraries)/,
loader: 'babel-loader',
query: {
plugins: ['transform-class-properties'],
presets: ['es2015', 'decorators-legacy', 'react', 'stage-2'],
env: {
development: {
plugins: ['transform-react-jsx-source']
use: [
{
loader: 'babel-loader',
options: {
configFile: `${frontendFolder}/babel.config.js`,
envName: isProduction ? 'production' : 'development'
}
}
}
]
},
// CSS Modules
{
test: /\.css$/,
exclude: /(node_modules|globals.css)/,
use: extractCSSPlugin.extract({
fallback: 'style-loader',
use: [
{
loader: 'css-variables-loader',
options: {
cssVarsFiles
}
},
{
loader: 'css-loader',
options: {
modules: true,
importLoaders: 1,
localIdentName: '[name]-[local]-[hash:base64:5]',
sourceMap: true
}
},
{
loader: 'postcss-loader',
options: {
config: {
ctx: {
cssVarsFiles
},
path: 'frontend/postcss.config.js'
}
use: [
{ loader: MiniCssExtractPlugin.loader },
{
loader: 'css-loader',
options: {
importLoaders: 1,
localIdentName: '[name]/[local]/[hash:base64:5]',
modules: true
}
},
{
loader: 'postcss-loader',
options: {
ident: 'postcss',
config: {
ctx: {
cssVarsFiles
},
path: 'frontend/postcss.config.js'
}
}
]
})
}
]
},
// Global styles

@ -1,18 +1,18 @@
.language,
.quality {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 100px;
}
.indexer {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 80px;
}
.actions {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 70px;
}

@ -1,5 +1,5 @@
.description {
composes: description from 'Components/DescriptionList/DescriptionListItemDescription.css';
composes: description from '~Components/DescriptionList/DescriptionListItemDescription.css';
overflow-wrap: break-word;
}

@ -1,5 +1,5 @@
.markAsFailedButton {
composes: button from 'Components/Link/Button.css';
composes: button from '~Components/Link/Button.css';
margin-right: auto;
}

@ -1,5 +1,5 @@
.cell {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 35px;
text-align: center;

@ -1,23 +1,23 @@
.downloadClient {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 120px;
}
.indexer {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 80px;
}
.releaseGroup {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 110px;
}
.details {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 30px;
}

@ -1,12 +1,12 @@
.torrent {
composes: label from 'Components/Label.css';
composes: label from '~Components/Label.css';
border-color: $torrentColor;
background-color: $torrentColor;
}
.usenet {
composes: label from 'Components/Label.css';
composes: label from '~Components/Label.css';
border-color: $usenetColor;
background-color: $usenetColor;

@ -164,6 +164,8 @@ class QueueConnector extends Component {
}
QueueConnector.propTypes = {
includeUnknownSeriesItems: PropTypes.bool.isRequired,
useCurrentPage: PropTypes.bool.isRequired,
items: PropTypes.arrayOf(PropTypes.object).isRequired,
fetchQueue: PropTypes.func.isRequired,
gotoQueueFirstPage: PropTypes.func.isRequired,

@ -1,23 +1,23 @@
.quality {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 150px;
}
.protocol {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 100px;
}
.progress {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 150px;
}
.actions {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 70px;
}

@ -1,5 +1,5 @@
.status {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 30px;
}

@ -1,5 +1,5 @@
.timeleft {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 100px;
}

@ -17,7 +17,7 @@
}
.searchInput {
composes: input from 'Components/Form/TextInput.css';
composes: input from '~Components/Form/TextInput.css';
height: 46px;
border-radius: 0;

@ -36,28 +36,28 @@
}
.searchForMissingEpisodesContainer {
composes: container from 'Components/Form/CheckInput.css';
composes: container from '~Components/Form/CheckInput.css';
flex: 0 1 0;
}
.searchForMissingEpisodesInput {
composes: input from 'Components/Form/CheckInput.css';
composes: input from '~Components/Form/CheckInput.css';
margin-top: 0;
}
.modalFooter {
composes: modalFooter from 'Components/Modal/ModalFooter.css';
composes: modalFooter from '~Components/Modal/ModalFooter.css';
}
.addButton {
@add-mixin truncate;
composes: button from 'Components/Link/SpinnerButton.css';
composes: button from '~Components/Link/SpinnerButton.css';
}
.hideLanguageProfile {
composes: group from 'Components/Form/FormGroup.css';
composes: group from '~Components/Form/FormGroup.css';
display: none;
}

@ -14,7 +14,7 @@
}
.importButton {
composes: button from 'Components/Link/SpinnerButton.css';
composes: button from '~Components/Link/SpinnerButton.css';
height: 35px;
}
@ -26,7 +26,7 @@
}
.loading {
composes: loading from 'Components/Loading/LoadingIndicator.css';
composes: loading from '~Components/Loading/LoadingIndicator.css';
margin: 0 10px 0 12px;
text-align: left;

@ -1,11 +1,11 @@
.folder {
composes: headerCell from 'Components/Table/VirtualTableHeaderCell.css';
composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
flex: 1 0 200px;
}
.monitor {
composes: headerCell from 'Components/Table/VirtualTableHeaderCell.css';
composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
flex: 0 1 200px;
min-width: 185px;
@ -13,28 +13,28 @@
.qualityProfile,
.languageProfile {
composes: headerCell from 'Components/Table/VirtualTableHeaderCell.css';
composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
flex: 0 1 250px;
min-width: 170px;
}
.seriesType {
composes: headerCell from 'Components/Table/VirtualTableHeaderCell.css';
composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
flex: 0 1 200px;
min-width: 120px;
}
.seasonFolder {
composes: headerCell from 'Components/Table/VirtualTableHeaderCell.css';
composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
flex: 0 1 150px;
min-width: 120px;
}
.series {
composes: headerCell from 'Components/Table/VirtualTableHeaderCell.css';
composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
flex: 0 1 400px;
min-width: 300px;

@ -1,16 +1,16 @@
.selectInput {
composes: input from 'Components/Form/CheckInput.css';
composes: input from '~Components/Form/CheckInput.css';
}
.folder {
composes: cell from 'Components/Table/Cells/VirtualTableRowCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
flex: 1 0 200px;
line-height: 36px;
}
.monitor {
composes: cell from 'Components/Table/Cells/VirtualTableRowCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
flex: 0 1 200px;
min-width: 185px;
@ -18,35 +18,35 @@
.qualityProfile,
.languageProfile {
composes: cell from 'Components/Table/Cells/VirtualTableRowCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
flex: 0 1 250px;
min-width: 170px;
}
.seriesType {
composes: cell from 'Components/Table/Cells/VirtualTableRowCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
flex: 0 1 200px;
min-width: 120px;
}
.seasonFolder {
composes: cell from 'Components/Table/Cells/VirtualTableRowCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
flex: 0 1 150px;
min-width: 120px;
}
.series {
composes: cell from 'Components/Table/Cells/VirtualTableRowCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
flex: 0 1 400px;
min-width: 300px;
}
.hideLanguageProfile {
composes: cell from 'Components/Table/Cells/VirtualTableRowCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
display: none;
}

@ -1,3 +1,3 @@
.input {
composes: input from 'Components/Form/CheckInput.css';
composes: input from '~Components/Form/CheckInput.css';
}

@ -3,7 +3,7 @@
}
.button {
composes: link from 'Components/Link/Link.css';
composes: link from '~Components/Link/Link.css';
position: relative;
display: flex;
@ -65,7 +65,7 @@
}
.searchInput {
composes: input from 'Components/Form/TextInput.css';
composes: input from '~Components/Form/TextInput.css';
border-radius: 0;
}

@ -63,27 +63,27 @@
*/
.downloaded {
composes: downloaded from 'Calendar/Events/CalendarEvent.css';
composes: downloaded from '~Calendar/Events/CalendarEvent.css';
}
.downloading {
composes: downloading from 'Calendar/Events/CalendarEvent.css';
composes: downloading from '~Calendar/Events/CalendarEvent.css';
}
.unmonitored {
composes: unmonitored from 'Calendar/Events/CalendarEvent.css';
composes: unmonitored from '~Calendar/Events/CalendarEvent.css';
}
.onAir {
composes: onAir from 'Calendar/Events/CalendarEvent.css';
composes: onAir from '~Calendar/Events/CalendarEvent.css';
}
.missing {
composes: missing from 'Calendar/Events/CalendarEvent.css';
composes: missing from '~Calendar/Events/CalendarEvent.css';
}
.premiere {
composes: premiere from 'Calendar/Events/CalendarEvent.css';
composes: premiere from '~Calendar/Events/CalendarEvent.css';
}
@media only screen and (max-width: $breakpointSmall) {

@ -175,6 +175,7 @@ class CalendarConnector extends Component {
}
CalendarConnector.propTypes = {
useCurrentPage: PropTypes.bool.isRequired,
time: PropTypes.string,
view: PropTypes.string.isRequired,
firstDayOfWeek: PropTypes.number.isRequired,

@ -1,11 +1,11 @@
.calendarPageBody {
composes: contentBody from 'Components/Page/PageContentBody.css';
composes: contentBody from '~Components/Page/PageContentBody.css';
display: flex;
}
.calendarInnerPageBody {
composes: innerContentBody from 'Components/Page/PageContentBody.css';
composes: innerContentBody from '~Components/Page/PageContentBody.css';
display: flex;
flex-direction: column;

@ -58,25 +58,25 @@
*/
.downloaded {
composes: downloaded from 'Calendar/Events/CalendarEvent.css';
composes: downloaded from '~Calendar/Events/CalendarEvent.css';
}
.downloading {
composes: downloading from 'Calendar/Events/CalendarEvent.css';
composes: downloading from '~Calendar/Events/CalendarEvent.css';
}
.unmonitored {
composes: unmonitored from 'Calendar/Events/CalendarEvent.css';
composes: unmonitored from '~Calendar/Events/CalendarEvent.css';
}
.onAir {
composes: onAir from 'Calendar/Events/CalendarEvent.css';
composes: onAir from '~Calendar/Events/CalendarEvent.css';
}
.missing {
composes: missing from 'Calendar/Events/CalendarEvent.css';
composes: missing from '~Calendar/Events/CalendarEvent.css';
}
.premiere {
composes: premiere from 'Calendar/Events/CalendarEvent.css';
composes: premiere from '~Calendar/Events/CalendarEvent.css';
}

@ -8,7 +8,7 @@
}
.todayButton {
composes: button from 'Components/Link/Button.css';
composes: button from '~Components/Link/Button.css';
margin-left: 5px;
}
@ -30,13 +30,13 @@
}
.viewMenu {
composes: menu from 'Components/Menu/Menu.css';
composes: menu from '~Components/Menu/Menu.css';
line-height: 31px;
}
.loading {
composes: loading from 'Components/Loading/LoadingIndicator.css';
composes: loading from '~Components/Loading/LoadingIndicator.css';
margin-top: 5px;
margin-right: 10px;

@ -13,29 +13,29 @@
*/
.downloaded {
composes: downloaded from 'Calendar/Events/CalendarEvent.css';
composes: downloaded from '~Calendar/Events/CalendarEvent.css';
}
.downloading {
composes: downloading from 'Calendar/Events/CalendarEvent.css';
composes: downloading from '~Calendar/Events/CalendarEvent.css';
}
.unmonitored {
composes: unmonitored from 'Calendar/Events/CalendarEvent.css';
composes: unmonitored from '~Calendar/Events/CalendarEvent.css';
}
.onAir {
composes: onAir from 'Calendar/Events/CalendarEvent.css';
composes: onAir from '~Calendar/Events/CalendarEvent.css';
}
.missing {
composes: missing from 'Calendar/Events/CalendarEvent.css';
composes: missing from '~Calendar/Events/CalendarEvent.css';
}
.premiere {
composes: premiere from 'Calendar/Events/CalendarEvent.css';
composes: premiere from '~Calendar/Events/CalendarEvent.css';
}
.unaired {
composes: unaired from 'Calendar/Events/CalendarEvent.css';
composes: unaired from '~Calendar/Events/CalendarEvent.css';
}

@ -1,5 +1,5 @@
.modal {
composes: modal from 'Components/Modal/Modal.css';
composes: modal from '~Components/Modal/Modal.css';
height: 600px;
}

@ -1,12 +1,12 @@
.modalBody {
composes: modalBody from 'Components/Modal/ModalBody.css';
composes: modalBody from '~Components/Modal/ModalBody.css';
display: flex;
flex-direction: column;
}
.mappedDrivesWarning {
composes: alert from 'Components/Alert.css';
composes: alert from '~Components/Alert.css';
margin: 0;
margin-bottom: 20px;
@ -18,7 +18,7 @@
}
.pathInput {
composes: pathInputWrapper from 'Components/Form/PathInput.css';
composes: pathInputWrapper from '~Components/Form/PathInput.css';
flex: 0 0 auto;
}

@ -1,5 +1,5 @@
.type {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 32px;
}

@ -3,13 +3,13 @@
}
.numberInput {
composes: input from 'Components/Form/TextInput.css';
composes: input from '~Components/Form/TextInput.css';
margin-right: 3px;
}
.selectInput {
composes: select from 'Components/Form/SelectInput.css';
composes: select from '~Components/Form/SelectInput.css';
margin-left: 3px;
}

@ -3,7 +3,8 @@ import React, { Component } from 'react';
import convertToBytes from 'Utilities/Number/convertToBytes';
import formatBytes from 'Utilities/Number/formatBytes';
import { kinds, filterBuilderTypes, filterBuilderValueTypes } from 'Helpers/Props';
import TagInput, { tagShape } from 'Components/Form/TagInput';
import tagShape from 'Helpers/Props/Shapes/tagShape';
import TagInput from 'Components/Form/TagInput';
import FilterBuilderRowValueTag from './FilterBuilderRowValueTag';
export const NAME = 'value';

@ -7,7 +7,7 @@
}
.label {
composes: label from 'Components/Label.css';
composes: label from '~Components/Label.css';
border-style: none;
font-size: 13px;

@ -2,8 +2,8 @@ import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import tagShape from 'Helpers/Props/Shapes/tagShape';
import { fetchIndexers } from 'Store/Actions/settingsActions';
import { tagShape } from 'Components/Form/TagInput';
import FilterBuilderRowValue from './FilterBuilderRowValue';
function createMapStateToProps() {

@ -3,8 +3,8 @@ import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import getQualities from 'Utilities/Quality/getQualities';
import tagShape from 'Helpers/Props/Shapes/tagShape';
import { fetchQualityProfileSchema } from 'Store/Actions/settingsActions';
import { tagShape } from 'Components/Form/TagInput';
import FilterBuilderRowValue from './FilterBuilderRowValue';
function createMapStateToProps() {

@ -1,13 +1,13 @@
.input {
composes: input from 'Components/Form/Input.css';
composes: input from '~Components/Form/Input.css';
}
.hasError {
composes: hasError from 'Components/Form/Input.css';
composes: hasError from '~Components/Form/Input.css';
}
.hasWarning {
composes: hasWarning from 'Components/Form/Input.css';
composes: hasWarning from '~Components/Form/Input.css';
}
.inputWrapper {

@ -3,19 +3,19 @@
}
.input {
composes: input from 'Components/Form/Input.css';
composes: input from '~Components/Form/Input.css';
}
.hasError {
composes: hasError from 'Components/Form/Input.css';
composes: hasError from '~Components/Form/Input.css';
}
.hasWarning {
composes: hasWarning from 'Components/Form/Input.css';
composes: hasWarning from '~Components/Form/Input.css';
}
.hasButton {
composes: hasButton from 'Components/Form/Input.css';
composes: hasButton from '~Components/Form/Input.css';
}
.recaptchaWrapper {

@ -94,7 +94,7 @@
}
.helpText {
composes: helpText from 'Components/Form/FormInputHelpText.css';
composes: helpText from '~Components/Form/FormInputHelpText.css';
margin-top: 8px;
margin-left: 5px;

@ -3,6 +3,6 @@
}
.inputContainer {
composes: inputContainer from './TagInput.css';
composes: hasButton from 'Components/Form/Input.css';
composes: inputContainer from '~./TagInput.css';
composes: hasButton from '~Components/Form/Input.css';
}

@ -1,9 +1,10 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { icons } from 'Helpers/Props';
import tagShape from 'Helpers/Props/Shapes/tagShape';
import Icon from 'Components/Icon';
import FormInputButton from './FormInputButton';
import TagInput, { tagShape } from './TagInput';
import TagInput from './TagInput';
import styles from './DeviceInput.css';
class DeviceInput extends Component {

@ -3,8 +3,8 @@
}
.enhancedSelect {
composes: input from 'Components/Form/Input.css';
composes: link from 'Components/Link/Link.css';
composes: input from '~Components/Form/Input.css';
composes: link from '~Components/Link/Link.css';
position: relative;
display: flex;
@ -21,11 +21,11 @@
}
.hasError {
composes: hasError from 'Components/Form/Input.css';
composes: hasError from '~Components/Form/Input.css';
}
.hasWarning {
composes: hasWarning from 'Components/Form/Input.css';
composes: hasWarning from '~Components/Form/Input.css';
}
.isDisabled {
@ -62,7 +62,7 @@
}
.optionsModalBody {
composes: modalBody from 'Components/Modal/ModalBody.css';
composes: modalBody from '~Components/Modal/ModalBody.css';
display: flex;
justify-content: center;
@ -71,7 +71,7 @@
}
.optionsModalScroller {
composes: scroller from 'Components/Scroller/Scroller.css';
composes: scroller from '~Components/Scroller/Scroller.css';
border: 1px solid $inputBorderColor;
border-radius: 4px;

@ -1,5 +1,5 @@
.button {
composes: button from 'Components/Link/Button.css';
composes: button from '~Components/Link/Button.css';
border-left: none;
border-top-left-radius: 0;

@ -33,7 +33,7 @@
}
.link {
composes: link from 'Components/Link/Link.css';
composes: link from '~Components/Link/Link.css';
margin-left: 5px;
}

@ -1,5 +1,5 @@
.inputContainer {
composes: input from 'Components/Form/Input.css';
composes: input from '~Components/Form/Input.css';
position: relative;
min-height: 35px;
@ -13,9 +13,9 @@
}
.hasError {
composes: hasError from 'Components/Form/Input.css';
composes: hasError from '~Components/Form/Input.css';
}
.hasWarning {
composes: hasWarning from 'Components/Form/Input.css';
composes: hasWarning from '~Components/Form/Input.css';
}

@ -1,5 +1,5 @@
.input {
composes: input from 'Components/Form/TextInput.css';
composes: input from '~Components/Form/TextInput.css';
font-family: $passwordFamily;
}

@ -1,17 +1,17 @@
.path {
composes: input from 'Components/Form/Input.css';
composes: input from '~Components/Form/Input.css';
}
.hasError {
composes: hasError from 'Components/Form/Input.css';
composes: hasError from '~Components/Form/Input.css';
}
.hasWarning {
composes: hasWarning from 'Components/Form/Input.css';
composes: hasWarning from '~Components/Form/Input.css';
}
.hasFileBrowser {
composes: hasButton from 'Components/Form/Input.css';
composes: hasButton from '~Components/Form/Input.css';
}
.pathInputWrapper {
@ -62,7 +62,7 @@
}
.fileBrowserButton {
composes: button from './FormInputButton.css';
composes: button from '~./FormInputButton.css';
height: 35px;
}

@ -1,5 +1,5 @@
.selectedValue {
composes: selectedValue from './EnhancedSelectInputSelectedValue.css';
composes: selectedValue from '~./EnhancedSelectInputSelectedValue.css';
display: flex;
align-items: center;

@ -1,15 +1,15 @@
.select {
composes: input from 'Components/Form/Input.css';
composes: input from '~Components/Form/Input.css';
padding: 0 11px;
}
.hasError {
composes: hasError from 'Components/Form/Input.css';
composes: hasError from '~Components/Form/Input.css';
}
.hasWarning {
composes: hasWarning from 'Components/Form/Input.css';
composes: hasWarning from '~Components/Form/Input.css';
}
.isDisabled {

@ -1,5 +1,5 @@
.inputContainer {
composes: input from 'Components/Form/Input.css';
composes: input from '~Components/Form/Input.css';
position: relative;
padding: 0;
@ -14,11 +14,11 @@
}
.hasError {
composes: hasError from 'Components/Form/Input.css';
composes: hasError from '~Components/Form/Input.css';
}
.hasWarning {
composes: hasWarning from 'Components/Form/Input.css';
composes: hasWarning from '~Components/Form/Input.css';
}
.tags {

@ -4,6 +4,7 @@ import React, { Component } from 'react';
import Autosuggest from 'react-autosuggest';
import classNames from 'classnames';
import { kinds } from 'Helpers/Props';
import tagShape from 'Helpers/Props/Shapes/tagShape';
import TagInputInput from './TagInputInput';
import TagInputTag from './TagInputTag';
import styles from './TagInput.css';
@ -266,11 +267,6 @@ class TagInput extends Component {
}
}
export const tagShape = {
id: PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string]).isRequired,
name: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired
};
TagInput.propTypes = {
className: PropTypes.string.isRequired,
inputClassName: PropTypes.string.isRequired,

@ -1,7 +1,7 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { kinds } from 'Helpers/Props';
import { tagShape } from './TagInput';
import tagShape from 'Helpers/Props/Shapes/tagShape';
import styles from './TagInputInput.css';
class TagInputInput extends Component {

@ -1,9 +1,9 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { kinds } from 'Helpers/Props';
import tagShape from 'Helpers/Props/Shapes/tagShape';
import Label from 'Components/Label';
import Link from 'Components/Link/Link';
import { tagShape } from './TagInput';
class TagInputTag extends Component {

@ -1,5 +1,5 @@
.input {
composes: input from 'Components/Form/Input.css';
composes: input from '~Components/Form/Input.css';
}
.readOnly {
@ -7,13 +7,13 @@
}
.hasError {
composes: hasError from 'Components/Form/Input.css';
composes: hasError from '~Components/Form/Input.css';
}
.hasWarning {
composes: hasWarning from 'Components/Form/Input.css';
composes: hasWarning from '~Components/Form/Input.css';
}
.hasButton {
composes: hasButton from 'Components/Form/Input.css';
composes: hasButton from '~Components/Form/Input.css';
}

@ -1,5 +1,5 @@
.button {
composes: link from './Link.css';
composes: link from '~./Link.css';
overflow: hidden;
border: 1px solid;

@ -1,5 +1,5 @@
.button {
composes: button from 'Components/Form/FormInputButton.css';
composes: button from '~Components/Form/FormInputButton.css';
position: relative;
}

@ -1,5 +1,5 @@
.button {
composes: link from 'Components/Link/Link.css';
composes: link from '~Components/Link/Link.css';
display: inline-block;
margin: 0 2px;

@ -1,5 +1,5 @@
.button {
composes: button from 'Components/Link/Button.css';
composes: button from '~Components/Link/Button.css';
position: relative;
}

@ -1,5 +1,5 @@
.iconContainer {
composes: spinnerContainer from 'Components/Link/SpinnerButton.css';
composes: spinnerContainer from '~Components/Link/SpinnerButton.css';
}
.icon {
@ -7,7 +7,7 @@
}
.label {
composes: label from 'Components/Link/SpinnerButton.css';
composes: label from '~Components/Link/SpinnerButton.css';
}
.showIcon {

@ -1,5 +1,5 @@
.filterMenu {
composes: menu from './Menu.css';
composes: menu from '~./Menu.css';
}
@media only screen and (max-width: $breakpointSmall) {

@ -1,5 +1,5 @@
.menuButton {
composes: menuButton from './MenuButton.css';
composes: menuButton from '~./MenuButton.css';
&:hover {
color: #666;

@ -1,5 +1,5 @@
.menuButton {
composes: menuButton from './MenuButton.css';
composes: menuButton from '~./MenuButton.css';
width: $toolbarButtonWidth;
height: $toolbarHeight;
@ -7,5 +7,5 @@
}
.label {
composes: label from 'Components/Page/Toolbar/PageToolbarButton.css';
composes: label from '~Components/Page/Toolbar/PageToolbarButton.css';
}

@ -1,5 +1,5 @@
.message {
composes: message from 'Components/Error/ErrorBoundaryError.css';
composes: message from '~Components/Error/ErrorBoundaryError.css';
margin: 0;
margin-bottom: 30px;
@ -8,7 +8,7 @@
}
.details {
composes: details from 'Components/Error/ErrorBoundaryError.css';
composes: details from '~Components/Error/ErrorBoundaryError.css';
margin: 0;
margin-top: 20px;

@ -1,5 +1,5 @@
.toggleButton {
composes: button from 'Components/Link/IconButton.css';
composes: button from '~Components/Link/IconButton.css';
padding: 0;
font-size: inherit;

@ -1,5 +1,5 @@
.page {
composes: page from './Page.css';
composes: page from '~./Page.css';
margin-top: 20px;
text-align: center;

@ -38,7 +38,7 @@
}
.donate {
composes: link from 'Components/Link/Link.css';
composes: link from '~Components/Link/Link.css';
width: 30px;
color: $themeRed;

@ -1,3 +1,3 @@
.page {
composes: page from './Page.css';
composes: page from '~./Page.css';
}

@ -1,3 +1,3 @@
.content {
composes: content from './PageContent.css';
composes: content from '~./PageContent.css';
}

@ -1,3 +1,3 @@
.status {
composes: label from 'Components/Label.css';
composes: label from '~Components/Label.css';
}

@ -1,5 +1,5 @@
.toolbarButton {
composes: link from 'Components/Link/Link.css';
composes: link from '~Components/Link/Link.css';
width: $toolbarButtonWidth;
text-align: center;

@ -23,7 +23,7 @@
}
.overflowMenuButton {
composes: menuButton from 'Components/Menu/ToolbarMenuButton.css';
composes: menuButton from '~Components/Menu/ToolbarMenuButton.css';
}
.overflowMenuItemIcon {

@ -94,7 +94,9 @@ class SignalRConnector extends Component {
componentDidMount() {
console.log('Starting signalR');
this.signalRconnection = $.connection('/signalr', { apiKey: window.Sonarr.apiKey });
const url = `${window.Sonarr.urlBase}/signalr`;
this.signalRconnection = $.connection(url, { apiKey: window.Sonarr.apiKey });
this.signalRconnection.stateChanged(this.onStateChanged);
this.signalRconnection.received(this.onReceived);

@ -1,5 +1,5 @@
.cell {
composes: cell from './TableRowCell.css';
composes: cell from '~./TableRowCell.css';
width: 180px;
}

@ -1,4 +1,4 @@
.cell {
composes: cell from './TableRowCell.css';
composes: link from 'Components/Link/Link.css';
composes: cell from '~./TableRowCell.css';
composes: link from '~Components/Link/Link.css';
}

@ -1,11 +1,11 @@
.selectCell {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 30px;
}
.input {
composes: input from 'Components/Form/CheckInput.css';
composes: input from '~Components/Form/CheckInput.css';
margin: 0;
}

@ -1,6 +1,6 @@
.cell {
@add-mixin truncate;
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
flex-grow: 0;
flex-shrink: 1;

@ -1,11 +1,11 @@
.cell {
composes: cell from 'Components/Table/Cells/VirtualTableRowCell.css';
composes: cell from '~Components/Table/Cells/VirtualTableRowCell.css';
flex: 0 0 36px;
}
.input {
composes: input from 'Components/Form/CheckInput.css';
composes: input from '~Components/Form/CheckInput.css';
margin: 0;
}

@ -21,7 +21,7 @@
}
.loading {
composes: loading from 'Components/Loading/LoadingIndicator.css';
composes: loading from '~Components/Loading/LoadingIndicator.css';
margin: 0;
margin-left: 5px;
@ -54,7 +54,7 @@
}
.pageSelect {
composes: select from 'Components/Form/SelectInput.css';
composes: select from '~Components/Form/SelectInput.css';
padding: 0 2px;
height: 25px;

@ -1,4 +1,4 @@
.row {
composes: link from 'Components/Link/Link.css';
composes: row from './TableRow.css';
composes: link from '~Components/Link/Link.css';
composes: row from '~./TableRow.css';
}

@ -1,11 +1,11 @@
.selectAllHeaderCell {
composes: headerCell from 'Components/Table/VirtualTableHeaderCell.css';
composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
width: 30px;
}
.input {
composes: input from 'Components/Form/CheckInput.css';
composes: input from '~Components/Form/CheckInput.css';
margin: 0;
}

@ -1,11 +1,11 @@
.selectAllHeaderCell {
composes: headerCell from 'Components/Table/TableHeaderCell.css';
composes: headerCell from '~Components/Table/TableHeaderCell.css';
flex: 0 0 36px;
}
.input {
composes: input from 'Components/Form/CheckInput.css';
composes: input from '~Components/Form/CheckInput.css';
margin: 0;
}

@ -38,7 +38,7 @@
}
.openSeriesButton {
composes: button from 'Components/Link/Button.css';
composes: button from '~Components/Link/Button.css';
margin-right: auto;
}

@ -1,5 +1,5 @@
.episodeSearchCell {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 70px;
white-space: nowrap;

@ -1,5 +1,5 @@
.link {
composes: link from 'Components/Link/Link.css';
composes: link from '~Components/Link/Link.css';
&:hover {
color: $linkHoverColor;

@ -1,6 +1,6 @@
.details,
.actions {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 65px;
}

@ -1,17 +1,17 @@
.descriptionList {
composes: descriptionList from 'Components/DescriptionList/DescriptionList.css';
composes: descriptionList from '~Components/DescriptionList/DescriptionList.css';
margin-right: 10px;
}
.title {
composes: title from 'Components/DescriptionList/DescriptionListItemTitle.css';
composes: title from '~Components/DescriptionList/DescriptionListItemTitle.css';
width: 80px;
}
.description {
composes: title from 'Components/DescriptionList/DescriptionListItemDescription.css';
composes: title from '~Components/DescriptionList/DescriptionListItemDescription.css';
margin-left: 100px;
}

@ -6,7 +6,7 @@
}
.button {
composes: button from 'Components/Link/Button.css';
composes: button from '~Components/Link/Button.css';
width: 300px;
}

@ -0,0 +1,8 @@
import PropTypes from 'prop-types';
const tagShape = {
id: PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string]).isRequired,
name: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired
};
export default tagShape;

@ -14,7 +14,7 @@
}
.button {
composes: button from 'Components/Link/Button.css';
composes: button from '~Components/Link/Button.css';
width: 300px;
}

@ -1,5 +1,5 @@
.actions {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 40px;
}

@ -9,7 +9,7 @@
}
.footer {
composes: modalFooter from 'Components/Modal/ModalFooter.css';
composes: modalFooter from '~Components/Modal/ModalFooter.css';
justify-content: space-between;
padding: 15px;
@ -28,7 +28,7 @@
.importMode,
.bulkSelect {
composes: select from 'Components/Form/SelectInput.css';
composes: select from '~Components/Form/SelectInput.css';
margin-right: 10px;
width: auto;

@ -1,18 +1,18 @@
.relativePath {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
word-break: break-all;
}
.quality,
.language {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
text-align: center;
}
.label {
composes: label from 'Components/Label.css';
composes: label from '~Components/Label.css';
cursor: pointer;
}

@ -1,5 +1,5 @@
.modalBody {
composes: modalBody from 'Components/Modal/ModalBody.css';
composes: modalBody from '~Components/Modal/ModalBody.css';
display: flex;
flex: 1 1 auto;
@ -7,7 +7,7 @@
}
.filterInput {
composes: input from 'Components/Form/TextInput.css';
composes: input from '~Components/Form/TextInput.css';
flex: 0 0 auto;
margin-bottom: 20px;

@ -1,12 +1,12 @@
.title {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
word-break: break-all;
}
.quality,
.language {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
text-align: center;
}
@ -16,7 +16,7 @@
}
.preferredWordScore {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 55px;
font-weight: bold;
@ -25,14 +25,14 @@
.rejected,
.download {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 50px;
}
.age,
.size {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
white-space: nowrap;
}

@ -18,7 +18,7 @@
}
.selectAllInput {
composes: input from 'Components/Form/CheckInput.css';
composes: input from '~Components/Form/CheckInput.css';
margin: 0;
}

@ -1,18 +1,18 @@
.link {
composes: link from 'Components/Link/Link.css';
composes: link from '~Components/Link/Link.css';
display: block;
}
.freeSpace,
.unmappedFolders {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 150px;
}
.actions {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 45px;
}

@ -8,7 +8,7 @@
}
.updateSelectedButton {
composes: button from 'Components/Link/SpinnerButton.css';
composes: button from '~Components/Link/SpinnerButton.css';
height: 35px;
}

@ -1,19 +1,19 @@
.status,
.monitored {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 50px;
}
.title {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 1px;
white-space: nowrap;
}
.seasons {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
display: flex;
flex-wrap: wrap;

@ -1,23 +1,23 @@
.title {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
white-space: nowrap;
}
.monitored {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 42px;
}
.episodeNumber {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 50px;
}
.size {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 100px;
}
@ -26,7 +26,7 @@
.audio,
.video,
.status {
composes: cell from 'Components/Table/Cells/TableRowCell.css';
composes: cell from '~Components/Table/Cells/TableRowCell.css';
width: 100px;
}

@ -1,11 +1,11 @@
.title {
composes: title from 'Components/DescriptionList/DescriptionListItemTitle.css';
composes: title from '~Components/DescriptionList/DescriptionListItemTitle.css';
width: 90px;
}
.description {
composes: title from 'Components/DescriptionList/DescriptionListItemDescription.css';
composes: title from '~Components/DescriptionList/DescriptionListItemDescription.css';
margin-left: 110px;
}

@ -69,7 +69,7 @@
}
.monitorToggleButton {
composes: toggleButton from 'Components/MonitorToggleButton.css';
composes: toggleButton from '~Components/MonitorToggleButton.css';
width: 40px;
@ -88,7 +88,7 @@
}
.seriesNavigationButton {
composes: button from 'Components/Link/IconButton.css';
composes: button from '~Components/Link/IconButton.css';
margin-left: 5px;
width: 30px;
@ -111,7 +111,7 @@
}
.detailsLabel {
composes: label from 'Components/Label.css';
composes: label from '~Components/Label.css';
margin: 5px 10px 5px 0;
}

@ -7,7 +7,7 @@
}
.linkLabel {
composes: label from 'Components/Label.css';
composes: label from '~Components/Label.css';
cursor: pointer;
}

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save