diff --git a/frontend/src/DownloadClient/DownloadProtocol.ts b/frontend/src/DownloadClient/DownloadProtocol.ts
index 090a1a087..417db8178 100644
--- a/frontend/src/DownloadClient/DownloadProtocol.ts
+++ b/frontend/src/DownloadClient/DownloadProtocol.ts
@@ -1,7 +1,3 @@
-enum DownloadProtocol {
- Unknown = 'unknown',
- Usenet = 'usenet',
- Torrent = 'torrent',
-}
+type DownloadProtocol = 'usenet' | 'torrent' | 'unknown';
export default DownloadProtocol;
diff --git a/frontend/src/Helpers/Hooks/useCurrentPage.ts b/frontend/src/Helpers/Hooks/useCurrentPage.ts
new file mode 100644
index 000000000..3caf66df2
--- /dev/null
+++ b/frontend/src/Helpers/Hooks/useCurrentPage.ts
@@ -0,0 +1,9 @@
+import { useHistory } from 'react-router-dom';
+
+function useCurrentPage() {
+ const history = useHistory();
+
+ return history.action === 'POP';
+}
+
+export default useCurrentPage;
diff --git a/frontend/src/Helpers/Hooks/useModalOpenState.ts b/frontend/src/Helpers/Hooks/useModalOpenState.ts
index f5b5a96f0..24cffb2f1 100644
--- a/frontend/src/Helpers/Hooks/useModalOpenState.ts
+++ b/frontend/src/Helpers/Hooks/useModalOpenState.ts
@@ -3,15 +3,15 @@ import { useCallback, useState } from 'react';
export default function useModalOpenState(
initialState: boolean
): [boolean, () => void, () => void] {
- const [isOpen, setOpen] = useState(initialState);
+ const [isOpen, setIsOpen] = useState(initialState);
const setModalOpen = useCallback(() => {
- setOpen(true);
- }, [setOpen]);
+ setIsOpen(true);
+ }, [setIsOpen]);
const setModalClosed = useCallback(() => {
- setOpen(false);
- }, [setOpen]);
+ setIsOpen(false);
+ }, [setIsOpen]);
return [isOpen, setModalOpen, setModalClosed];
}
diff --git a/frontend/src/Helpers/Props/TooltipPosition.ts b/frontend/src/Helpers/Props/TooltipPosition.ts
new file mode 100644
index 000000000..885c73470
--- /dev/null
+++ b/frontend/src/Helpers/Props/TooltipPosition.ts
@@ -0,0 +1,3 @@
+type TooltipPosition = 'top' | 'right' | 'bottom' | 'left';
+
+export default TooltipPosition;
diff --git a/frontend/src/Helpers/Props/align.js b/frontend/src/Helpers/Props/align.ts
similarity index 100%
rename from frontend/src/Helpers/Props/align.js
rename to frontend/src/Helpers/Props/align.ts
diff --git a/frontend/src/Helpers/Props/kinds.js b/frontend/src/Helpers/Props/kinds.ts
similarity index 72%
rename from frontend/src/Helpers/Props/kinds.js
rename to frontend/src/Helpers/Props/kinds.ts
index b0f5ac87f..7ce606716 100644
--- a/frontend/src/Helpers/Props/kinds.js
+++ b/frontend/src/Helpers/Props/kinds.ts
@@ -7,7 +7,6 @@ export const PRIMARY = 'primary';
export const PURPLE = 'purple';
export const SUCCESS = 'success';
export const WARNING = 'warning';
-export const QUEUE = 'queue';
export const all = [
DANGER,
@@ -19,5 +18,15 @@ export const all = [
PURPLE,
SUCCESS,
WARNING,
- QUEUE
-];
+] as const;
+
+export type Kind =
+ | 'danger'
+ | 'default'
+ | 'disabled'
+ | 'info'
+ | 'inverse'
+ | 'primary'
+ | 'purple'
+ | 'success'
+ | 'warning';
diff --git a/frontend/src/Helpers/Props/sizes.js b/frontend/src/Helpers/Props/sizes.ts
similarity index 71%
rename from frontend/src/Helpers/Props/sizes.js
rename to frontend/src/Helpers/Props/sizes.ts
index d7f85df5e..ca7a50fbf 100644
--- a/frontend/src/Helpers/Props/sizes.js
+++ b/frontend/src/Helpers/Props/sizes.ts
@@ -4,4 +4,6 @@ export const MEDIUM = 'medium';
export const LARGE = 'large';
export const EXTRA_LARGE = 'extraLarge';
-export const all = [EXTRA_SMALL, SMALL, MEDIUM, LARGE, EXTRA_LARGE];
+export const all = [EXTRA_SMALL, SMALL, MEDIUM, LARGE, EXTRA_LARGE] as const;
+
+export type Size = 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge';
diff --git a/frontend/src/History/Details/HistoryDetails.js b/frontend/src/History/Details/HistoryDetails.js
index 461ccc2d1..6d5ab260e 100644
--- a/frontend/src/History/Details/HistoryDetails.js
+++ b/frontend/src/History/Details/HistoryDetails.js
@@ -3,6 +3,7 @@ import React from 'react';
import DescriptionList from 'Components/DescriptionList/DescriptionList';
import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
import Link from 'Components/Link/Link';
+import formatDateTime from 'Utilities/Date/formatDateTime';
import translate from 'Utilities/String/translate';
import styles from './HistoryDetails.css';
@@ -10,7 +11,10 @@ function HistoryDetails(props) {
const {
indexer,
eventType,
- data
+ date,
+ data,
+ shortDateFormat,
+ timeFormat
} = props;
if (eventType === 'indexerQuery' || eventType === 'indexerRss') {
@@ -22,7 +26,9 @@ function HistoryDetails(props) {
offset,
source,
host,
- url
+ url,
+ elapsedTime,
+ cached
} = data;
return (
@@ -104,6 +110,24 @@ function HistoryDetails(props) {
/> :
null
}
+
+ {
+ elapsedTime ?
+
:
+ null
+ }
+
+ {
+ date ?
+
:
+ null
+ }
);
}
@@ -111,10 +135,19 @@ function HistoryDetails(props) {
if (eventType === 'releaseGrabbed') {
const {
source,
+ host,
grabTitle,
- url
+ url,
+ publishedDate,
+ infoUrl,
+ downloadClient,
+ downloadClientName,
+ elapsedTime,
+ grabMethod
} = data;
+ const downloadClientNameInfo = downloadClientName ?? downloadClient;
+
return (
{
@@ -135,6 +168,15 @@ function HistoryDetails(props) {
null
}
+ {
+ data ?
+ :
+ null
+ }
+
{
data ?
{infoUrl}}
+ /> :
+ null
+ }
+
+ {
+ publishedDate ?
+ :
+ null
+ }
+
+ {
+ downloadClientNameInfo ?
+ :
+ null
+ }
+
{
data ?
:
null
}
+
+ {
+ elapsedTime ?
+ :
+ null
+ }
+
+ {
+ grabMethod ?
+ :
+ null
+ }
+
+ {
+ date ?
+ :
+ null
+ }
);
}
if (eventType === 'indexerAuth') {
+ const { elapsedTime } = data;
+
return (
:
null
}
+
+ {
+ elapsedTime ?
+
:
+ null
+ }
+
+ {
+ date ?
+
:
+ null
+ }
);
}
@@ -181,6 +297,15 @@ function HistoryDetails(props) {
title={translate('Name')}
data={data.query}
/>
+
+ {
+ date ?
+
:
+ null
+ }
);
}
@@ -188,6 +313,7 @@ function HistoryDetails(props) {
HistoryDetails.propTypes = {
indexer: PropTypes.object.isRequired,
eventType: PropTypes.string.isRequired,
+ date: PropTypes.string.isRequired,
data: PropTypes.object.isRequired,
shortDateFormat: PropTypes.string.isRequired,
timeFormat: PropTypes.string.isRequired
diff --git a/frontend/src/History/Details/HistoryDetailsModal.js b/frontend/src/History/Details/HistoryDetailsModal.js
index fbc3114ad..560955de3 100644
--- a/frontend/src/History/Details/HistoryDetailsModal.js
+++ b/frontend/src/History/Details/HistoryDetailsModal.js
@@ -29,6 +29,7 @@ function HistoryDetailsModal(props) {
isOpen,
eventType,
indexer,
+ date,
data,
shortDateFormat,
timeFormat,
@@ -49,6 +50,7 @@ function HistoryDetailsModal(props) {
);
}
@@ -370,8 +371,9 @@ class HistoryRow extends Component {
return (
);
}
@@ -408,6 +410,7 @@ class HistoryRow extends Component {
{value};
} else if (type === 'tmdb') {
link = (
- {value}
+
+ {value}
+
);
} else if (type === 'tvdb') {
link = (
diff --git a/frontend/src/Indexer/Add/AddIndexerModal.js b/frontend/src/Indexer/Add/AddIndexerModal.js
deleted file mode 100644
index 9344c8130..000000000
--- a/frontend/src/Indexer/Add/AddIndexerModal.js
+++ /dev/null
@@ -1,31 +0,0 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-import Modal from 'Components/Modal/Modal';
-import { sizes } from 'Helpers/Props';
-import AddIndexerModalContentConnector from './AddIndexerModalContentConnector';
-import styles from './AddIndexerModal.css';
-
-function AddIndexerModal({ isOpen, onModalClose, onSelectIndexer, ...otherProps }) {
- return (
-
-
-
- );
-}
-
-AddIndexerModal.propTypes = {
- isOpen: PropTypes.bool.isRequired,
- onModalClose: PropTypes.func.isRequired,
- onSelectIndexer: PropTypes.func.isRequired
-};
-
-export default AddIndexerModal;
diff --git a/frontend/src/Indexer/Add/AddIndexerModal.tsx b/frontend/src/Indexer/Add/AddIndexerModal.tsx
new file mode 100644
index 000000000..be22eec57
--- /dev/null
+++ b/frontend/src/Indexer/Add/AddIndexerModal.tsx
@@ -0,0 +1,44 @@
+import React, { useCallback } from 'react';
+import { useDispatch } from 'react-redux';
+import Modal from 'Components/Modal/Modal';
+import { sizes } from 'Helpers/Props';
+import { clearIndexerSchema } from 'Store/Actions/indexerActions';
+import AddIndexerModalContent from './AddIndexerModalContent';
+import styles from './AddIndexerModal.css';
+
+interface AddIndexerModalProps {
+ isOpen: boolean;
+ onSelectIndexer(): void;
+ onModalClose(): void;
+}
+
+function AddIndexerModal({
+ isOpen,
+ onSelectIndexer,
+ onModalClose,
+ ...otherProps
+}: AddIndexerModalProps) {
+ const dispatch = useDispatch();
+
+ const onModalClosePress = useCallback(() => {
+ dispatch(clearIndexerSchema());
+ onModalClose();
+ }, [dispatch, onModalClose]);
+
+ return (
+
+
+
+ );
+}
+
+export default AddIndexerModal;
diff --git a/frontend/src/Indexer/Add/AddIndexerModalContent.css b/frontend/src/Indexer/Add/AddIndexerModalContent.css
index a58eccfbc..e824c5475 100644
--- a/frontend/src/Indexer/Add/AddIndexerModalContent.css
+++ b/frontend/src/Indexer/Add/AddIndexerModalContent.css
@@ -19,12 +19,18 @@
margin-bottom: 16px;
}
-.alert {
+.notice {
composes: alert from '~Components/Alert.css';
margin-bottom: 20px;
}
+.alert {
+ composes: alert from '~Components/Alert.css';
+
+ text-align: center;
+}
+
.scroller {
flex: 1 1 auto;
}
diff --git a/frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts b/frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts
index cbedc72a4..5978832e4 100644
--- a/frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts
+++ b/frontend/src/Indexer/Add/AddIndexerModalContent.css.d.ts
@@ -10,6 +10,7 @@ interface CssExports {
'indexers': string;
'modalBody': string;
'modalFooter': string;
+ 'notice': string;
'scroller': string;
}
export const cssExports: CssExports;
diff --git a/frontend/src/Indexer/Add/AddIndexerModalContent.js b/frontend/src/Indexer/Add/AddIndexerModalContent.js
deleted file mode 100644
index f4050560e..000000000
--- a/frontend/src/Indexer/Add/AddIndexerModalContent.js
+++ /dev/null
@@ -1,324 +0,0 @@
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import Alert from 'Components/Alert';
-import EnhancedSelectInput from 'Components/Form/EnhancedSelectInput';
-import NewznabCategorySelectInputConnector from 'Components/Form/NewznabCategorySelectInputConnector';
-import TextInput from 'Components/Form/TextInput';
-import Button from 'Components/Link/Button';
-import LoadingIndicator from 'Components/Loading/LoadingIndicator';
-import ModalBody from 'Components/Modal/ModalBody';
-import ModalContent from 'Components/Modal/ModalContent';
-import ModalFooter from 'Components/Modal/ModalFooter';
-import ModalHeader from 'Components/Modal/ModalHeader';
-import Scroller from 'Components/Scroller/Scroller';
-import Table from 'Components/Table/Table';
-import TableBody from 'Components/Table/TableBody';
-import { kinds, scrollDirections } from 'Helpers/Props';
-import getErrorMessage from 'Utilities/Object/getErrorMessage';
-import translate from 'Utilities/String/translate';
-import SelectIndexerRow from './SelectIndexerRow';
-import styles from './AddIndexerModalContent.css';
-
-const columns = [
- {
- name: 'protocol',
- label: () => translate('Protocol'),
- isSortable: true,
- isVisible: true
- },
- {
- name: 'sortName',
- label: () => translate('Name'),
- isSortable: true,
- isVisible: true
- },
- {
- name: 'language',
- label: () => translate('Language'),
- isSortable: true,
- isVisible: true
- },
- {
- name: 'description',
- label: () => translate('Description'),
- isSortable: false,
- isVisible: true
- },
- {
- name: 'privacy',
- label: () => translate('Privacy'),
- isSortable: true,
- isVisible: true
- },
- {
- name: 'categories',
- label: () => translate('Categories'),
- isSortable: false,
- isVisible: true
- }
-];
-
-const protocols = [
- {
- key: 'torrent',
- value: 'torrent'
- },
- {
- key: 'usenet',
- value: 'nzb'
- }
-];
-
-const privacyLevels = [
- {
- key: 'private',
- get value() {
- return translate('Private');
- }
- },
- {
- key: 'semiPrivate',
- get value() {
- return translate('SemiPrivate');
- }
- },
- {
- key: 'public',
- get value() {
- return translate('Public');
- }
- }
-];
-
-class AddIndexerModalContent extends Component {
-
- //
- // Lifecycle
-
- constructor(props, context) {
- super(props, context);
-
- this.state = {
- filter: '',
- filterProtocols: [],
- filterLanguages: [],
- filterPrivacyLevels: [],
- filterCategories: []
- };
- }
-
- //
- // Listeners
-
- onFilterChange = ({ value }) => {
- this.setState({ filter: value });
- };
-
- //
- // Render
-
- render() {
- const {
- indexers,
- onIndexerSelect,
- sortKey,
- sortDirection,
- isFetching,
- isPopulated,
- error,
- onSortPress,
- onModalClose
- } = this.props;
-
- const languages = Array.from(new Set(indexers.map(({ language }) => language)))
- .sort((a, b) => a.localeCompare(b))
- .map((language) => ({ key: language, value: language }));
-
- const filteredIndexers = indexers.filter((indexer) => {
- const {
- filter,
- filterProtocols,
- filterLanguages,
- filterPrivacyLevels,
- filterCategories
- } = this.state;
-
- if (!indexer.name.toLowerCase().includes(filter.toLocaleLowerCase()) && !indexer.description.toLowerCase().includes(filter.toLocaleLowerCase())) {
- return false;
- }
-
- if (filterProtocols.length && !filterProtocols.includes(indexer.protocol)) {
- return false;
- }
-
- if (filterLanguages.length && !filterLanguages.includes(indexer.language)) {
- return false;
- }
-
- if (filterPrivacyLevels.length && !filterPrivacyLevels.includes(indexer.privacy)) {
- return false;
- }
-
- if (filterCategories.length) {
- const { categories = [] } = indexer.capabilities || {};
- const flat = ({ id, subCategories = [] }) => [id, ...subCategories.flatMap(flat)];
- const flatCategories = categories
- .filter((item) => item.id < 100000)
- .flatMap(flat);
-
- if (!filterCategories.every((item) => flatCategories.includes(item))) {
- return false;
- }
- }
-
- return true;
- });
-
- const errorMessage = getErrorMessage(error, translate('UnableToLoadIndexers'));
-
- return (
-
-
- {translate('AddIndexer')}
-
-
-
-
-
-
-
-
- this.setState({ filterProtocols: value })}
- />
-
-
-
-
- this.setState({ filterLanguages: value })}
- />
-
-
-
-
- this.setState({ filterPrivacyLevels: value })}
- />
-
-
-
-
- this.setState({ filterCategories: value })}
- />
-
-
- {translate('ProwlarrSupportsAnyIndexer')}
-
-
-
-
- {
- isFetching ? : null
- }
- {
- error ? {errorMessage} : null
- }
- {
- isPopulated && !!indexers.length ?
-
-
- {
- filteredIndexers.map((indexer) => (
-
- ))
- }
-
-
:
- null
- }
- {
- isPopulated && !!indexers.length && !filteredIndexers.length ?
-
- {translate('NoIndexersFound')}
- :
- null
- }
-
-
-
-
-
- {
- isPopulated ?
- translate('CountIndexersAvailable', { count: filteredIndexers.length }) :
- null
- }
-
-
-
-
-
-
-
- );
- }
-}
-
-AddIndexerModalContent.propTypes = {
- isFetching: PropTypes.bool.isRequired,
- isPopulated: PropTypes.bool.isRequired,
- error: PropTypes.object,
- sortKey: PropTypes.string,
- sortDirection: PropTypes.string,
- onSortPress: PropTypes.func.isRequired,
- indexers: PropTypes.arrayOf(PropTypes.object).isRequired,
- onIndexerSelect: PropTypes.func.isRequired,
- onModalClose: PropTypes.func.isRequired
-};
-
-export default AddIndexerModalContent;
diff --git a/frontend/src/Indexer/Add/AddIndexerModalContent.tsx b/frontend/src/Indexer/Add/AddIndexerModalContent.tsx
new file mode 100644
index 000000000..be1413769
--- /dev/null
+++ b/frontend/src/Indexer/Add/AddIndexerModalContent.tsx
@@ -0,0 +1,434 @@
+import { some } from 'lodash';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { createSelector } from 'reselect';
+import IndexerAppState from 'App/State/IndexerAppState';
+import Alert from 'Components/Alert';
+import EnhancedSelectInput from 'Components/Form/EnhancedSelectInput';
+import NewznabCategorySelectInputConnector from 'Components/Form/NewznabCategorySelectInputConnector';
+import TextInput from 'Components/Form/TextInput';
+import Button from 'Components/Link/Button';
+import LoadingIndicator from 'Components/Loading/LoadingIndicator';
+import ModalBody from 'Components/Modal/ModalBody';
+import ModalContent from 'Components/Modal/ModalContent';
+import ModalFooter from 'Components/Modal/ModalFooter';
+import ModalHeader from 'Components/Modal/ModalHeader';
+import Scroller from 'Components/Scroller/Scroller';
+import Table from 'Components/Table/Table';
+import TableBody from 'Components/Table/TableBody';
+import { kinds, scrollDirections } from 'Helpers/Props';
+import Indexer, { IndexerCategory } from 'Indexer/Indexer';
+import {
+ fetchIndexerSchema,
+ selectIndexerSchema,
+ setIndexerSchemaSort,
+} from 'Store/Actions/indexerActions';
+import createAllIndexersSelector from 'Store/Selectors/createAllIndexersSelector';
+import createClientSideCollectionSelector from 'Store/Selectors/createClientSideCollectionSelector';
+import { SortCallback } from 'typings/callbacks';
+import sortByProp from 'Utilities/Array/sortByProp';
+import getErrorMessage from 'Utilities/Object/getErrorMessage';
+import translate from 'Utilities/String/translate';
+import SelectIndexerRow from './SelectIndexerRow';
+import styles from './AddIndexerModalContent.css';
+
+const COLUMNS = [
+ {
+ name: 'protocol',
+ label: () => translate('Protocol'),
+ isSortable: true,
+ isVisible: true,
+ },
+ {
+ name: 'sortName',
+ label: () => translate('Name'),
+ isSortable: true,
+ isVisible: true,
+ },
+ {
+ name: 'language',
+ label: () => translate('Language'),
+ isSortable: true,
+ isVisible: true,
+ },
+ {
+ name: 'description',
+ label: () => translate('Description'),
+ isSortable: false,
+ isVisible: true,
+ },
+ {
+ name: 'privacy',
+ label: () => translate('Privacy'),
+ isSortable: true,
+ isVisible: true,
+ },
+ {
+ name: 'categories',
+ label: () => translate('Categories'),
+ isSortable: false,
+ isVisible: true,
+ },
+];
+
+const PROTOCOLS = [
+ {
+ key: 'torrent',
+ value: 'torrent',
+ },
+ {
+ key: 'usenet',
+ value: 'nzb',
+ },
+];
+
+const PRIVACY_LEVELS = [
+ {
+ key: 'private',
+ get value() {
+ return translate('Private');
+ },
+ },
+ {
+ key: 'semiPrivate',
+ get value() {
+ return translate('SemiPrivate');
+ },
+ },
+ {
+ key: 'public',
+ get value() {
+ return translate('Public');
+ },
+ },
+];
+
+interface IndexerSchema extends Indexer {
+ isExistingIndexer: boolean;
+}
+
+function createAddIndexersSelector() {
+ return createSelector(
+ createClientSideCollectionSelector('indexers.schema'),
+ createAllIndexersSelector(),
+ (indexers: IndexerAppState, allIndexers) => {
+ const { isFetching, isPopulated, error, items, sortDirection, sortKey } =
+ indexers;
+
+ const indexerList: IndexerSchema[] = items.map((item) => {
+ const { definitionName } = item;
+ return {
+ ...item,
+ isExistingIndexer: some(allIndexers, { definitionName }),
+ };
+ });
+
+ return {
+ isFetching,
+ isPopulated,
+ error,
+ indexers: indexerList,
+ sortKey,
+ sortDirection,
+ };
+ }
+ );
+}
+
+interface AddIndexerModalContentProps {
+ onSelectIndexer(): void;
+ onModalClose(): void;
+}
+
+function AddIndexerModalContent(props: AddIndexerModalContentProps) {
+ const { onSelectIndexer, onModalClose } = props;
+
+ const { isFetching, isPopulated, error, indexers, sortKey, sortDirection } =
+ useSelector(createAddIndexersSelector());
+ const dispatch = useDispatch();
+
+ const [filter, setFilter] = useState('');
+ const [filterProtocols, setFilterProtocols] = useState([]);
+ const [filterLanguages, setFilterLanguages] = useState([]);
+ const [filterPrivacyLevels, setFilterPrivacyLevels] = useState([]);
+ const [filterCategories, setFilterCategories] = useState([]);
+
+ useEffect(
+ () => {
+ dispatch(fetchIndexerSchema());
+ },
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ []
+ );
+
+ const onFilterChange = useCallback(
+ ({ value }: { value: string }) => {
+ setFilter(value);
+ },
+ [setFilter]
+ );
+
+ const onFilterProtocolsChange = useCallback(
+ ({ value }: { value: string[] }) => {
+ setFilterProtocols(value);
+ },
+ [setFilterProtocols]
+ );
+
+ const onFilterLanguagesChange = useCallback(
+ ({ value }: { value: string[] }) => {
+ setFilterLanguages(value);
+ },
+ [setFilterLanguages]
+ );
+
+ const onFilterPrivacyLevelsChange = useCallback(
+ ({ value }: { value: string[] }) => {
+ setFilterPrivacyLevels(value);
+ },
+ [setFilterPrivacyLevels]
+ );
+
+ const onFilterCategoriesChange = useCallback(
+ ({ value }: { value: number[] }) => {
+ setFilterCategories(value);
+ },
+ [setFilterCategories]
+ );
+
+ const onIndexerSelect = useCallback(
+ ({
+ implementation,
+ implementationName,
+ name,
+ }: {
+ implementation: string;
+ implementationName: string;
+ name: string;
+ }) => {
+ dispatch(
+ selectIndexerSchema({
+ implementation,
+ implementationName,
+ name,
+ })
+ );
+
+ onSelectIndexer();
+ },
+ [dispatch, onSelectIndexer]
+ );
+
+ const onSortPress = useCallback(
+ (sortKey, sortDirection) => {
+ dispatch(setIndexerSchemaSort({ sortKey, sortDirection }));
+ },
+ [dispatch]
+ );
+
+ const languages = useMemo(
+ () =>
+ Array.from(new Set(indexers.map(({ language }) => language)))
+ .map((language) => ({ key: language, value: language }))
+ .sort(sortByProp('value')),
+ [indexers]
+ );
+
+ const filteredIndexers = useMemo(() => {
+ const flat = ({
+ id,
+ subCategories = [],
+ }: {
+ id: number;
+ subCategories: IndexerCategory[];
+ }): number[] => [id, ...subCategories.flatMap(flat)];
+
+ return indexers.filter((indexer) => {
+ if (
+ filter.length &&
+ !indexer.name.toLowerCase().includes(filter.toLocaleLowerCase()) &&
+ !indexer.description.toLowerCase().includes(filter.toLocaleLowerCase())
+ ) {
+ return false;
+ }
+
+ if (
+ filterProtocols.length &&
+ !filterProtocols.includes(indexer.protocol)
+ ) {
+ return false;
+ }
+
+ if (
+ filterLanguages.length &&
+ !filterLanguages.includes(indexer.language)
+ ) {
+ return false;
+ }
+
+ if (
+ filterPrivacyLevels.length &&
+ !filterPrivacyLevels.includes(indexer.privacy)
+ ) {
+ return false;
+ }
+
+ if (filterCategories.length) {
+ const { categories = [] } = indexer.capabilities || {};
+
+ const flatCategories = categories
+ .filter((item) => item.id < 100000)
+ .flatMap(flat);
+
+ if (
+ !filterCategories.every((categoryId) =>
+ flatCategories.includes(categoryId)
+ )
+ ) {
+ return false;
+ }
+ }
+
+ return true;
+ });
+ }, [
+ indexers,
+ filter,
+ filterProtocols,
+ filterLanguages,
+ filterPrivacyLevels,
+ filterCategories,
+ ]);
+
+ const errorMessage = getErrorMessage(
+ error,
+ translate('UnableToLoadIndexers')
+ );
+
+ return (
+
+ {translate('AddIndexer')}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{translate('ProwlarrSupportsAnyIndexer')}
+
+
+
+ {isFetching ? : null}
+
+ {error ? (
+
+ {errorMessage}
+
+ ) : null}
+
+ {isPopulated && !!indexers.length ? (
+
+
+ {filteredIndexers.map((indexer) => (
+
+ ))}
+
+
+ ) : null}
+
+ {isPopulated && !!indexers.length && !filteredIndexers.length ? (
+
+ {translate('NoIndexersFound')}
+
+ ) : null}
+
+
+
+
+
+ {isPopulated
+ ? translate('CountIndexersAvailable', {
+ count: filteredIndexers.length,
+ })
+ : null}
+
+
+
+
+
+
+
+ );
+}
+
+export default AddIndexerModalContent;
diff --git a/frontend/src/Indexer/Add/AddIndexerModalContentConnector.js b/frontend/src/Indexer/Add/AddIndexerModalContentConnector.js
deleted file mode 100644
index a422e0a03..000000000
--- a/frontend/src/Indexer/Add/AddIndexerModalContentConnector.js
+++ /dev/null
@@ -1,94 +0,0 @@
-import { some } from 'lodash';
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import { connect } from 'react-redux';
-import { createSelector } from 'reselect';
-import { fetchIndexerSchema, selectIndexerSchema, setIndexerSchemaSort } from 'Store/Actions/indexerActions';
-import createAllIndexersSelector from 'Store/Selectors/createAllIndexersSelector';
-import createClientSideCollectionSelector from 'Store/Selectors/createClientSideCollectionSelector';
-import AddIndexerModalContent from './AddIndexerModalContent';
-
-function createMapStateToProps() {
- return createSelector(
- createClientSideCollectionSelector('indexers.schema'),
- createAllIndexersSelector(),
- (indexers, allIndexers) => {
- const {
- isFetching,
- isPopulated,
- error,
- items,
- sortDirection,
- sortKey
- } = indexers;
-
- const indexerList = items.map((item) => {
- const { definitionName } = item;
- return {
- ...item,
- isExistingIndexer: some(allIndexers, { definitionName })
- };
- });
-
- return {
- isFetching,
- isPopulated,
- error,
- indexers: indexerList,
- sortKey,
- sortDirection
- };
- }
- );
-}
-
-const mapDispatchToProps = {
- fetchIndexerSchema,
- selectIndexerSchema,
- setIndexerSchemaSort
-};
-
-class AddIndexerModalContentConnector extends Component {
-
- //
- // Lifecycle
-
- componentDidMount() {
- this.props.fetchIndexerSchema();
- }
-
- //
- // Listeners
-
- onIndexerSelect = ({ implementation, implementationName, name }) => {
- this.props.selectIndexerSchema({ implementation, implementationName, name });
- this.props.onSelectIndexer();
- };
-
- onSortPress = (sortKey, sortDirection) => {
- this.props.setIndexerSchemaSort({ sortKey, sortDirection });
- };
-
- //
- // Render
-
- render() {
- return (
-
- );
- }
-}
-
-AddIndexerModalContentConnector.propTypes = {
- fetchIndexerSchema: PropTypes.func.isRequired,
- selectIndexerSchema: PropTypes.func.isRequired,
- setIndexerSchemaSort: PropTypes.func.isRequired,
- onModalClose: PropTypes.func.isRequired,
- onSelectIndexer: PropTypes.func.isRequired
-};
-
-export default connect(createMapStateToProps, mapDispatchToProps)(AddIndexerModalContentConnector);
diff --git a/frontend/src/Indexer/Add/SelectIndexerRow.tsx b/frontend/src/Indexer/Add/SelectIndexerRow.tsx
index ab6850573..157050e41 100644
--- a/frontend/src/Indexer/Add/SelectIndexerRow.tsx
+++ b/frontend/src/Indexer/Add/SelectIndexerRow.tsx
@@ -2,18 +2,19 @@ import React, { useCallback } from 'react';
import Icon from 'Components/Icon';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRowButton from 'Components/Table/TableRowButton';
+import DownloadProtocol from 'DownloadClient/DownloadProtocol';
import { icons } from 'Helpers/Props';
import CapabilitiesLabel from 'Indexer/Index/Table/CapabilitiesLabel';
+import PrivacyLabel from 'Indexer/Index/Table/PrivacyLabel';
import ProtocolLabel from 'Indexer/Index/Table/ProtocolLabel';
-import { IndexerCapabilities } from 'Indexer/Indexer';
-import firstCharToUpper from 'Utilities/String/firstCharToUpper';
+import { IndexerCapabilities, IndexerPrivacy } from 'Indexer/Indexer';
import translate from 'Utilities/String/translate';
import styles from './SelectIndexerRow.css';
interface SelectIndexerRowProps {
name: string;
- protocol: string;
- privacy: string;
+ protocol: DownloadProtocol;
+ privacy: IndexerPrivacy;
language: string;
description: string;
capabilities: IndexerCapabilities;
@@ -63,7 +64,9 @@ function SelectIndexerRow(props: SelectIndexerRowProps) {
{description}
- {translate(firstCharToUpper(privacy))}
+
+
+
diff --git a/frontend/src/Indexer/Index/IndexerIndex.tsx b/frontend/src/Indexer/Index/IndexerIndex.tsx
index 3407aa05c..e20e269f8 100644
--- a/frontend/src/Indexer/Index/IndexerIndex.tsx
+++ b/frontend/src/Indexer/Index/IndexerIndex.tsx
@@ -1,4 +1,10 @@
-import React, { useCallback, useMemo, useRef, useState } from 'react';
+import React, {
+ useCallback,
+ useEffect,
+ useMemo,
+ useRef,
+ useState,
+} from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { SelectProvider } from 'App/SelectContext';
import ClientSideCollectionAppState from 'App/State/ClientSideCollectionAppState';
@@ -22,12 +28,17 @@ import AddIndexerModal from 'Indexer/Add/AddIndexerModal';
import EditIndexerModalConnector from 'Indexer/Edit/EditIndexerModalConnector';
import NoIndexer from 'Indexer/NoIndexer';
import { executeCommand } from 'Store/Actions/commandActions';
-import { cloneIndexer, testAllIndexers } from 'Store/Actions/indexerActions';
+import {
+ cloneIndexer,
+ fetchIndexers,
+ testAllIndexers,
+} from 'Store/Actions/indexerActions';
import {
setIndexerFilter,
setIndexerSort,
setIndexerTableOption,
} from 'Store/Actions/indexerIndexActions';
+import { fetchIndexerStatus } from 'Store/Actions/indexerStatusActions';
import scrollPositions from 'Store/scrollPositions';
import createCommandExecutingSelector from 'Store/Selectors/createCommandExecutingSelector';
import createDimensionsSelector from 'Store/Selectors/createDimensionsSelector';
@@ -82,6 +93,11 @@ const IndexerIndex = withScrollPosition((props: IndexerIndexProps) => {
);
const [isSelectMode, setIsSelectMode] = useState(false);
+ useEffect(() => {
+ dispatch(fetchIndexers());
+ dispatch(fetchIndexerStatus());
+ }, [dispatch]);
+
const onAddIndexerPress = useCallback(() => {
setIsAddIndexerModalOpen(true);
}, [setIsAddIndexerModalOpen]);
diff --git a/frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.tsx b/frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.tsx
index 2ffbfebfe..9d42aa389 100644
--- a/frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.tsx
+++ b/frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.tsx
@@ -19,6 +19,7 @@ interface SavePayload {
seedRatio?: number;
seedTime?: number;
packSeedTime?: number;
+ preferMagnetUrl?: boolean;
}
interface EditIndexerModalContentProps {
@@ -65,6 +66,9 @@ function EditIndexerModalContent(props: EditIndexerModalContentProps) {
const [packSeedTime, setPackSeedTime] = useState(
null
);
+ const [preferMagnetUrl, setPreferMagnetUrl] = useState<
+ null | string | boolean
+ >(null);
const save = useCallback(() => {
let hasChanges = false;
@@ -105,6 +109,11 @@ function EditIndexerModalContent(props: EditIndexerModalContentProps) {
payload.packSeedTime = packSeedTime as number;
}
+ if (preferMagnetUrl !== null) {
+ hasChanges = true;
+ payload.preferMagnetUrl = preferMagnetUrl === 'true';
+ }
+
if (hasChanges) {
onSavePress(payload);
}
@@ -118,6 +127,7 @@ function EditIndexerModalContent(props: EditIndexerModalContentProps) {
seedRatio,
seedTime,
packSeedTime,
+ preferMagnetUrl,
onSavePress,
onModalClose,
]);
@@ -146,6 +156,9 @@ function EditIndexerModalContent(props: EditIndexerModalContentProps) {
case 'packSeedTime':
setPackSeedTime(value);
break;
+ case 'preferMagnetUrl':
+ setPreferMagnetUrl(value);
+ break;
default:
console.warn(`EditIndexersModalContent Unknown Input: '${name}'`);
}
@@ -254,6 +267,18 @@ function EditIndexerModalContent(props: EditIndexerModalContentProps) {
onChange={onInputChange}
/>
+
+
+ {translate('PreferMagnetUrl')}
+
+
+
diff --git a/frontend/src/Indexer/Index/Table/CapabilitiesLabel.tsx b/frontend/src/Indexer/Index/Table/CapabilitiesLabel.tsx
index c832806ed..8e30532cc 100644
--- a/frontend/src/Indexer/Index/Table/CapabilitiesLabel.tsx
+++ b/frontend/src/Indexer/Index/Table/CapabilitiesLabel.tsx
@@ -2,6 +2,7 @@ import { uniqBy } from 'lodash';
import React from 'react';
import Label from 'Components/Label';
import { IndexerCapabilities } from 'Indexer/Indexer';
+import translate from 'Utilities/String/translate';
interface CapabilitiesLabelProps {
capabilities: IndexerCapabilities;
@@ -38,7 +39,7 @@ function CapabilitiesLabel(props: CapabilitiesLabelProps) {
);
})}
- {filteredList.length === 0 ? : null}
+ {filteredList.length === 0 ? : null}
);
}
diff --git a/frontend/src/Indexer/Index/Table/IndexerIndexRow.css b/frontend/src/Indexer/Index/Table/IndexerIndexRow.css
index a09d0218e..a20efded3 100644
--- a/frontend/src/Indexer/Index/Table/IndexerIndexRow.css
+++ b/frontend/src/Indexer/Index/Table/IndexerIndexRow.css
@@ -29,7 +29,8 @@
.minimumSeeders,
.seedRatio,
.seedTime,
-.packSeedTime {
+.packSeedTime,
+.preferMagnetUrl {
composes: cell;
flex: 0 0 90px;
diff --git a/frontend/src/Indexer/Index/Table/IndexerIndexRow.css.d.ts b/frontend/src/Indexer/Index/Table/IndexerIndexRow.css.d.ts
index 5feb0c35d..42821bd74 100644
--- a/frontend/src/Indexer/Index/Table/IndexerIndexRow.css.d.ts
+++ b/frontend/src/Indexer/Index/Table/IndexerIndexRow.css.d.ts
@@ -11,6 +11,7 @@ interface CssExports {
'id': string;
'minimumSeeders': string;
'packSeedTime': string;
+ 'preferMagnetUrl': string;
'priority': string;
'privacy': string;
'protocol': string;
diff --git a/frontend/src/Indexer/Index/Table/IndexerIndexRow.tsx b/frontend/src/Indexer/Index/Table/IndexerIndexRow.tsx
index 9e83e9b8d..e4c3cd32e 100644
--- a/frontend/src/Indexer/Index/Table/IndexerIndexRow.tsx
+++ b/frontend/src/Indexer/Index/Table/IndexerIndexRow.tsx
@@ -1,7 +1,7 @@
import React, { useCallback, useState } from 'react';
import { useSelector } from 'react-redux';
import { useSelect } from 'App/SelectContext';
-import Label from 'Components/Label';
+import CheckInput from 'Components/Form/CheckInput';
import IconButton from 'Components/Link/IconButton';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import VirtualTableRowCell from 'Components/Table/Cells/VirtualTableRowCell';
@@ -15,10 +15,10 @@ import createIndexerIndexItemSelector from 'Indexer/Index/createIndexerIndexItem
import Indexer from 'Indexer/Indexer';
import IndexerTitleLink from 'Indexer/IndexerTitleLink';
import { SelectStateInputProps } from 'typings/props';
-import firstCharToUpper from 'Utilities/String/firstCharToUpper';
import translate from 'Utilities/String/translate';
import CapabilitiesLabel from './CapabilitiesLabel';
import IndexerStatusCell from './IndexerStatusCell';
+import PrivacyLabel from './PrivacyLabel';
import ProtocolLabel from './ProtocolLabel';
import styles from './IndexerIndexRow.css';
@@ -75,6 +75,10 @@ function IndexerIndexRow(props: IndexerIndexRowProps) {
fields.find((field) => field.name === 'torrentBaseSettings.packSeedTime')
?.value ?? undefined;
+ const preferMagnetUrl =
+ fields.find((field) => field.name === 'torrentBaseSettings.preferMagnetUrl')
+ ?.value ?? undefined;
+
const rssUrl = `${window.location.origin}${
window.Prowlarr.urlBase
}/${id}/api?apikey=${encodeURIComponent(
@@ -103,6 +107,10 @@ function IndexerIndexRow(props: IndexerIndexRowProps) {
setIsDeleteIndexerModalOpen(false);
}, [setIsDeleteIndexerModalOpen]);
+ const checkInputCallback = useCallback(() => {
+ // Mock handler to satisfy `onChange` being required for `CheckInput`.
+ }, []);
+
const onSelectedChange = useCallback(
({ id, value, shiftKey }: SelectStateInputProps) => {
selectDispatch({
@@ -175,7 +183,7 @@ function IndexerIndexRow(props: IndexerIndexRowProps) {
if (name === 'privacy') {
return (
-
+
);
}
@@ -278,6 +286,21 @@ function IndexerIndexRow(props: IndexerIndexRowProps) {
);
}
+ if (name === 'preferMagnetUrl') {
+ return (
+
+ {preferMagnetUrl === undefined ? null : (
+
+ )}
+
+ );
+ }
+
if (name === 'actions') {
return (
columns
);
-const Row: React.FC> = ({
- index,
- style,
- data,
-}) => {
+function Row({ index, style, data }: ListChildComponentProps) {
const { items, sortKey, columns, isSelectMode, onCloneIndexerPress } = data;
if (index >= items.length) {
@@ -77,7 +73,7 @@ const Row: React.FC> = ({
/>
JetBrains](http://www.jetbrains.com/) for providing us with free licenses to their great tools.
+Thank you to [
](http://www.jetbrains.com/) for providing us with free licenses to their great tools.
-- [
ReSharper](http://www.jetbrains.com/resharper/)
-- [
WebStorm](http://www.jetbrains.com/webstorm/)
-- [
Rider](http://www.jetbrains.com/rider/)
-- [
dotTrace](http://www.jetbrains.com/dottrace/)
+* [
ReSharper](http://www.jetbrains.com/resharper/)
+* [
WebStorm](http://www.jetbrains.com/webstorm/)
+* [
Rider](http://www.jetbrains.com/rider/)
+* [
dotTrace](http://www.jetbrains.com/dottrace/)
### License
- [GNU GPL v3](http://www.gnu.org/licenses/gpl.html)
-- Copyright 2010-2022
+- Copyright 2010-2024
Icon Credit - [Box vector created by freepik - www.freepik.com](https://www.freepik.com/vectors/box)
diff --git a/azure-pipelines.yml b/azure-pipelines.yml
index 916bac55f..dc667e803 100644
--- a/azure-pipelines.yml
+++ b/azure-pipelines.yml
@@ -9,18 +9,18 @@ variables:
testsFolder: './_tests'
yarnCacheFolder: $(Pipeline.Workspace)/.yarn
nugetCacheFolder: $(Pipeline.Workspace)/.nuget/packages
- majorVersion: '1.17.2'
+ majorVersion: '1.35.0'
minorVersion: $[counter('minorVersion', 1)]
prowlarrVersion: '$(majorVersion).$(minorVersion)'
buildName: '$(Build.SourceBranchName).$(prowlarrVersion)'
sentryOrg: 'servarr'
sentryUrl: 'https://sentry.servarr.com'
- dotnetVersion: '6.0.421'
+ dotnetVersion: '6.0.427'
nodeVersion: '20.X'
innoVersion: '6.2.2'
windowsImage: 'windows-2022'
- linuxImage: 'ubuntu-20.04'
- macImage: 'macOS-11'
+ linuxImage: 'ubuntu-22.04'
+ macImage: 'macOS-13'
trigger:
branches:
@@ -1169,12 +1169,12 @@ stages:
submodules: true
- powershell: Set-Service SCardSvr -StartupType Manual
displayName: Enable Windows Test Service
- - task: SonarCloudPrepare@1
+ - task: SonarCloudPrepare@3
condition: eq(variables['System.PullRequest.IsFork'], 'False')
inputs:
SonarCloud: 'SonarCloud'
organization: 'prowlarr'
- scannerMode: 'MSBuild'
+ scannerMode: 'dotnet'
projectKey: 'Prowlarr_Prowlarr'
projectName: 'Prowlarr'
projectVersion: '$(prowlarrVersion)'
@@ -1187,21 +1187,16 @@ stages:
./build.sh --backend -f net6.0 -r win-x64
TEST_DIR=_tests/net6.0/win-x64/publish/ ./test.sh Windows Unit Coverage
displayName: Coverage Unit Tests
- - task: SonarCloudAnalyze@1
+ - task: SonarCloudAnalyze@3
condition: eq(variables['System.PullRequest.IsFork'], 'False')
displayName: Publish SonarCloud Results
- - task: reportgenerator@4
+ - task: reportgenerator@5.3.11
displayName: Generate Coverage Report
inputs:
reports: '$(Build.SourcesDirectory)/CoverageResults/**/coverage.opencover.xml'
targetdir: '$(Build.SourcesDirectory)/CoverageResults/combined'
reporttypes: 'HtmlInline_AzurePipelines;Cobertura;Badges'
- - task: PublishCodeCoverageResults@1
- displayName: Publish Coverage Report
- inputs:
- codeCoverageTool: 'cobertura'
- summaryFileLocation: './CoverageResults/combined/Cobertura.xml'
- reportDirectory: './CoverageResults/combined/'
+ publishCodeCoverageResults: true
- stage: Report_Out
dependsOn:
diff --git a/docs.sh b/docs.sh
old mode 100644
new mode 100755
index ae11bc83f..38b0e0fbc
--- a/docs.sh
+++ b/docs.sh
@@ -1,13 +1,18 @@
+#!/bin/bash
+set -e
+
+FRAMEWORK="net6.0"
PLATFORM=$1
+ARCHITECTURE="${2:-x64}"
if [ "$PLATFORM" = "Windows" ]; then
- RUNTIME="win-x64"
+ RUNTIME="win-$ARCHITECTURE"
elif [ "$PLATFORM" = "Linux" ]; then
- RUNTIME="linux-x64"
+ RUNTIME="linux-$ARCHITECTURE"
elif [ "$PLATFORM" = "Mac" ]; then
- RUNTIME="osx-x64"
+ RUNTIME="osx-$ARCHITECTURE"
else
- echo "Platform must be provided as first arguement: Windows, Linux or Mac"
+ echo "Platform must be provided as first argument: Windows, Linux or Mac"
exit 1
fi
@@ -21,17 +26,23 @@ slnFile=src/Prowlarr.sln
platform=Posix
+ if [ "$PLATFORM" = "Windows" ]; then
+ application=Prowlarr.Console.dll
+else
+ application=Prowlarr.dll
+fi
+
dotnet clean $slnFile -c Debug
dotnet clean $slnFile -c Release
dotnet msbuild -restore $slnFile -p:Configuration=Debug -p:Platform=$platform -p:RuntimeIdentifiers=$RUNTIME -t:PublishAllRids
dotnet new tool-manifest
-dotnet tool install --version 6.5.0 Swashbuckle.AspNetCore.Cli
+dotnet tool install --version 7.3.2 Swashbuckle.AspNetCore.Cli
-dotnet tool run swagger tofile --output ./src/Prowlarr.Api.V1/openapi.json "$outputFolder/net6.0/$RUNTIME/prowlarr.console.dll" v1 &
+dotnet tool run swagger tofile --output ./src/Prowlarr.Api.V1/openapi.json "$outputFolder/$FRAMEWORK/$RUNTIME/$application" v1 &
-sleep 30
+sleep 45
kill %1
diff --git a/frontend/.eslintrc.js b/frontend/.eslintrc.js
index 8d844cb8b..56eaaeaab 100644
--- a/frontend/.eslintrc.js
+++ b/frontend/.eslintrc.js
@@ -357,11 +357,16 @@ module.exports = {
],
rules: Object.assign(typescriptEslintRecommended.rules, {
- 'no-shadow': 'off',
- // These should be enabled after cleaning things up
- '@typescript-eslint/no-unused-vars': 'warn',
+ '@typescript-eslint/no-unused-vars': [
+ 'error',
+ {
+ args: 'after-used',
+ argsIgnorePattern: '^_',
+ ignoreRestSiblings: true
+ }
+ ],
'@typescript-eslint/explicit-function-return-type': 'off',
- 'react/prop-types': 'off',
+ 'no-shadow': 'off',
'prettier/prettier': 'error',
'simple-import-sort/imports': [
'error',
@@ -374,7 +379,41 @@ module.exports = {
['^@?\\w', `^(${dirs})(/.*|$)`, '^\\.', '^\\..*css$']
]
}
- ]
+ ],
+
+ // React Hooks
+ 'react-hooks/rules-of-hooks': 'error',
+ 'react-hooks/exhaustive-deps': 'error',
+
+ // React
+ 'react/function-component-definition': 'error',
+ 'react/hook-use-state': 'error',
+ 'react/jsx-boolean-value': ['error', 'always'],
+ 'react/jsx-curly-brace-presence': [
+ 'error',
+ { props: 'never', children: 'never' }
+ ],
+ 'react/jsx-fragments': 'error',
+ 'react/jsx-handler-names': [
+ 'error',
+ {
+ eventHandlerPrefix: 'on',
+ eventHandlerPropPrefix: 'on'
+ }
+ ],
+ 'react/jsx-no-bind': ['error', { ignoreRefs: true }],
+ 'react/jsx-no-useless-fragment': ['error', { allowExpressions: true }],
+ 'react/jsx-pascal-case': ['error', { allowAllCaps: true }],
+ 'react/jsx-sort-props': [
+ 'error',
+ {
+ callbacksLast: true,
+ noSortAlphabetically: true,
+ reservedFirst: true
+ }
+ ],
+ 'react/prop-types': 'off',
+ 'react/self-closing-comp': 'error'
})
},
{
diff --git a/frontend/build/webpack.config.js b/frontend/build/webpack.config.js
index 5336d6583..ceacc4f04 100644
--- a/frontend/build/webpack.config.js
+++ b/frontend/build/webpack.config.js
@@ -25,6 +25,7 @@ module.exports = (env) => {
const config = {
mode: isProduction ? 'production' : 'development',
devtool: isProduction ? 'source-map' : 'eval-source-map',
+ target: 'web',
stats: {
children: false
@@ -65,7 +66,7 @@ module.exports = (env) => {
output: {
path: distFolder,
publicPath: '/',
- filename: '[name]-[contenthash].js',
+ filename: isProduction ? '[name]-[contenthash].js' : '[name].js',
sourceMapFilename: '[file].map'
},
@@ -90,7 +91,7 @@ module.exports = (env) => {
new MiniCssExtractPlugin({
filename: 'Content/styles.css',
- chunkFilename: 'Content/[id]-[chunkhash].css'
+ chunkFilename: isProduction ? 'Content/[id]-[chunkhash].css' : 'Content/[id].css'
}),
new HtmlWebpackPlugin({
@@ -169,7 +170,7 @@ module.exports = (env) => {
loose: true,
debug: false,
useBuiltIns: 'entry',
- corejs: 3
+ corejs: '3.39'
}
]
]
@@ -190,7 +191,7 @@ module.exports = (env) => {
options: {
importLoaders: 1,
modules: {
- localIdentName: '[name]/[local]/[hash:base64:5]'
+ localIdentName: isProduction ? '[name]/[local]/[hash:base64:5]' : '[name]/[local]'
}
}
},
diff --git a/frontend/postcss.config.js b/frontend/postcss.config.js
index f657adf28..89db00f8c 100644
--- a/frontend/postcss.config.js
+++ b/frontend/postcss.config.js
@@ -16,6 +16,7 @@ const mixinsFiles = [
module.exports = {
plugins: [
+ 'autoprefixer',
['postcss-mixins', {
mixinsFiles
}],
diff --git a/frontend/src/App/App.js b/frontend/src/App/App.tsx
similarity index 68%
rename from frontend/src/App/App.js
rename to frontend/src/App/App.tsx
index eea9b7d38..dba90a697 100644
--- a/frontend/src/App/App.js
+++ b/frontend/src/App/App.tsx
@@ -1,20 +1,25 @@
-import { ConnectedRouter } from 'connected-react-router';
-import PropTypes from 'prop-types';
+import { ConnectedRouter, ConnectedRouterProps } from 'connected-react-router';
import React from 'react';
import DocumentTitle from 'react-document-title';
import { Provider } from 'react-redux';
+import { Store } from 'redux';
import PageConnector from 'Components/Page/PageConnector';
import ApplyTheme from './ApplyTheme';
import AppRoutes from './AppRoutes';
-function App({ store, history }) {
+interface AppProps {
+ store: Store;
+ history: ConnectedRouterProps['history'];
+}
+
+function App({ store, history }: AppProps) {
return (