Backup_Repos/Radarr
1
0
Fork 0
mirror of https://github.com/Radarr/Radarr synced 2026-01-03 22:25:00 +01:00
Code Issues Projects Releases Wiki Activity

Convert RelativeDateCell to TypeScript

Browse source 
(cherry picked from commit 824ed0a36931ce7aae9aa544a7baf0738dae568c)
This commit is contained in:
Mark McDowall 2024-07-19 20:42:59 -07:00 committed by Bogdan
parent 6e81d5917e
commit fa80608394
16 changed files with 93 additions and 125 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/Activity/Blocklist/BlocklistRow.js
View file

@ -1,7 +1,7 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import IconButton from 'Components/Link/IconButton';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
import TableRow from 'Components/Table/TableRow';
@ -136,7 +136,7 @@ class BlocklistRow extends Component {
if (name === 'date') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
date={date}
/>

4
frontend/src/Activity/History/HistoryRow.js
View file

@ -1,7 +1,7 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import IconButton from 'Components/Link/IconButton';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import Tooltip from 'Components/Tooltip/Tooltip';
@ -143,7 +143,7 @@ class HistoryRow extends Component {
if (name === 'date') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
date={date}
/>

4
frontend/src/Activity/Queue/QueueRow.js
View file

@ -4,7 +4,7 @@ import ProtocolLabel from 'Activity/Queue/ProtocolLabel';
import IconButton from 'Components/Link/IconButton';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import ProgressBar from 'Components/ProgressBar';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
import TableRow from 'Components/Table/TableRow';
@ -319,7 +319,7 @@ class QueueRow extends Component {
if (name === 'added') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
date={added}
/>

69
frontend/src/Components/Table/Cells/RelativeDateCell.js
View file

@ -1,69 +0,0 @@
import PropTypes from 'prop-types';
import React, { PureComponent } from 'react';
import formatDateTime from 'Utilities/Date/formatDateTime';
import getRelativeDate from 'Utilities/Date/getRelativeDate';
import TableRowCell from './TableRowCell';
import styles from './RelativeDateCell.css';
class RelativeDateCell extends PureComponent {
//
// Render
render() {
const {
className,
date,
includeSeconds,
includeTime,
showRelativeDates,
shortDateFormat,
longDateFormat,
timeFormat,
component: Component,
dispatch,
...otherProps
} = this.props;
if (!date) {
return (
<Component
className={className}
{...otherProps}
/>
);
}
return (
<Component
className={className}
title={formatDateTime(date, longDateFormat, timeFormat, { includeSeconds, includeRelativeDay: !showRelativeDates })}
{...otherProps}
>
{getRelativeDate({ date, shortDateFormat, showRelativeDates, timeFormat, includeSeconds, includeTime, timeForToday: true })}
</Component>
);
}
}
RelativeDateCell.propTypes = {
className: PropTypes.string.isRequired,
date: PropTypes.string,
includeSeconds: PropTypes.bool.isRequired,
includeTime: PropTypes.bool.isRequired,
showRelativeDates: PropTypes.bool.isRequired,
shortDateFormat: PropTypes.string.isRequired,
longDateFormat: PropTypes.string.isRequired,
timeFormat: PropTypes.string.isRequired,
component: PropTypes.elementType,
dispatch: PropTypes.func
};
RelativeDateCell.defaultProps = {
className: styles.cell,
includeSeconds: false,
includeTime: false,
component: TableRowCell
};
export default RelativeDateCell;

57
frontend/src/Components/Table/Cells/RelativeDateCell.tsx Normal file
View file

@ -0,0 +1,57 @@
import React from 'react';
import { useSelector } from 'react-redux';
import createUISettingsSelector from 'Store/Selectors/createUISettingsSelector';
import formatDateTime from 'Utilities/Date/formatDateTime';
import getRelativeDate from 'Utilities/Date/getRelativeDate';
import TableRowCell from './TableRowCell';
import styles from './RelativeDateCell.css';
interface RelativeDateCellProps {
className?: string;
date?: string;
includeSeconds?: boolean;
includeTime?: boolean;
component?: React.ElementType;
}
function RelativeDateCell(props: RelativeDateCellProps) {
const {
className = styles.cell,
date,
includeSeconds = false,
includeTime = false,
component: Component = TableRowCell,
...otherProps
} = props;
const { showRelativeDates, shortDateFormat, longDateFormat, timeFormat } =
useSelector(createUISettingsSelector());
if (!date) {
return <Component className={className} {...otherProps} />;
}
return (
<Component
className={className}
title={formatDateTime(date, longDateFormat, timeFormat, {
includeSeconds,
includeRelativeDay: !showRelativeDates,
})}
{...otherProps}
>
{getRelativeDate({
date,
shortDateFormat,
showRelativeDates,
timeFormat,
includeSeconds,
includeTime,
timeForToday: true,
})}
</Component>
);
}
export default RelativeDateCell;

20
frontend/src/Components/Table/Cells/RelativeDateCellConnector.js
View file

@ -1,20 +0,0 @@
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import createUISettingsSelector from 'Store/Selectors/createUISettingsSelector';
import RelativeDateCell from './RelativeDateCell';
function createMapStateToProps() {
return createSelector(
createUISettingsSelector(),
(uiSettings) => {
return {
showRelativeDates: uiSettings.showRelativeDates,
shortDateFormat: uiSettings.shortDateFormat,
longDateFormat: uiSettings.longDateFormat,
timeFormat: uiSettings.timeFormat
};
}
);
}
export default connect(createMapStateToProps, null)(RelativeDateCell);

8
frontend/src/DiscoverMovie/Table/DiscoverMovieRow.js
View file

@ -6,7 +6,7 @@ import ImportListListConnector from 'Components/ImportListListConnector';
import IconButton from 'Components/Link/IconButton';
import Link from 'Components/Link/Link';
import RottenTomatoRating from 'Components/RottenTomatoRating';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import VirtualTableRowCell from 'Components/Table/Cells/VirtualTableRowCell';
import VirtualTableSelectCell from 'Components/Table/Cells/VirtualTableSelectCell';
import TmdbRating from 'Components/TmdbRating';
@ -198,7 +198,7 @@ class DiscoverMovieRow extends Component {
if (name === 'inCinemas') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={inCinemas}
@ -209,7 +209,7 @@ class DiscoverMovieRow extends Component {
if (name === 'physicalRelease') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={physicalRelease}
@ -220,7 +220,7 @@ class DiscoverMovieRow extends Component {
if (name === 'digitalRelease') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={digitalRelease}

4
frontend/src/InteractiveImport/Folder/RecentFolderRow.js
View file

@ -1,7 +1,7 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import IconButton from 'Components/Link/IconButton';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRowButton from 'Components/Table/TableRowButton';
import { icons } from 'Helpers/Props';
@ -41,7 +41,7 @@ class RecentFolderRow extends Component {
<TableRowButton onPress={this.onPress}>
<TableRowCell>{folder}</TableRowCell>
<RelativeDateCellConnector date={lastUsed} />
<RelativeDateCell date={lastUsed} />
<TableRowCell className={styles.actions}>
<IconButton

4
frontend/src/Movie/History/MovieHistoryRow.js
View file

@ -4,7 +4,7 @@ import HistoryDetailsModal from 'Activity/History/Details/HistoryDetailsModal';
import HistoryEventTypeCell from 'Activity/History/HistoryEventTypeCell';
import IconButton from 'Components/Link/IconButton';
import ConfirmModal from 'Components/Modal/ConfirmModal';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import { icons, kinds } from 'Helpers/Props';
@ -109,7 +109,7 @@ class MovieHistoryRow extends Component {
{formatCustomFormatScore(customFormatScore, customFormats.length)}
</TableRowCell>
<RelativeDateCellConnector
<RelativeDateCell
date={date}
includeSeconds={true}
includeTime={true}

12
frontend/src/Movie/Index/Table/MovieIndexRow.tsx
View file

@ -7,7 +7,7 @@ import ImdbRating from 'Components/ImdbRating';
import IconButton from 'Components/Link/IconButton';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import RottenTomatoRating from 'Components/RottenTomatoRating';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import VirtualTableRowCell from 'Components/Table/Cells/VirtualTableRowCell';
import VirtualTableSelectCell from 'Components/Table/Cells/VirtualTableSelectCell';
import Column from 'Components/Table/Column';
@ -223,7 +223,7 @@ function MovieIndexRow(props: MovieIndexRowProps) {
return (
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore ts(2739)
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={added}
@ -244,7 +244,7 @@ function MovieIndexRow(props: MovieIndexRowProps) {
return (
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore ts(2739)
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={inCinemas}
@ -257,7 +257,7 @@ function MovieIndexRow(props: MovieIndexRowProps) {
return (
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore ts(2739)
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={digitalRelease}
@ -270,7 +270,7 @@ function MovieIndexRow(props: MovieIndexRowProps) {
return (
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore ts(2739)
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={physicalRelease}
@ -283,7 +283,7 @@ function MovieIndexRow(props: MovieIndexRowProps) {
return (
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore ts(2739)
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={releaseDate}

4
frontend/src/MovieFile/Editor/MovieFileEditorRow.js
View file

@ -3,7 +3,7 @@ import React, { Component } from 'react';
import Icon from 'Components/Icon';
import IconButton from 'Components/Link/IconButton';
import ConfirmModal from 'Components/Modal/ConfirmModal';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import Popover from 'Components/Tooltip/Popover';
@ -313,7 +313,7 @@ class MovieFileEditorRow extends Component {
if (name === 'dateAdded') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles.dateAdded}
date={dateAdded}

4
frontend/src/System/Backup/BackupRow.js
View file

@ -4,7 +4,7 @@ import Icon from 'Components/Icon';
import IconButton from 'Components/Link/IconButton';
import Link from 'Components/Link/Link';
import ConfirmModal from 'Components/Modal/ConfirmModal';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import { icons, kinds } from 'Helpers/Props';
@ -110,7 +110,7 @@ class BackupRow extends Component {
{formatBytes(size)}
</TableRowCell>
<RelativeDateCellConnector
<RelativeDateCell
date={time}
/>

4
frontend/src/System/Events/LogsTableRow.js
View file

@ -1,7 +1,7 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import Icon from 'Components/Icon';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRowButton from 'Components/Table/TableRowButton';
import { icons } from 'Helpers/Props';
@ -98,7 +98,7 @@ class LogsTableRow extends Component {
if (name === 'time') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
date={time}
/>

4
frontend/src/System/Logs/Files/LogFilesTableRow.js
View file

@ -1,7 +1,7 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import Link from 'Components/Link/Link';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import translate from 'Utilities/String/translate';
@ -23,7 +23,7 @@ class LogFilesTableRow extends Component {
<TableRow>
<TableRowCell>{filename}</TableRowCell>
<RelativeDateCellConnector
<RelativeDateCell
date={lastWriteTime}
/>

8
frontend/src/Wanted/CutoffUnmet/CutoffUnmetRow.js
View file

@ -1,6 +1,6 @@
import PropTypes from 'prop-types';
import React from 'react';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
import TableRow from 'Components/Table/TableRow';
@ -66,7 +66,7 @@ function CutoffUnmetRow(props) {
if (name === 'movieMetadata.inCinemas') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={inCinemas}
@ -76,7 +76,7 @@ function CutoffUnmetRow(props) {
if (name === 'movieMetadata.digitalRelease') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={digitalRelease}
@ -86,7 +86,7 @@ function CutoffUnmetRow(props) {
if (name === 'movieMetadata.physicalRelease') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={physicalRelease}

8
frontend/src/Wanted/Missing/MissingRow.js
View file

@ -1,6 +1,6 @@
import PropTypes from 'prop-types';
import React from 'react';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import RelativeDateCell from 'Components/Table/Cells/RelativeDateCell';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
import TableRow from 'Components/Table/TableRow';
@ -69,7 +69,7 @@ function MissingRow(props) {
if (name === 'movieMetadata.inCinemas') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={inCinemas}
@ -79,7 +79,7 @@ function MissingRow(props) {
if (name === 'movieMetadata.digitalRelease') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={digitalRelease}
@ -89,7 +89,7 @@ function MissingRow(props) {
if (name === 'movieMetadata.physicalRelease') {
return (
<RelativeDateCellConnector
<RelativeDateCell
key={name}
className={styles[name]}
date={physicalRelease}