mirror of
https://github.com/Prowlarr/Prowlarr.git
synced 2026-04-24 22:55:21 -04:00
Convert System to TypeScript
(cherry picked from commit 72db8099e0f4abc3176e397f8dda3b2b69026daf)
This commit is contained in:
Mark McDowall
Bogdan
@@ -1,128 +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 ? <span> {packageVersion} {' by '} <InlineMarkdown data={packageAuthor} /> </span> : 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,102 @@
|
||||
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 ? (
|
||||
<span>
|
||||
{' '}
|
||||
{packageVersion} {' by '}{' '}
|
||||
<InlineMarkdown data={packageAuthor} />{' '}
|
||||
</span>
|
||||
) : (
|
||||
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} />}
|
||||
/>
|
||||
</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,64 +0,0 @@
|
||||
import React, { Component } from 'react';
|
||||
import FieldSet from 'Components/FieldSet';
|
||||
import Link from 'Components/Link/Link';
|
||||
import translate from 'Utilities/String/translate';
|
||||
import styles from '../styles.css';
|
||||
|
||||
class Donations extends Component {
|
||||
|
||||
//
|
||||
// Render
|
||||
|
||||
render() {
|
||||
return (
|
||||
<FieldSet legend={translate('Donations')}>
|
||||
<div className={styles.logoContainer} title="Radarr">
|
||||
<Link to="https://radarr.video/donate">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-radarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
<div className={styles.logoContainer} title="Lidarr">
|
||||
<Link to="https://lidarr.audio/donate">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-lidarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
<div className={styles.logoContainer} title="Readarr">
|
||||
<Link to="https://readarr.com/donate">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-readarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
<div className={styles.logoContainer} title="Prowlarr">
|
||||
<Link to="https://prowlarr.com/donate">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-prowlarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
<div className={styles.logoContainer} title="Sonarr">
|
||||
<Link to="https://opencollective.com/sonarr">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-sonarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
</FieldSet>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Donations.propTypes = {
|
||||
|
||||
};
|
||||
|
||||
export default Donations;
|
||||
@@ -0,0 +1,58 @@
|
||||
import React from 'react';
|
||||
import FieldSet from 'Components/FieldSet';
|
||||
import Link from 'Components/Link/Link';
|
||||
import translate from 'Utilities/String/translate';
|
||||
import styles from '../styles.css';
|
||||
|
||||
function Donations() {
|
||||
return (
|
||||
<FieldSet legend={translate('Donations')}>
|
||||
<div className={styles.logoContainer} title="Radarr">
|
||||
<Link to="https://radarr.video/donate">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-radarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className={styles.logoContainer} title="Lidarr">
|
||||
<Link to="https://lidarr.audio/donate">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-lidarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className={styles.logoContainer} title="Readarr">
|
||||
<Link to="https://readarr.com/donate">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-readarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className={styles.logoContainer} title="Prowlarr">
|
||||
<Link to="https://prowlarr.com/donate">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-prowlarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className={styles.logoContainer} title="Sonarr">
|
||||
<Link to="https://opencollective.com/sonarr">
|
||||
<img
|
||||
className={styles.logo}
|
||||
src={`${window.Prowlarr.urlBase}/Content/Images/Icons/logo-sonarr.png`}
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
</FieldSet>
|
||||
);
|
||||
}
|
||||
|
||||
export default Donations;
|
||||
@@ -1,250 +0,0 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React, { Component } from 'react';
|
||||
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 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 'ApplicationStatusCheck':
|
||||
case 'ApplicationLongTermStatusCheck':
|
||||
return (
|
||||
<IconButton
|
||||
name={icons.SETTINGS}
|
||||
title={translate('Settings')}
|
||||
to="/settings/applications"
|
||||
/>
|
||||
);
|
||||
case 'DownloadClientStatusCheck':
|
||||
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 'IndexerProxyStatusCheck':
|
||||
return (
|
||||
<IconButton
|
||||
name={icons.SETTINGS}
|
||||
title={translate('Settings')}
|
||||
to="/settings/indexers"
|
||||
/>
|
||||
);
|
||||
case 'IndexerRssCheck':
|
||||
case 'IndexerSearchCheck':
|
||||
case 'IndexerStatusCheck':
|
||||
case 'IndexerLongTermStatusCheck':
|
||||
return (
|
||||
<IconButton
|
||||
name={icons.SETTINGS}
|
||||
title={translate('Settings')}
|
||||
to="/"
|
||||
/>
|
||||
);
|
||||
case 'UpdateCheck':
|
||||
return (
|
||||
<IconButton
|
||||
name={icons.UPDATE}
|
||||
title={translate('Updates')}
|
||||
to="/system/updates"
|
||||
/>
|
||||
);
|
||||
default:
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
function getTestLink(source, props) {
|
||||
switch (source) {
|
||||
case 'ApplicationStatusCheck':
|
||||
case 'ApplicationLongTermStatusCheck':
|
||||
return (
|
||||
<SpinnerIconButton
|
||||
name={icons.TEST}
|
||||
title={translate('TestAll')}
|
||||
isSpinning={props.isTestingAllApplications}
|
||||
onPress={props.dispatchTestAllApplications}
|
||||
/>
|
||||
);
|
||||
case 'DownloadClientStatusCheck':
|
||||
return (
|
||||
<SpinnerIconButton
|
||||
name={icons.TEST}
|
||||
title={translate('TestAll')}
|
||||
isSpinning={props.isTestingAllDownloadClients}
|
||||
onPress={props.dispatchTestAllDownloadClients}
|
||||
/>
|
||||
);
|
||||
case 'IndexerStatusCheck':
|
||||
case 'IndexerLongTermStatusCheck':
|
||||
return (
|
||||
<SpinnerIconButton
|
||||
name={icons.TEST}
|
||||
title={translate('TestAll')}
|
||||
isSpinning={props.isTestingAllIndexers}
|
||||
onPress={props.dispatchTestAllIndexers}
|
||||
/>
|
||||
);
|
||||
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('HealthNoIssues')}
|
||||
</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>
|
||||
}
|
||||
</FieldSet>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Health.propTypes = {
|
||||
isFetching: PropTypes.bool.isRequired,
|
||||
isPopulated: PropTypes.bool.isRequired,
|
||||
items: PropTypes.array.isRequired,
|
||||
isTestingAllApplications: PropTypes.bool.isRequired,
|
||||
isTestingAllDownloadClients: PropTypes.bool.isRequired,
|
||||
isTestingAllIndexers: PropTypes.bool.isRequired,
|
||||
dispatchTestAllApplications: PropTypes.func.isRequired,
|
||||
dispatchTestAllDownloadClients: PropTypes.func.isRequired,
|
||||
dispatchTestAllIndexers: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
export default Health;
|
||||
@@ -0,0 +1,191 @@
|
||||
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 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 { testAllIndexers } from 'Store/Actions/indexerActions';
|
||||
import {
|
||||
testAllApplications,
|
||||
testAllDownloadClients,
|
||||
} 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 isTestingAllApplications = useSelector(
|
||||
(state: AppState) => state.settings.applications.isTestingAll
|
||||
);
|
||||
const isTestingAllDownloadClients = useSelector(
|
||||
(state: AppState) => state.settings.downloadClients.isTestingAll
|
||||
);
|
||||
const isTestingAllIndexers = useSelector(
|
||||
(state: AppState) => state.indexers.isTestingAll
|
||||
);
|
||||
|
||||
const healthIssues = !!items.length;
|
||||
|
||||
const handleTestAllApplicationsPress = useCallback(() => {
|
||||
dispatch(testAllApplications());
|
||||
}, [dispatch]);
|
||||
|
||||
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 = 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 === 'ApplicationStatusCheck' ||
|
||||
source === 'ApplicationLongTermStatusCheck' ? (
|
||||
<SpinnerIconButton
|
||||
name={icons.TEST}
|
||||
title={translate('TestAll')}
|
||||
isSpinning={isTestingAllApplications}
|
||||
onPress={handleTestAllApplicationsPress}
|
||||
/>
|
||||
) : null}
|
||||
|
||||
{source === 'IndexerStatusCheck' ||
|
||||
source === 'IndexerLongTermStatusCheck' ? (
|
||||
<SpinnerIconButton
|
||||
name={icons.TEST}
|
||||
title={translate('TestAll')}
|
||||
isSpinning={isTestingAllIndexers}
|
||||
onPress={handleTestAllIndexersPress}
|
||||
/>
|
||||
) : null}
|
||||
|
||||
{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,74 +0,0 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import React, { Component } from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { createSelector } from 'reselect';
|
||||
import { testAllIndexers } from 'Store/Actions/indexerActions';
|
||||
import { testAllApplications } from 'Store/Actions/Settings/applications';
|
||||
import { testAllDownloadClients } from 'Store/Actions/Settings/downloadClients';
|
||||
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.applications.isTestingAll,
|
||||
(state) => state.settings.downloadClients.isTestingAll,
|
||||
(state) => state.indexers.isTestingAll,
|
||||
(items, health, isTestingAllApplications, isTestingAllDownloadClients, isTestingAllIndexers) => {
|
||||
const {
|
||||
isFetching,
|
||||
isPopulated
|
||||
} = health;
|
||||
|
||||
return {
|
||||
isFetching,
|
||||
isPopulated,
|
||||
items,
|
||||
isTestingAllApplications,
|
||||
isTestingAllDownloadClients,
|
||||
isTestingAllIndexers
|
||||
};
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
const mapDispatchToProps = {
|
||||
dispatchFetchHealth: fetchHealth,
|
||||
dispatchTestAllApplications: testAllApplications,
|
||||
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,71 @@
|
||||
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 'ApplicationStatusCheck':
|
||||
case 'ApplicationLongTermStatusCheck':
|
||||
return (
|
||||
<IconButton
|
||||
name={icons.SETTINGS}
|
||||
title={translate('Settings')}
|
||||
to="/settings/applications"
|
||||
/>
|
||||
);
|
||||
case 'DownloadClientStatusCheck':
|
||||
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 'IndexerProxyStatusCheck':
|
||||
return (
|
||||
<IconButton
|
||||
name={icons.SETTINGS}
|
||||
title={translate('Settings')}
|
||||
to="/settings/indexers"
|
||||
/>
|
||||
);
|
||||
case 'IndexerRssCheck':
|
||||
case 'IndexerSearchCheck':
|
||||
case 'IndexerStatusCheck':
|
||||
case 'IndexerLongTermStatusCheck':
|
||||
return (
|
||||
<IconButton
|
||||
name={icons.SETTINGS}
|
||||
title={translate('Settings')}
|
||||
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,58 +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://prowlarr.com/">prowlarr.com</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>{translate('Wiki')}</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://wiki.servarr.com/prowlarr">wiki.servarr.com/prowlarr</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>{translate('Reddit')}</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://reddit.com/r/prowlarr">r/prowlarr</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>{translate('Discord')}</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://prowlarr.com/discord">prowlarr.com/discord</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>{translate('Source')}</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://github.com/Prowlarr/Prowlarr/">github.com/Prowlarr/Prowlarr</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>{translate('FeatureRequests')}</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://github.com/Prowlarr/Prowlarr/issues">github.com/Prowlarr/Prowlarr/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://prowlarr.com/">prowlarr.com</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>{translate('Wiki')}</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://wiki.servarr.com/prowlarr">
|
||||
wiki.servarr.com/prowlarr
|
||||
</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>
|
||||
{translate('Reddit')}
|
||||
</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://reddit.com/r/prowlarr">r/prowlarr</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>
|
||||
{translate('Discord')}
|
||||
</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://prowlarr.com/discord">prowlarr.com/discord</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>
|
||||
{translate('Source')}
|
||||
</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://github.com/Prowlarr/Prowlarr/">
|
||||
github.com/Prowlarr/Prowlarr
|
||||
</Link>
|
||||
</DescriptionListItemDescription>
|
||||
|
||||
<DescriptionListItemTitle>
|
||||
{translate('FeatureRequests')}
|
||||
</DescriptionListItemTitle>
|
||||
<DescriptionListItemDescription>
|
||||
<Link to="https://github.com/Prowlarr/Prowlarr/issues">
|
||||
github.com/Prowlarr/Prowlarr/issues
|
||||
</Link>
|
||||
</DescriptionListItemDescription>
|
||||
</DescriptionList>
|
||||
</FieldSet>
|
||||
);
|
||||
}
|
||||
|
||||
export default MoreInfo;
|
||||
@@ -1,30 +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 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 />
|
||||
<AboutConnector />
|
||||
<MoreInfo />
|
||||
<Donations />
|
||||
</PageContentBody>
|
||||
</PageContent>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default Status;
|
||||
@@ -0,0 +1,23 @@
|
||||
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 Donations from './Donations/Donations';
|
||||
import Health from './Health/Health';
|
||||
import MoreInfo from './MoreInfo/MoreInfo';
|
||||
|
||||
function Status() {
|
||||
return (
|
||||
<PageContent title={translate('Status')}>
|
||||
<PageContentBody>
|
||||
<Health />
|
||||
<About />
|
||||
<MoreInfo />
|
||||
<Donations />
|
||||
</PageContentBody>
|
||||
</PageContent>
|
||||
);
|
||||
}
|
||||
|
||||
export default Status;
|
||||
Reference in New Issue
Block a user