Convert System to TypeScript

(cherry picked from commit 72db8099e0f4abc3176e397f8dda3b2b69026daf)

Closes #10234
pull/10406/head
Mark McDowall 4 months ago committed by Bogdan
parent c332c38890
commit 6b4c0bd24c

@ -21,7 +21,9 @@ import UiSettings from 'typings/Settings/UiSettings';
export interface DownloadClientAppState
extends AppSectionState<DownloadClient>,
AppSectionDeleteState,
AppSectionSaveState {}
AppSectionSaveState {
isTestingAll: boolean;
}
export interface GeneralAppState
extends AppSectionItemState<General>,
@ -35,7 +37,9 @@ export interface ImportListAppState
export interface IndexerAppState
extends AppSectionState<Indexer>,
AppSectionDeleteState,
AppSectionSaveState {}
AppSectionSaveState {
isTestingAll: boolean;
}
export interface NotificationAppState
extends AppSectionState<Notification>,

@ -1,10 +1,19 @@
import DiskSpace from 'typings/DiskSpace';
import Health from 'typings/Health';
import SystemStatus from 'typings/SystemStatus';
import { AppSectionItemState } from './AppSectionState';
import Task from 'typings/Task';
import AppSectionState, { AppSectionItemState } from './AppSectionState';
export type DiskSpaceAppState = AppSectionState<DiskSpace>;
export type HealthAppState = AppSectionState<Health>;
export type SystemStatusAppState = AppSectionItemState<SystemStatus>;
export type TaskAppState = AppSectionState<Task>;
interface SystemAppState {
diskSpace: DiskSpaceAppState;
health: HealthAppState;
status: SystemStatusAppState;
tasks: TaskAppState;
}
export default SystemAppState;

@ -9,7 +9,7 @@ import Scroller from 'Components/Scroller/Scroller';
import { icons } from 'Helpers/Props';
import locationShape from 'Helpers/Props/Shapes/locationShape';
import dimensions from 'Styles/Variables/dimensions';
import HealthStatusConnector from 'System/Status/Health/HealthStatusConnector';
import HealthStatus from 'System/Status/Health/HealthStatus';
import translate from 'Utilities/String/translate';
import MessagesConnector from './Messages/MessagesConnector';
import PageSidebarItem from './PageSidebarItem';
@ -151,7 +151,7 @@ const links = [
{
title: () => translate('Status'),
to: '/system/status',
statusComponent: HealthStatusConnector
statusComponent: HealthStatus
},
{
title: () => translate('Tasks'),

@ -1,135 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import DescriptionList from 'Components/DescriptionList/DescriptionList';
import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
import FieldSet from 'Components/FieldSet';
import InlineMarkdown from 'Components/Markdown/InlineMarkdown';
import titleCase from 'Utilities/String/titleCase';
import translate from 'Utilities/String/translate';
import StartTime from './StartTime';
import styles from './About.css';
class About extends Component {
//
// Render
render() {
const {
version,
packageVersion,
packageAuthor,
isNetCore,
isDocker,
runtimeVersion,
databaseVersion,
databaseType,
migrationVersion,
appData,
startupPath,
mode,
startTime,
timeFormat,
longDateFormat
} = this.props;
return (
<FieldSet legend={translate('About')}>
<DescriptionList className={styles.descriptionList}>
<DescriptionListItem
title={translate('Version')}
data={version}
/>
{
packageVersion &&
<DescriptionListItem
title={translate('PackageVersion')}
data={(packageAuthor ?
<InlineMarkdown data={translate('PackageVersionInfo', {
packageVersion,
packageAuthor
})}
/> :
packageVersion
)}
/>
}
{
isNetCore &&
<DescriptionListItem
title={translate('NetCore')}
data={`Yes (${runtimeVersion})`}
/>
}
{
isDocker &&
<DescriptionListItem
title={translate('Docker')}
data={'Yes'}
/>
}
<DescriptionListItem
title={translate('Database')}
data={`${titleCase(databaseType)} ${databaseVersion}`}
/>
<DescriptionListItem
title={translate('DatabaseMigration')}
data={migrationVersion}
/>
<DescriptionListItem
title={translate('AppDataDirectory')}
data={appData}
/>
<DescriptionListItem
title={translate('StartupDirectory')}
data={startupPath}
/>
<DescriptionListItem
title={translate('Mode')}
data={titleCase(mode)}
/>
<DescriptionListItem
title={translate('Uptime')}
data={
<StartTime
startTime={startTime}
timeFormat={timeFormat}
longDateFormat={longDateFormat}
/>
}
/>
</DescriptionList>
</FieldSet>
);
}
}
About.propTypes = {
version: PropTypes.string.isRequired,
packageVersion: PropTypes.string,
packageAuthor: PropTypes.string,
isNetCore: PropTypes.bool.isRequired,
runtimeVersion: PropTypes.string.isRequired,
isDocker: PropTypes.bool.isRequired,
databaseType: PropTypes.string.isRequired,
databaseVersion: PropTypes.string.isRequired,
migrationVersion: PropTypes.number.isRequired,
appData: PropTypes.string.isRequired,
startupPath: PropTypes.string.isRequired,
mode: PropTypes.string.isRequired,
startTime: PropTypes.string.isRequired,
timeFormat: PropTypes.string.isRequired,
longDateFormat: PropTypes.string.isRequired
};
export default About;

@ -0,0 +1,103 @@
import React, { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import AppState from 'App/State/AppState';
import DescriptionList from 'Components/DescriptionList/DescriptionList';
import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
import FieldSet from 'Components/FieldSet';
import InlineMarkdown from 'Components/Markdown/InlineMarkdown';
import { fetchStatus } from 'Store/Actions/systemActions';
import titleCase from 'Utilities/String/titleCase';
import translate from 'Utilities/String/translate';
import StartTime from './StartTime';
import styles from './About.css';
function About() {
const dispatch = useDispatch();
const { item } = useSelector((state: AppState) => state.system.status);
const {
version,
packageVersion,
packageAuthor,
isNetCore,
isDocker,
runtimeVersion,
databaseVersion,
databaseType,
migrationVersion,
appData,
startupPath,
mode,
startTime,
} = item;
useEffect(() => {
dispatch(fetchStatus());
}, [dispatch]);
return (
<FieldSet legend={translate('About')}>
<DescriptionList className={styles.descriptionList}>
<DescriptionListItem title={translate('Version')} data={version} />
{packageVersion && (
<DescriptionListItem
title={translate('PackageVersion')}
data={
packageAuthor ? (
<InlineMarkdown
data={translate('PackageVersionInfo', {
packageVersion,
packageAuthor,
})}
/>
) : (
packageVersion
)
}
/>
)}
{isNetCore ? (
<DescriptionListItem
title={translate('DotNetVersion')}
data={`Yes (${runtimeVersion})`}
/>
) : null}
{isDocker ? (
<DescriptionListItem title={translate('Docker')} data="Yes" />
) : null}
<DescriptionListItem
title={translate('Database')}
data={`${titleCase(databaseType)} ${databaseVersion}`}
/>
<DescriptionListItem
title={translate('DatabaseMigration')}
data={migrationVersion}
/>
<DescriptionListItem
title={translate('AppDataDirectory')}
data={appData}
/>
<DescriptionListItem
title={translate('StartupDirectory')}
data={startupPath}
/>
<DescriptionListItem title={translate('Mode')} data={titleCase(mode)} />
<DescriptionListItem
title={translate('Uptime')}
data={<StartTime startTime={startTime} />}
/>
</DescriptionList>
</FieldSet>
);
}
export default About;

@ -1,52 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import { fetchStatus } from 'Store/Actions/systemActions';
import createUISettingsSelector from 'Store/Selectors/createUISettingsSelector';
import About from './About';
function createMapStateToProps() {
return createSelector(
(state) => state.system.status,
createUISettingsSelector(),
(status, uiSettings) => {
return {
...status.item,
timeFormat: uiSettings.timeFormat,
longDateFormat: uiSettings.longDateFormat
};
}
);
}
const mapDispatchToProps = {
fetchStatus
};
class AboutConnector extends Component {
//
// Lifecycle
componentDidMount() {
this.props.fetchStatus();
}
//
// Render
render() {
return (
<About
{...this.props}
/>
);
}
}
AboutConnector.propTypes = {
fetchStatus: PropTypes.func.isRequired
};
export default connect(createMapStateToProps, mapDispatchToProps)(AboutConnector);

@ -1,93 +0,0 @@
import moment from 'moment';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import formatDateTime from 'Utilities/Date/formatDateTime';
import formatTimeSpan from 'Utilities/Date/formatTimeSpan';
function getUptime(startTime) {
return formatTimeSpan(moment().diff(startTime));
}
class StartTime extends Component {
//
// Lifecycle
constructor(props, context) {
super(props, context);
const {
startTime,
timeFormat,
longDateFormat
} = props;
this._timeoutId = null;
this.state = {
uptime: getUptime(startTime),
startTime: formatDateTime(startTime, longDateFormat, timeFormat, { includeSeconds: true })
};
}
componentDidMount() {
this._timeoutId = setTimeout(this.onTimeout, 1000);
}
componentDidUpdate(prevProps) {
const {
startTime,
timeFormat,
longDateFormat
} = this.props;
if (
startTime !== prevProps.startTime ||
timeFormat !== prevProps.timeFormat ||
longDateFormat !== prevProps.longDateFormat
) {
this.setState({
uptime: getUptime(startTime),
startTime: formatDateTime(startTime, longDateFormat, timeFormat, { includeSeconds: true })
});
}
}
componentWillUnmount() {
if (this._timeoutId) {
this._timeoutId = clearTimeout(this._timeoutId);
}
}
//
// Listeners
onTimeout = () => {
this.setState({ uptime: getUptime(this.props.startTime) });
this._timeoutId = setTimeout(this.onTimeout, 1000);
};
//
// Render
render() {
const {
uptime,
startTime
} = this.state;
return (
<span title={startTime}>
{uptime}
</span>
);
}
}
StartTime.propTypes = {
startTime: PropTypes.string.isRequired,
timeFormat: PropTypes.string.isRequired,
longDateFormat: PropTypes.string.isRequired
};
export default StartTime;

@ -0,0 +1,44 @@
import moment from 'moment';
import React, { useEffect, useMemo, useState } from 'react';
import { useSelector } from 'react-redux';
import createUISettingsSelector from 'Store/Selectors/createUISettingsSelector';
import formatDateTime from 'Utilities/Date/formatDateTime';
import formatTimeSpan from 'Utilities/Date/formatTimeSpan';
interface StartTimeProps {
startTime: string;
}
function StartTime(props: StartTimeProps) {
const { startTime } = props;
const { timeFormat, longDateFormat } = useSelector(
createUISettingsSelector()
);
const [time, setTime] = useState(Date.now());
const { formattedStartTime, uptime } = useMemo(() => {
return {
uptime: formatTimeSpan(moment(time).diff(startTime)),
formattedStartTime: formatDateTime(
startTime,
longDateFormat,
timeFormat,
{
includeSeconds: true,
}
),
};
}, [startTime, time, longDateFormat, timeFormat]);
useEffect(() => {
const interval = setInterval(() => setTime(Date.now()), 1000);
return () => {
clearInterval(interval);
};
}, [setTime]);
return <span title={formattedStartTime}>{uptime}</span>;
}
export default StartTime;

@ -1,125 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import FieldSet from 'Components/FieldSet';
import LoadingIndicator from 'Components/Loading/LoadingIndicator';
import ProgressBar from 'Components/ProgressBar';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import Table from 'Components/Table/Table';
import TableBody from 'Components/Table/TableBody';
import TableRow from 'Components/Table/TableRow';
import { kinds, sizes } from 'Helpers/Props';
import formatBytes from 'Utilities/Number/formatBytes';
import translate from 'Utilities/String/translate';
import styles from './DiskSpace.css';
const columns = [
{
name: 'path',
label: () => translate('Location'),
isVisible: true
},
{
name: 'freeSpace',
label: () => translate('FreeSpace'),
isVisible: true
},
{
name: 'totalSpace',
label: () => translate('TotalSpace'),
isVisible: true
},
{
name: 'progress',
isVisible: true
}
];
class DiskSpace extends Component {
//
// Render
render() {
const {
isFetching,
items,
isSmallScreen
} = this.props;
return (
<FieldSet legend={translate('DiskSpace')}>
{
isFetching &&
<LoadingIndicator />
}
{
!isFetching &&
<Table
columns={columns}
>
<TableBody>
{
items.map((item) => {
const {
freeSpace,
totalSpace
} = item;
const diskUsage = Math.round(100 - freeSpace / totalSpace * 100);
let diskUsageKind = kinds.PRIMARY;
if (diskUsage > 90) {
diskUsageKind = kinds.DANGER;
} else if (diskUsage > 80) {
diskUsageKind = kinds.WARNING;
}
return (
<TableRow key={item.path}>
<TableRowCell>
{item.path}
{
item.label &&
` (${item.label})`
}
</TableRowCell>
<TableRowCell className={styles.space}>
{formatBytes(freeSpace)}
</TableRowCell>
<TableRowCell className={styles.space}>
{formatBytes(totalSpace)}
</TableRowCell>
<TableRowCell className={styles.space}>
<ProgressBar
progress={diskUsage}
kind={diskUsageKind}
size={sizes.MEDIUM}
showText={((!isSmallScreen && diskUsage >= 12) || (isSmallScreen && diskUsage >= 45))}
text={`${diskUsage}%`}
/>
</TableRowCell>
</TableRow>
);
})
}
</TableBody>
</Table>
}
</FieldSet>
);
}
}
DiskSpace.propTypes = {
isFetching: PropTypes.bool.isRequired,
items: PropTypes.array.isRequired,
isSmallScreen: PropTypes.bool.isRequired
};
export default DiskSpace;

@ -0,0 +1,111 @@
import React, { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { createSelector } from 'reselect';
import AppState from 'App/State/AppState';
import FieldSet from 'Components/FieldSet';
import LoadingIndicator from 'Components/Loading/LoadingIndicator';
import ProgressBar from 'Components/ProgressBar';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import Column from 'Components/Table/Column';
import Table from 'Components/Table/Table';
import TableBody from 'Components/Table/TableBody';
import TableRow from 'Components/Table/TableRow';
import { kinds, sizes } from 'Helpers/Props';
import { fetchDiskSpace } from 'Store/Actions/systemActions';
import formatBytes from 'Utilities/Number/formatBytes';
import translate from 'Utilities/String/translate';
import styles from './DiskSpace.css';
const columns: Column[] = [
{
name: 'path',
label: () => translate('Location'),
isVisible: true,
},
{
name: 'freeSpace',
label: () => translate('FreeSpace'),
isVisible: true,
},
{
name: 'totalSpace',
label: () => translate('TotalSpace'),
isVisible: true,
},
{
name: 'progress',
label: '',
isVisible: true,
},
];
function createDiskSpaceSelector() {
return createSelector(
(state: AppState) => state.system.diskSpace,
(diskSpace) => {
return diskSpace;
}
);
}
function DiskSpace() {
const dispatch = useDispatch();
const { isFetching, items } = useSelector(createDiskSpaceSelector());
useEffect(() => {
dispatch(fetchDiskSpace());
}, [dispatch]);
return (
<FieldSet legend={translate('DiskSpace')}>
{isFetching ? <LoadingIndicator /> : null}
{isFetching ? null : (
<Table columns={columns}>
<TableBody>
{items.map((item) => {
const { freeSpace, totalSpace } = item;
const diskUsage = 100 - (freeSpace / totalSpace) * 100;
let diskUsageKind: (typeof kinds.all)[number] = kinds.PRIMARY;
if (diskUsage > 90) {
diskUsageKind = kinds.DANGER;
} else if (diskUsage > 80) {
diskUsageKind = kinds.WARNING;
}
return (
<TableRow key={item.path}>
<TableRowCell>
{item.path}
{item.label && ` (${item.label})`}
</TableRowCell>
<TableRowCell className={styles.space}>
{formatBytes(freeSpace)}
</TableRowCell>
<TableRowCell className={styles.space}>
{formatBytes(totalSpace)}
</TableRowCell>
<TableRowCell className={styles.space}>
<ProgressBar
progress={diskUsage}
kind={diskUsageKind}
size={sizes.MEDIUM}
/>
</TableRowCell>
</TableRow>
);
})}
</TableBody>
</Table>
)}
</FieldSet>
);
}
export default DiskSpace;

@ -1,57 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import { fetchDiskSpace } from 'Store/Actions/systemActions';
import createDimensionsSelector from 'Store/Selectors/createDimensionsSelector';
import DiskSpace from './DiskSpace';
function createMapStateToProps() {
return createSelector(
(state) => state.system.diskSpace,
createDimensionsSelector(),
(diskSpace, dimensions) => {
const {
isFetching,
items
} = diskSpace;
return {
isFetching,
items,
isSmallScreen: dimensions.isSmallScreen
};
}
);
}
const mapDispatchToProps = {
fetchDiskSpace
};
class DiskSpaceConnector extends Component {
//
// Lifecycle
componentDidMount() {
this.props.fetchDiskSpace();
}
//
// Render
render() {
return (
<DiskSpace
{...this.props}
/>
);
}
}
DiskSpaceConnector.propTypes = {
fetchDiskSpace: PropTypes.func.isRequired
};
export default connect(createMapStateToProps, mapDispatchToProps)(DiskSpaceConnector);

@ -1,242 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import Alert from 'Components/Alert';
import FieldSet from 'Components/FieldSet';
import Icon from 'Components/Icon';
import IconButton from 'Components/Link/IconButton';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import LoadingIndicator from 'Components/Loading/LoadingIndicator';
import InlineMarkdown from 'Components/Markdown/InlineMarkdown';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import Table from 'Components/Table/Table';
import TableBody from 'Components/Table/TableBody';
import TableRow from 'Components/Table/TableRow';
import { icons, kinds } from 'Helpers/Props';
import titleCase from 'Utilities/String/titleCase';
import translate from 'Utilities/String/translate';
import styles from './Health.css';
function getInternalLink(source) {
switch (source) {
case 'IndexerRssCheck':
case 'IndexerSearchCheck':
case 'IndexerStatusCheck':
case 'IndexerJackettAllCheck':
case 'IndexerLongTermStatusCheck':
return (
<IconButton
name={icons.SETTINGS}
title={translate('Settings')}
to="/settings/indexers"
/>
);
case 'DownloadClientCheck':
case 'DownloadClientStatusCheck':
case 'ImportMechanismCheck':
return (
<IconButton
name={icons.SETTINGS}
title={translate('Settings')}
to="/settings/downloadclients"
/>
);
case 'NotificationStatusCheck':
return (
<IconButton
name={icons.SETTINGS}
title={translate('Settings')}
to="/settings/connect"
/>
);
case 'RootFolderCheck':
return (
<IconButton
name={icons.PLAY}
title={translate('MovieEditor')}
to="/"
/>
);
case 'UpdateCheck':
return (
<IconButton
name={icons.UPDATE}
title={translate('Updates')}
to="/system/updates"
/>
);
default:
return;
}
}
function getTestLink(source, props) {
switch (source) {
case 'IndexerStatusCheck':
case 'IndexerLongTermStatusCheck':
return (
<SpinnerIconButton
name={icons.TEST}
title={translate('TestAll')}
isSpinning={props.isTestingAllIndexers}
onPress={props.dispatchTestAllIndexers}
/>
);
case 'DownloadClientCheck':
case 'DownloadClientStatusCheck':
return (
<SpinnerIconButton
name={icons.TEST}
title={translate('TestAll')}
isSpinning={props.isTestingAllDownloadClients}
onPress={props.dispatchTestAllDownloadClients}
/>
);
default:
break;
}
}
const columns = [
{
className: styles.status,
name: 'type',
isVisible: true
},
{
name: 'message',
label: () => translate('Message'),
isVisible: true
},
{
name: 'actions',
label: () => translate('Actions'),
isVisible: true
}
];
class Health extends Component {
//
// Render
render() {
const {
isFetching,
isPopulated,
items
} = this.props;
const healthIssues = !!items.length;
return (
<FieldSet
legend={
<div className={styles.legend}>
{translate('Health')}
{
isFetching && isPopulated &&
<LoadingIndicator
className={styles.loading}
size={20}
/>
}
</div>
}
>
{
isFetching && !isPopulated &&
<LoadingIndicator />
}
{
!healthIssues &&
<div className={styles.healthOk}>
{translate('NoIssuesWithYourConfiguration')}
</div>
}
{
healthIssues &&
<Table
columns={columns}
>
<TableBody>
{
items.map((item) => {
const internalLink = getInternalLink(item.source);
const testLink = getTestLink(item.source, this.props);
let kind = kinds.WARNING;
switch (item.type.toLowerCase()) {
case 'error':
kind = kinds.DANGER;
break;
default:
case 'warning':
kind = kinds.WARNING;
break;
case 'notice':
kind = kinds.INFO;
break;
}
return (
<TableRow key={`health${item.message}`}>
<TableRowCell>
<Icon
name={icons.DANGER}
kind={kind}
title={titleCase(item.type)}
/>
</TableRowCell>
<TableRowCell>{item.message}</TableRowCell>
<TableRowCell className={styles.actions}>
<IconButton
name={icons.WIKI}
to={item.wikiUrl}
title={translate('ReadTheWikiForMoreInformation')}
/>
{
internalLink
}
{
!!testLink &&
testLink
}
</TableRowCell>
</TableRow>
);
})
}
</TableBody>
</Table>
}
{
healthIssues &&
<Alert kind={kinds.INFO}>
<InlineMarkdown data={translate('HealthMessagesInfoBox', { link: '/system/logs/files' })} />
</Alert>
}
</FieldSet>
);
}
}
Health.propTypes = {
isFetching: PropTypes.bool.isRequired,
isPopulated: PropTypes.bool.isRequired,
items: PropTypes.array.isRequired,
isTestingAllDownloadClients: PropTypes.bool.isRequired,
isTestingAllIndexers: PropTypes.bool.isRequired,
dispatchTestAllDownloadClients: PropTypes.func.isRequired,
dispatchTestAllIndexers: PropTypes.func.isRequired
};
export default Health;

@ -0,0 +1,174 @@
import React, { useCallback, useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import AppState from 'App/State/AppState';
import Alert from 'Components/Alert';
import FieldSet from 'Components/FieldSet';
import Icon, { IconProps } from 'Components/Icon';
import IconButton from 'Components/Link/IconButton';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import LoadingIndicator from 'Components/Loading/LoadingIndicator';
import InlineMarkdown from 'Components/Markdown/InlineMarkdown';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import Column from 'Components/Table/Column';
import Table from 'Components/Table/Table';
import TableBody from 'Components/Table/TableBody';
import TableRow from 'Components/Table/TableRow';
import { icons, kinds } from 'Helpers/Props';
import {
testAllDownloadClients,
testAllIndexers,
} from 'Store/Actions/settingsActions';
import { fetchHealth } from 'Store/Actions/systemActions';
import titleCase from 'Utilities/String/titleCase';
import translate from 'Utilities/String/translate';
import createHealthSelector from './createHealthSelector';
import HealthItemLink from './HealthItemLink';
import styles from './Health.css';
const columns: Column[] = [
{
className: styles.status,
name: 'type',
label: '',
isVisible: true,
},
{
name: 'message',
label: () => translate('Message'),
isVisible: true,
},
{
name: 'actions',
label: () => translate('Actions'),
isVisible: true,
},
];
function Health() {
const dispatch = useDispatch();
const { isFetching, isPopulated, items } = useSelector(
createHealthSelector()
);
const isTestingAllDownloadClients = useSelector(
(state: AppState) => state.settings.downloadClients.isTestingAll
);
const isTestingAllIndexers = useSelector(
(state: AppState) => state.settings.indexers.isTestingAll
);
const healthIssues = !!items.length;
const handleTestAllDownloadClientsPress = useCallback(() => {
dispatch(testAllDownloadClients());
}, [dispatch]);
const handleTestAllIndexersPress = useCallback(() => {
dispatch(testAllIndexers());
}, [dispatch]);
useEffect(() => {
dispatch(fetchHealth());
}, [dispatch]);
return (
<FieldSet
legend={
<div className={styles.legend}>
{translate('Health')}
{isFetching && isPopulated ? (
<LoadingIndicator className={styles.loading} size={20} />
) : null}
</div>
}
>
{isFetching && !isPopulated ? <LoadingIndicator /> : null}
{isPopulated && !healthIssues ? (
<div className={styles.healthOk}>
{translate('NoIssuesWithYourConfiguration')}
</div>
) : null}
{healthIssues ? (
<>
<Table columns={columns}>
<TableBody>
{items.map((item) => {
const source = item.source;
let kind: IconProps['kind'] = kinds.WARNING;
switch (item.type.toLowerCase()) {
case 'error':
kind = kinds.DANGER;
break;
default:
case 'warning':
kind = kinds.WARNING;
break;
case 'notice':
kind = kinds.INFO;
break;
}
return (
<TableRow key={`health${item.message}`}>
<TableRowCell>
<Icon
name={icons.DANGER}
kind={kind}
title={titleCase(item.type)}
/>
</TableRowCell>
<TableRowCell>{item.message}</TableRowCell>
<TableRowCell>
<IconButton
name={icons.WIKI}
to={item.wikiUrl}
title={translate('ReadTheWikiForMoreInformation')}
/>
<HealthItemLink source={source} />
{source === 'IndexerStatusCheck' ||
source === 'IndexerLongTermStatusCheck' ? (
<SpinnerIconButton
name={icons.TEST}
title={translate('TestAll')}
isSpinning={isTestingAllIndexers}
onPress={handleTestAllIndexersPress}
/>
) : null}
{source === 'DownloadClientCheck' ||
source === 'DownloadClientStatusCheck' ? (
<SpinnerIconButton
name={icons.TEST}
title={translate('TestAll')}
isSpinning={isTestingAllDownloadClients}
onPress={handleTestAllDownloadClientsPress}
/>
) : null}
</TableRowCell>
</TableRow>
);
})}
</TableBody>
</Table>
<Alert kind={kinds.INFO}>
<InlineMarkdown
data={translate('HealthMessagesInfoBox', {
link: '/system/logs/files',
})}
/>
</Alert>
</>
) : null}
</FieldSet>
);
}
export default Health;

@ -1,69 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import { testAllDownloadClients, testAllIndexers } from 'Store/Actions/settingsActions';
import { fetchHealth } from 'Store/Actions/systemActions';
import createHealthCheckSelector from 'Store/Selectors/createHealthCheckSelector';
import Health from './Health';
function createMapStateToProps() {
return createSelector(
createHealthCheckSelector(),
(state) => state.system.health,
(state) => state.settings.downloadClients.isTestingAll,
(state) => state.settings.indexers.isTestingAll,
(items, health, isTestingAllDownloadClients, isTestingAllIndexers) => {
const {
isFetching,
isPopulated
} = health;
return {
isFetching,
isPopulated,
items,
isTestingAllDownloadClients,
isTestingAllIndexers
};
}
);
}
const mapDispatchToProps = {
dispatchFetchHealth: fetchHealth,
dispatchTestAllDownloadClients: testAllDownloadClients,
dispatchTestAllIndexers: testAllIndexers
};
class HealthConnector extends Component {
//
// Lifecycle
componentDidMount() {
this.props.dispatchFetchHealth();
}
//
// Render
render() {
const {
dispatchFetchHealth,
...otherProps
} = this.props;
return (
<Health
{...otherProps}
/>
);
}
}
HealthConnector.propTypes = {
dispatchFetchHealth: PropTypes.func.isRequired
};
export default connect(createMapStateToProps, mapDispatchToProps)(HealthConnector);

@ -0,0 +1,61 @@
import React from 'react';
import IconButton from 'Components/Link/IconButton';
import { icons } from 'Helpers/Props';
import translate from 'Utilities/String/translate';
interface HealthItemLinkProps {
source: string;
}
function HealthItemLink(props: HealthItemLinkProps) {
const { source } = props;
switch (source) {
case 'IndexerRssCheck':
case 'IndexerSearchCheck':
case 'IndexerStatusCheck':
case 'IndexerJackettAllCheck':
case 'IndexerLongTermStatusCheck':
return (
<IconButton
name={icons.SETTINGS}
title={translate('Settings')}
to="/settings/indexers"
/>
);
case 'DownloadClientCheck':
case 'DownloadClientStatusCheck':
case 'ImportMechanismCheck':
return (
<IconButton
name={icons.SETTINGS}
title={translate('Settings')}
to="/settings/downloadclients"
/>
);
case 'NotificationStatusCheck':
return (
<IconButton
name={icons.SETTINGS}
title={translate('Settings')}
to="/settings/connect"
/>
);
case 'RootFolderCheck':
return (
<IconButton name={icons.PLAY} title={translate('MovieEditor')} to="/" />
);
case 'UpdateCheck':
return (
<IconButton
name={icons.UPDATE}
title={translate('Updates')}
to="/system/updates"
/>
);
default:
return null;
}
}
export default HealthItemLink;

@ -0,0 +1,56 @@
import React, { useEffect, useMemo } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import AppState from 'App/State/AppState';
import PageSidebarStatus from 'Components/Page/Sidebar/PageSidebarStatus';
import usePrevious from 'Helpers/Hooks/usePrevious';
import { fetchHealth } from 'Store/Actions/systemActions';
import createHealthSelector from './createHealthSelector';
function HealthStatus() {
const dispatch = useDispatch();
const { isConnected, isReconnecting } = useSelector(
(state: AppState) => state.app
);
const { isPopulated, items } = useSelector(createHealthSelector());
const wasReconnecting = usePrevious(isReconnecting);
const { count, errors, warnings } = useMemo(() => {
let errors = false;
let warnings = false;
items.forEach((item) => {
if (item.type === 'error') {
errors = true;
}
if (item.type === 'warning') {
warnings = true;
}
});
return {
count: items.length,
errors,
warnings,
};
}, [items]);
useEffect(() => {
if (!isPopulated) {
dispatch(fetchHealth());
}
}, [isPopulated, dispatch]);
useEffect(() => {
if (isConnected && wasReconnecting) {
dispatch(fetchHealth());
}
}, [isConnected, wasReconnecting, dispatch]);
return (
<PageSidebarStatus count={count} errors={errors} warnings={warnings} />
);
}
export default HealthStatus;

@ -1,81 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import PageSidebarStatus from 'Components/Page/Sidebar/PageSidebarStatus';
import { fetchHealth } from 'Store/Actions/systemActions';
import createHealthCheckSelector from 'Store/Selectors/createHealthCheckSelector';
function createMapStateToProps() {
return createSelector(
(state) => state.app,
createHealthCheckSelector(),
(state) => state.system.health,
(app, items, health) => {
const count = items.length;
let errors = false;
let warnings = false;
items.forEach((item) => {
if (item.type === 'error') {
errors = true;
}
if (item.type === 'warning') {
warnings = true;
}
});
return {
isConnected: app.isConnected,
isReconnecting: app.isReconnecting,
isPopulated: health.isPopulated,
count,
errors,
warnings
};
}
);
}
const mapDispatchToProps = {
fetchHealth
};
class HealthStatusConnector extends Component {
//
// Lifecycle
componentDidMount() {
if (!this.props.isPopulated) {
this.props.fetchHealth();
}
}
componentDidUpdate(prevProps) {
if (this.props.isConnected && prevProps.isReconnecting) {
this.props.fetchHealth();
}
}
//
// Render
render() {
return (
<PageSidebarStatus
{...this.props}
/>
);
}
}
HealthStatusConnector.propTypes = {
isConnected: PropTypes.bool.isRequired,
isReconnecting: PropTypes.bool.isRequired,
isPopulated: PropTypes.bool.isRequired,
fetchHealth: PropTypes.func.isRequired
};
export default connect(createMapStateToProps, mapDispatchToProps)(HealthStatusConnector);

@ -0,0 +1,13 @@
import { createSelector } from 'reselect';
import AppState from 'App/State/AppState';
function createHealthSelector() {
return createSelector(
(state: AppState) => state.system.health,
(health) => {
return health;
}
);
}
export default createHealthSelector;

@ -1,70 +0,0 @@
import React, { Component } from 'react';
import DescriptionList from 'Components/DescriptionList/DescriptionList';
import DescriptionListItemDescription from 'Components/DescriptionList/DescriptionListItemDescription';
import DescriptionListItemTitle from 'Components/DescriptionList/DescriptionListItemTitle';
import FieldSet from 'Components/FieldSet';
import Link from 'Components/Link/Link';
import translate from 'Utilities/String/translate';
class MoreInfo extends Component {
//
// Render
render() {
return (
<FieldSet legend={translate('MoreInfo')}>
<DescriptionList>
<DescriptionListItemTitle>
{translate('HomePage')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://radarr.video/">radarr.video</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('Wiki')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://wiki.servarr.com/radarr">wiki.servarr.com/radarr</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('Reddit')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://www.reddit.com/r/Radarr/">/r/Radarr</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('Discord')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://radarr.video/discord">radarr.video/discord</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('Source')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://github.com/Radarr/Radarr/">github.com/Radarr/Radarr</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('FeatureRequests')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://github.com/Radarr/Radarr/issues">github.com/Radarr/Radarr/issues</Link>
</DescriptionListItemDescription>
</DescriptionList>
</FieldSet>
);
}
}
MoreInfo.propTypes = {
};
export default MoreInfo;

@ -0,0 +1,63 @@
import React from 'react';
import DescriptionList from 'Components/DescriptionList/DescriptionList';
import DescriptionListItemDescription from 'Components/DescriptionList/DescriptionListItemDescription';
import DescriptionListItemTitle from 'Components/DescriptionList/DescriptionListItemTitle';
import FieldSet from 'Components/FieldSet';
import Link from 'Components/Link/Link';
import translate from 'Utilities/String/translate';
function MoreInfo() {
return (
<FieldSet legend={translate('MoreInfo')}>
<DescriptionList>
<DescriptionListItemTitle>
{translate('HomePage')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://radarr.video/">radarr.video</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>{translate('Wiki')}</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://wiki.servarr.com/radarr">
wiki.servarr.com/radarr
</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('Reddit')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://www.reddit.com/r/Radarr/">/r/Radarr</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('Discord')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://radarr.video/discord">radarr.video/discord</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('Source')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://github.com/Radarr/Radarr/">
github.com/Radarr/Radarr
</Link>
</DescriptionListItemDescription>
<DescriptionListItemTitle>
{translate('FeatureRequests')}
</DescriptionListItemTitle>
<DescriptionListItemDescription>
<Link to="https://github.com/Radarr/Radarr/issues">
github.com/Radarr/Radarr/issues
</Link>
</DescriptionListItemDescription>
</DescriptionList>
</FieldSet>
);
}
export default MoreInfo;

@ -1,32 +0,0 @@
import React, { Component } from 'react';
import PageContent from 'Components/Page/PageContent';
import PageContentBody from 'Components/Page/PageContentBody';
import translate from 'Utilities/String/translate';
import AboutConnector from './About/AboutConnector';
import DiskSpaceConnector from './DiskSpace/DiskSpaceConnector';
import Donations from './Donations/Donations';
import HealthConnector from './Health/HealthConnector';
import MoreInfo from './MoreInfo/MoreInfo';
class Status extends Component {
//
// Render
render() {
return (
<PageContent title={translate('Status')}>
<PageContentBody>
<HealthConnector />
<DiskSpaceConnector />
<AboutConnector />
<MoreInfo />
<Donations />
</PageContentBody>
</PageContent>
);
}
}
export default Status;

@ -0,0 +1,25 @@
import React from 'react';
import PageContent from 'Components/Page/PageContent';
import PageContentBody from 'Components/Page/PageContentBody';
import translate from 'Utilities/String/translate';
import About from './About/About';
import DiskSpace from './DiskSpace/DiskSpace';
import Donations from './Donations/Donations';
import Health from './Health/Health';
import MoreInfo from './MoreInfo/MoreInfo';
function Status() {
return (
<PageContent title={translate('Status')}>
<PageContentBody>
<Health />
<DiskSpace />
<About />
<MoreInfo />
<Donations />
</PageContentBody>
</PageContent>
);
}
export default Status;

@ -1,203 +0,0 @@
import moment from 'moment';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import { icons } from 'Helpers/Props';
import formatDate from 'Utilities/Date/formatDate';
import formatDateTime from 'Utilities/Date/formatDateTime';
import formatTimeSpan from 'Utilities/Date/formatTimeSpan';
import styles from './ScheduledTaskRow.css';
function getFormattedDates(props) {
const {
lastExecution,
nextExecution,
interval,
showRelativeDates,
shortDateFormat
} = props;
const isDisabled = interval === 0;
if (showRelativeDates) {
return {
lastExecutionTime: moment(lastExecution).fromNow(),
nextExecutionTime: isDisabled ? '-' : moment(nextExecution).fromNow()
};
}
return {
lastExecutionTime: formatDate(lastExecution, shortDateFormat),
nextExecutionTime: isDisabled ? '-' : formatDate(nextExecution, shortDateFormat)
};
}
class ScheduledTaskRow extends Component {
//
// Lifecycle
constructor(props, context) {
super(props, context);
this.state = getFormattedDates(props);
this._updateTimeoutId = null;
}
componentDidMount() {
this.setUpdateTimer();
}
componentDidUpdate(prevProps) {
const {
lastExecution,
nextExecution
} = this.props;
if (
lastExecution !== prevProps.lastExecution ||
nextExecution !== prevProps.nextExecution
) {
this.setState(getFormattedDates(this.props));
}
}
componentWillUnmount() {
if (this._updateTimeoutId) {
this._updateTimeoutId = clearTimeout(this._updateTimeoutId);
}
}
//
// Listeners
setUpdateTimer() {
const { interval } = this.props;
const timeout = interval < 60 ? 10000 : 60000;
this._updateTimeoutId = setTimeout(() => {
this.setState(getFormattedDates(this.props));
this.setUpdateTimer();
}, timeout);
}
//
// Render
render() {
const {
name,
interval,
lastExecution,
lastStartTime,
lastDuration,
nextExecution,
isQueued,
isExecuting,
longDateFormat,
timeFormat,
onExecutePress
} = this.props;
const {
lastExecutionTime,
nextExecutionTime
} = this.state;
const isDisabled = interval === 0;
const executeNow = !isDisabled && moment().isAfter(nextExecution);
const hasNextExecutionTime = !isDisabled && !executeNow;
const duration = moment.duration(interval, 'minutes').humanize().replace(/an?(?=\s)/, '1');
const hasLastStartTime = moment(lastStartTime).isAfter('2010-01-01');
return (
<TableRow>
<TableRowCell>{name}</TableRowCell>
<TableRowCell
className={styles.interval}
>
{isDisabled ? 'disabled' : duration}
</TableRowCell>
<TableRowCell
className={styles.lastExecution}
title={formatDateTime(lastExecution, longDateFormat, timeFormat)}
>
{lastExecutionTime}
</TableRowCell>
{
!hasLastStartTime &&
<TableRowCell className={styles.lastDuration}>-</TableRowCell>
}
{
hasLastStartTime &&
<TableRowCell
className={styles.lastDuration}
title={lastDuration}
>
{formatTimeSpan(lastDuration)}
</TableRowCell>
}
{
isDisabled &&
<TableRowCell className={styles.nextExecution}>-</TableRowCell>
}
{
executeNow && isQueued &&
<TableRowCell className={styles.nextExecution}>queued</TableRowCell>
}
{
executeNow && !isQueued &&
<TableRowCell className={styles.nextExecution}>now</TableRowCell>
}
{
hasNextExecutionTime &&
<TableRowCell
className={styles.nextExecution}
title={formatDateTime(nextExecution, longDateFormat, timeFormat, { includeSeconds: true })}
>
{nextExecutionTime}
</TableRowCell>
}
<TableRowCell
className={styles.actions}
>
<SpinnerIconButton
name={icons.REFRESH}
spinningName={icons.REFRESH}
isSpinning={isExecuting}
onPress={onExecutePress}
/>
</TableRowCell>
</TableRow>
);
}
}
ScheduledTaskRow.propTypes = {
name: PropTypes.string.isRequired,
interval: PropTypes.number.isRequired,
lastExecution: PropTypes.string.isRequired,
lastStartTime: PropTypes.string.isRequired,
lastDuration: PropTypes.string.isRequired,
nextExecution: PropTypes.string.isRequired,
isQueued: PropTypes.bool.isRequired,
isExecuting: PropTypes.bool.isRequired,
showRelativeDates: PropTypes.bool.isRequired,
shortDateFormat: PropTypes.string.isRequired,
longDateFormat: PropTypes.string.isRequired,
timeFormat: PropTypes.string.isRequired,
onExecutePress: PropTypes.func.isRequired
};
export default ScheduledTaskRow;

@ -0,0 +1,170 @@
import moment from 'moment';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import usePrevious from 'Helpers/Hooks/usePrevious';
import { icons } from 'Helpers/Props';
import { executeCommand } from 'Store/Actions/commandActions';
import { fetchTask } from 'Store/Actions/systemActions';
import createCommandSelector from 'Store/Selectors/createCommandSelector';
import createUISettingsSelector from 'Store/Selectors/createUISettingsSelector';
import { isCommandExecuting } from 'Utilities/Command';
import formatDate from 'Utilities/Date/formatDate';
import formatDateTime from 'Utilities/Date/formatDateTime';
import formatTimeSpan from 'Utilities/Date/formatTimeSpan';
import styles from './ScheduledTaskRow.css';
interface ScheduledTaskRowProps {
id: number;
taskName: string;
name: string;
interval: number;
lastExecution: string;
lastStartTime: string;
lastDuration: string;
nextExecution: string;
}
function ScheduledTaskRow(props: ScheduledTaskRowProps) {
const {
id,
taskName,
name,
interval,
lastExecution,
lastStartTime,
lastDuration,
nextExecution,
} = props;
const dispatch = useDispatch();
const { showRelativeDates, longDateFormat, shortDateFormat, timeFormat } =
useSelector(createUISettingsSelector());
const command = useSelector(createCommandSelector(taskName));
const [time, setTime] = useState(Date.now());
const isQueued = !!(command && command.status === 'queued');
const isExecuting = isCommandExecuting(command);
const wasExecuting = usePrevious(isExecuting);
const isDisabled = interval === 0;
const executeNow = !isDisabled && moment().isAfter(nextExecution);
const hasNextExecutionTime = !isDisabled && !executeNow;
const hasLastStartTime = moment(lastStartTime).isAfter('2010-01-01');
const duration = useMemo(() => {
return moment
.duration(interval, 'minutes')
.humanize()
.replace(/an?(?=\s)/, '1');
}, [interval]);
const { lastExecutionTime, nextExecutionTime } = useMemo(() => {
const isDisabled = interval === 0;
if (showRelativeDates && time) {
return {
lastExecutionTime: moment(lastExecution).fromNow(),
nextExecutionTime: isDisabled ? '-' : moment(nextExecution).fromNow(),
};
}
return {
lastExecutionTime: formatDate(lastExecution, shortDateFormat),
nextExecutionTime: isDisabled
? '-'
: formatDate(nextExecution, shortDateFormat),
};
}, [
time,
interval,
lastExecution,
nextExecution,
showRelativeDates,
shortDateFormat,
]);
const handleExecutePress = useCallback(() => {
dispatch(
executeCommand({
name: taskName,
})
);
}, [taskName, dispatch]);
useEffect(() => {
if (!isExecuting && wasExecuting) {
setTimeout(() => {
dispatch(fetchTask({ id }));
}, 1000);
}
}, [id, isExecuting, wasExecuting, dispatch]);
useEffect(() => {
const interval = setInterval(() => setTime(Date.now()), 1000);
return () => {
clearInterval(interval);
};
}, [setTime]);
return (
<TableRow>
<TableRowCell>{name}</TableRowCell>
<TableRowCell className={styles.interval}>
{isDisabled ? 'disabled' : duration}
</TableRowCell>
<TableRowCell
className={styles.lastExecution}
title={formatDateTime(lastExecution, longDateFormat, timeFormat)}
>
{lastExecutionTime}
</TableRowCell>
{hasLastStartTime ? (
<TableRowCell className={styles.lastDuration} title={lastDuration}>
{formatTimeSpan(lastDuration)}
</TableRowCell>
) : (
<TableRowCell className={styles.lastDuration}>-</TableRowCell>
)}
{isDisabled ? (
<TableRowCell className={styles.nextExecution}>-</TableRowCell>
) : null}
{executeNow && isQueued ? (
<TableRowCell className={styles.nextExecution}>queued</TableRowCell>
) : null}
{executeNow && !isQueued ? (
<TableRowCell className={styles.nextExecution}>now</TableRowCell>
) : null}
{hasNextExecutionTime ? (
<TableRowCell
className={styles.nextExecution}
title={formatDateTime(nextExecution, longDateFormat, timeFormat, {
includeSeconds: true,
})}
>
{nextExecutionTime}
</TableRowCell>
) : null}
<TableRowCell className={styles.actions}>
<SpinnerIconButton
name={icons.REFRESH}
spinningName={icons.REFRESH}
isSpinning={isExecuting}
onPress={handleExecutePress}
/>
</TableRowCell>
</TableRow>
);
}
export default ScheduledTaskRow;

@ -1,92 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import { executeCommand } from 'Store/Actions/commandActions';
import { fetchTask } from 'Store/Actions/systemActions';
import createCommandsSelector from 'Store/Selectors/createCommandsSelector';
import createUISettingsSelector from 'Store/Selectors/createUISettingsSelector';
import { findCommand, isCommandExecuting } from 'Utilities/Command';
import ScheduledTaskRow from './ScheduledTaskRow';
function createMapStateToProps() {
return createSelector(
(state, { taskName }) => taskName,
createCommandsSelector(),
createUISettingsSelector(),
(taskName, commands, uiSettings) => {
const command = findCommand(commands, { name: taskName });
return {
isQueued: !!(command && command.state === 'queued'),
isExecuting: isCommandExecuting(command),
showRelativeDates: uiSettings.showRelativeDates,
shortDateFormat: uiSettings.shortDateFormat,
longDateFormat: uiSettings.longDateFormat,
timeFormat: uiSettings.timeFormat
};
}
);
}
function createMapDispatchToProps(dispatch, props) {
const taskName = props.taskName;
return {
dispatchFetchTask() {
dispatch(fetchTask({
id: props.id
}));
},
onExecutePress() {
dispatch(executeCommand({
name: taskName
}));
}
};
}
class ScheduledTaskRowConnector extends Component {
//
// Lifecycle
componentDidUpdate(prevProps) {
const {
isExecuting,
dispatchFetchTask
} = this.props;
if (!isExecuting && prevProps.isExecuting) {
// Give the host a moment to update after the command completes
setTimeout(() => {
dispatchFetchTask();
}, 1000);
}
}
//
// Render
render() {
const {
dispatchFetchTask,
...otherProps
} = this.props;
return (
<ScheduledTaskRow
{...otherProps}
/>
);
}
}
ScheduledTaskRowConnector.propTypes = {
id: PropTypes.number.isRequired,
isExecuting: PropTypes.bool.isRequired,
dispatchFetchTask: PropTypes.func.isRequired
};
export default connect(createMapStateToProps, createMapDispatchToProps)(ScheduledTaskRowConnector);

@ -1,85 +0,0 @@
import PropTypes from 'prop-types';
import React from 'react';
import FieldSet from 'Components/FieldSet';
import LoadingIndicator from 'Components/Loading/LoadingIndicator';
import Table from 'Components/Table/Table';
import TableBody from 'Components/Table/TableBody';
import translate from 'Utilities/String/translate';
import ScheduledTaskRowConnector from './ScheduledTaskRowConnector';
const columns = [
{
name: 'name',
label: () => translate('Name'),
isVisible: true
},
{
name: 'interval',
label: () => translate('Interval'),
isVisible: true
},
{
name: 'lastExecution',
label: () => translate('LastExecution'),
isVisible: true
},
{
name: 'lastDuration',
label: () => translate('LastDuration'),
isVisible: true
},
{
name: 'nextExecution',
label: () => translate('NextExecution'),
isVisible: true
},
{
name: 'actions',
isVisible: true
}
];
function ScheduledTasks(props) {
const {
isFetching,
isPopulated,
items
} = props;
return (
<FieldSet legend={translate('Scheduled')}>
{
isFetching && !isPopulated &&
<LoadingIndicator />
}
{
isPopulated &&
<Table
columns={columns}
>
<TableBody>
{
items.map((item) => {
return (
<ScheduledTaskRowConnector
key={item.id}
{...item}
/>
);
})
}
</TableBody>
</Table>
}
</FieldSet>
);
}
ScheduledTasks.propTypes = {
isFetching: PropTypes.bool.isRequired,
isPopulated: PropTypes.bool.isRequired,
items: PropTypes.array.isRequired
};
export default ScheduledTasks;

@ -0,0 +1,73 @@
import React, { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import AppState from 'App/State/AppState';
import FieldSet from 'Components/FieldSet';
import LoadingIndicator from 'Components/Loading/LoadingIndicator';
import Column from 'Components/Table/Column';
import Table from 'Components/Table/Table';
import TableBody from 'Components/Table/TableBody';
import { fetchTasks } from 'Store/Actions/systemActions';
import translate from 'Utilities/String/translate';
import ScheduledTaskRow from './ScheduledTaskRow';
const columns: Column[] = [
{
name: 'name',
label: () => translate('Name'),
isVisible: true,
},
{
name: 'interval',
label: () => translate('Interval'),
isVisible: true,
},
{
name: 'lastExecution',
label: () => translate('LastExecution'),
isVisible: true,
},
{
name: 'lastDuration',
label: () => translate('LastDuration'),
isVisible: true,
},
{
name: 'nextExecution',
label: () => translate('NextExecution'),
isVisible: true,
},
{
name: 'actions',
label: '',
isVisible: true,
},
];
function ScheduledTasks() {
const dispatch = useDispatch();
const { isFetching, isPopulated, items } = useSelector(
(state: AppState) => state.system.tasks
);
useEffect(() => {
dispatch(fetchTasks());
}, [dispatch]);
return (
<FieldSet legend={translate('Scheduled')}>
{isFetching && !isPopulated && <LoadingIndicator />}
{isPopulated && (
<Table columns={columns}>
<TableBody>
{items.map((item) => {
return <ScheduledTaskRow key={item.id} {...item} />;
})}
</TableBody>
</Table>
)}
</FieldSet>
);
}
export default ScheduledTasks;

@ -1,46 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import { fetchTasks } from 'Store/Actions/systemActions';
import ScheduledTasks from './ScheduledTasks';
function createMapStateToProps() {
return createSelector(
(state) => state.system.tasks,
(tasks) => {
return tasks;
}
);
}
const mapDispatchToProps = {
dispatchFetchTasks: fetchTasks
};
class ScheduledTasksConnector extends Component {
//
// Lifecycle
componentDidMount() {
this.props.dispatchFetchTasks();
}
//
// Render
render() {
return (
<ScheduledTasks
{...this.props}
/>
);
}
}
ScheduledTasksConnector.propTypes = {
dispatchFetchTasks: PropTypes.func.isRequired
};
export default connect(createMapStateToProps, mapDispatchToProps)(ScheduledTasksConnector);

@ -3,13 +3,13 @@ import PageContent from 'Components/Page/PageContent';
import PageContentBody from 'Components/Page/PageContentBody';
import translate from 'Utilities/String/translate';
import QueuedTasks from './Queued/QueuedTasks';
import ScheduledTasksConnector from './Scheduled/ScheduledTasksConnector';
import ScheduledTasks from './Scheduled/ScheduledTasks';
function Tasks() {
return (
<PageContent title={translate('Tasks')}>
<PageContentBody>
<ScheduledTasksConnector />
<ScheduledTasks />
<QueuedTasks />
</PageContentBody>
</PageContent>

@ -0,0 +1,8 @@
interface DiskSpace {
path: string;
label: string;
freeSpace: number;
totalSpace: number;
}
export default DiskSpace;

@ -0,0 +1,8 @@
interface Health {
source: string;
type: string;
message: string;
wikiUrl: string;
}
export default Health;

@ -4,6 +4,8 @@ interface SystemStatus {
authentication: string;
branch: string;
buildTime: string;
databaseVersion: string;
databaseType: string;
instanceName: string;
isAdmin: boolean;
isDebug: boolean;
@ -18,7 +20,10 @@ interface SystemStatus {
mode: string;
osName: string;
osVersion: string;
packageAuthor: string;
packageUpdateMechanism: string;
packageUpdateMechanismMessage: string;
packageVersion: string;
runtimeName: string;
runtimeVersion: string;
sqliteVersion: string;

@ -0,0 +1,13 @@
import ModelBase from 'App/ModelBase';
interface Task extends ModelBase {
name: string;
taskName: string;
interval: number;
lastExecution: string;
lastStartTime: string;
nextExecution: string;
lastDuration: string;
}
export default Task;

@ -267,7 +267,7 @@
"NoAltTitle": "لا توجد عناوين بديلة.",
"NextExecution": "التنفيذ القادم",
"New": "جديد",
"NetCore": ".شبكة",
"DotNetVersion": ".شبكة",
"NegateHelpText": "إذا تم تحديده ، فلن يتم تطبيق التنسيق المخصص إذا تطابق شرط {0} هذا.",
"Negated": "نفي",
"Negate": "ينفي",

@ -889,7 +889,7 @@
"MustContain": "Трябва да съдържа",
"MustNotContain": "Не трябва да съдържа",
"NamingSettings": "Настройки за именуване",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"NoBackupsAreAvailable": "Няма налични резервни копия",
"NoChange": "Няма промяна",
"NoHistory": "Няма история",

@ -287,7 +287,7 @@
"MovieDetailsNextMovie": "Detalls de la pel·lícula: propera pel·lícula",
"MovieInvalidFormat": "Pel·lícula: Format no vàlid",
"NegateHelpText": "Si està marcat, el format personalitzat no s'aplicarà si la condició {implementationName} coincideix.",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NoLeaveIt": "No, deixa-ho",
"TotalMovies": "Total de pel·lícules",
"TotalSpace": "Espai total",

@ -382,7 +382,7 @@
"MustContain": "Musí obsahovat",
"MustNotContain": "Nesmí obsahovat",
"NamingSettings": "Nastavení pojmenování",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"NoBackupsAreAvailable": "Nejsou k dispozici žádné zálohy",
"NoChange": "Žádná změna",
"NoHistory": "Žádná historie",

@ -373,7 +373,7 @@
"MovieIsMonitored": "Film overvåges",
"MovieIsUnmonitored": "Filmen overvåges ikke",
"Movies": "Film",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"OpenBrowserOnStart": "Åbn browser ved start",
"NoChange": "Ingen ændring",
"NoHistory": "Ingen historie",

@ -419,7 +419,7 @@
"MustContain": "Muss beinhalten",
"MustNotContain": "Darf nicht beinhalten",
"NamingSettings": "Bennenungs Einstellungen",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"New": "Neu",
"NoLeaveIt": "Nein, nicht ändern",
"NoLimitForAnyRuntime": "Keine Begrenzung der Laufzeiten",

@ -378,7 +378,7 @@
"MustContain": "Πρέπει να περιέχει",
"MustNotContain": "Δεν πρέπει να περιέχει",
"NamingSettings": "Ρυθμίσεις ονομάτων",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NoBackupsAreAvailable": "Δεν υπάρχουν διαθέσιμα αντίγραφα ασφαλείας",
"NoChange": "Καμία αλλαγή",
"NoHistory": "Χωρίς ιστορία",

@ -388,6 +388,7 @@
"Donate": "Donate",
"Donations": "Donations",
"DoneEditingGroups": "Done Editing Groups",
"DotNetVersion": ".NET",
"Download": "Download",
"DownloadClient": "Download Client",
"DownloadClientAriaSettingsDirectoryHelpText": "Optional location to put downloads in, leave blank to use the default Aria2 location",
@ -1007,7 +1008,6 @@
"Negate": "Negate",
"NegateHelpText": "If checked, the custom format will not apply if this {implementationName} condition matches.",
"Negated": "Negated",
"NetCore": ".NET",
"Never": "Never",
"New": "New",
"NewNonExcluded": "New Non-Excluded",

@ -503,7 +503,7 @@
"NoLimitForAnyRuntime": "No hay límites para ningún tiempo de ejecución",
"NoLeaveIt": "No, déjalo",
"New": "Nuevo",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NamingSettings": "Opciones de nombrado",
"MustNotContain": "No debe contener",
"MustContain": "Debe contener",

@ -335,7 +335,7 @@
"NamingSettings": "Nimeämisasetukset",
"PendingChangesMessage": "Olet tehnyt muutoksia, joita ei ole vielä tallennettu. Haluatko varmasti poistua sivulta?",
"PendingChangesStayReview": "Älä poistu ja tarkista muutokset",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NoBackupsAreAvailable": "Varmuuskopioita ei ole käytettävissä",
"NoChange": "Ei muutosta",
"NoHistory": "Historiaa ei ole",

@ -715,7 +715,7 @@
"NoHistory": "Aucun historique",
"NoBackupsAreAvailable": "Aucune sauvegarde n'est disponible",
"New": "Nouveau",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NamingSettings": "Paramètres de dénomination",
"MustNotContain": "Ne doit pas contenir",
"MovieYearToExcludeHelpText": "L'année de film à exclure",

@ -331,7 +331,7 @@
"DatabaseMigration": "הגירת DB",
"MustNotContain": "אסור להכיל",
"NamingSettings": "הגדרת שמות",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"AddRemotePathMapping": "הוסף מיפוי נתיבים מרוחק",
"Age": "גיל",
"NoBackupsAreAvailable": "אין גיבויים",

@ -522,7 +522,7 @@
"MustContain": "शामिल होना चाहिए",
"MustNotContain": "कंटेनर नहीं होना चाहिए",
"NamingSettings": "नामकरण सेटिंग्स",
"NetCore": ".NET कोर",
"DotNetVersion": ".NET कोर",
"NoBackupsAreAvailable": "कोई बैकअप उपलब्ध नहीं हैं",
"NoChange": "कोई परिवर्तन नहीं होता है",
"NoHistory": "कोई इतिहास नहीं",

@ -81,7 +81,7 @@
"Info": "Informacije",
"Language": "jezik",
"Metadata": "metapodaci",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"Quality": "kvalitet",
"QualityProfile": "profil kvalitete",
"QualityProfiles": "profil kvalitete",

@ -476,7 +476,7 @@
"NoChange": "Nincs változás",
"NoBackupsAreAvailable": "Nincsenek biztonsági mentések",
"New": "Új",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NegateHelpText": "Ha be van jelölve, az egyéni formátum nem lesz érvényes, ha ez a(z) {0} feltétel megegyezik.",
"NamingSettings": "Elnevezési beállítások",
"Name": "Név",

@ -74,7 +74,7 @@
"Host": "Host",
"Hostname": "Hostname",
"IMDb": "IMDb",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"Connection": "Koneksi",
"ImportCustomFormat": "Tambahkan Format Khusus",
"ConnectionLost": "Koneksi Terputus",

@ -380,7 +380,7 @@
"All": "Allt",
"Analytics": "Greiningar",
"NamingSettings": "Nafngiftarstillingar",
"NetCore": ".NET algerlega",
"DotNetVersion": ".NET algerlega",
"NoBackupsAreAvailable": "Engin afrit eru í boði",
"NoChange": "Engin breyting",
"NoHistory": "Engin saga",

@ -344,7 +344,7 @@
"Posters": "Locandine",
"Password": "Password",
"NotificationTriggers": "Attivatori di Notifica",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"MinimumAgeHelpText": "Solo Usenet: Età minima in minuti di NZB prima di essere prelevati. Usalo per dare tempo alle nuove release di propagarsi al vostro provider usenet.",
"Logs": "Logs",
"Links": "Collegamenti",

@ -335,7 +335,7 @@
"IndexersSettingsSummary": "インデクサーとリリース制限",
"MovieYearToExcludeHelpText": "除外する映画の年",
"Age": "年齢",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"NoBackupsAreAvailable": "バックアップは利用できません",
"MoveFiles": "ファイルの移動",
"NoChange": "変化なし",

@ -341,7 +341,7 @@
"MustContain": "포함해야 함",
"MustNotContain": "포함해서는 안 됨",
"NamingSettings": "이름 지정 설정",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"NoBackupsAreAvailable": "사용 가능한 백업이 없습니다.",
"NoChange": "변경 없음",
"RelativePath": "상대 경로",

@ -489,7 +489,7 @@
"OpenBrowserOnStart": "Open de browser bij het starten",
"NoLimitForAnyRuntime": "Geen limiet voor eender welke speelduur",
"NoMinimumForAnyRuntime": "Geen minimum voor een speelduur",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"PreferredSize": "Gewenste Grootte",
"ProxyPasswordHelpText": "Je moet alleen een gebruikersnaam en wachtwoord ingeven als dit vereist is, laat ze anders leeg.",
"ProxyUsernameHelpText": "Je moet alleen een gebruikersnaam en wachtwoord ingeven als dit vereist is, laat ze anders leeg.",

@ -342,7 +342,7 @@
"MustContain": "Musi zawierać",
"MustNotContain": "Nie może zawierać",
"NamingSettings": "Ustawienia nazewnictwa",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NoBackupsAreAvailable": "Brak dostępnych kopii zapasowych",
"NoChange": "Bez zmiany",
"NoHistory": "Żadnej historii",

@ -331,7 +331,7 @@
"NoLimitForAnyRuntime": "Sem limite de tempo de execução",
"NoLeaveIt": "Não, deixe-o",
"New": "Novo",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NamingSettings": "Definições de nomenclatura",
"MustNotContain": "Não deve conter",
"MustContain": "Deve conter",

@ -532,7 +532,7 @@
"NoAltTitle": "Nenhum título alternativo.",
"NextExecution": "Próxima Execução",
"New": "Novo",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"ICalShowAsAllDayEvents": "Mostrar como eventos de dia inteiro",
"WeekColumnHeaderHelpText": "Mostrado acima de cada coluna quando a semana é a exibição ativa",
"Script": "Script",

@ -528,7 +528,7 @@
"MustContain": "Trebuie sa contina",
"MustNotContain": "Nu trebuie să conțină",
"NamingSettings": "Setări de denumire",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"ApiKey": "Cheie API",
"NoBackupsAreAvailable": "Nu sunt disponibile copii de rezervă",
"NoHistory": "Fără istorie",

@ -482,7 +482,7 @@
"NoAltTitle": "Альтернативных названий нет.",
"NextExecution": "Следующее выполнение",
"New": "Новый",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"Negated": "Отрицательный",
"Negate": "Отрицать",
"NamingSettings": "Настройки именования",

@ -716,7 +716,7 @@
"NamingSettings": "Namninställningar",
"LastDuration": "lastDuration",
"ReadTheWikiForMoreInformation": "Läs Wiki för mer information",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"RecyclingBinCleanup": "Rengöring av papperskorgen",
"ReleaseRejected": "Utgåva avvisad",
"NoMatchFound": "Ingen matchning hittad!",

@ -448,7 +448,7 @@
"MustContain": "ต้องมี",
"MustNotContain": "ต้องไม่มี",
"NamingSettings": "การตั้งชื่อการตั้งค่า",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"NoBackupsAreAvailable": "ไม่มีการสำรองข้อมูล",
"NoChange": "ไม่มีการเปลี่ยนแปลง",
"NoHistory": "ไม่มีประวัติ",

@ -410,7 +410,7 @@
"CalendarFeed": "{appName} Takvim Beslemesi",
"DownloadPropersAndRepacksHelpTextCustomFormat": "Propers / Repacks üzerinden özel format puanına göre sıralamak için \"Tercih Etme\" seçeneğini kullanın",
"Tomorrow": "Yarın",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"NoHistory": "Geçmiş yok",
"AddQualityProfile": "Kalite Profili Ekle",
"NoBackupsAreAvailable": "Kullanılabilir yedek yok",

@ -1043,7 +1043,7 @@
"MissingNotMonitored": "Відсутній (неконтрольований)",
"MonitorMovie": "Відстежувати фільм",
"MonitorMovies": "Відстежувати фільми",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"Peers": "Піри",
"Rss": "RSS",
"Seeders": "Сиди",

@ -478,7 +478,7 @@
"MustNotContain": "Không được chứa",
"IndexerFlags": "Cờ chỉ mục",
"NamingSettings": "Cài đặt đặt tên",
"NetCore": ".NET Core",
"DotNetVersion": ".NET",
"MoveFiles": "Di chuyển tệp",
"NoBackupsAreAvailable": "Không có bản sao lưu nào",
"AnalyseVideoFiles": "Phân tích tệp video",

@ -265,7 +265,7 @@
"NoChanges": "无修改",
"NoChange": "无修改",
"NoBackupsAreAvailable": "无备份可用",
"NetCore": ".NET",
"DotNetVersion": ".NET",
"MustNotContain": "不得包含",
"MustContain": "必须包含",
"MultiLanguage": "多语言",

Loading…
Cancel
Save