shpaq/Prowlarr-Prowlarr
1
0
Fork 0
mirror of https://github.com/Prowlarr/Prowlarr.git synced 2025-09-17 17:14:18 +02:00
Code Issues Packages Projects Releases Wiki Activity

Cleanup unused frontend components

Browse Source
This commit is contained in:
Qstick
2021-04-25 10:02:18 -04:00
parent 6dc475cf53
commit 2b6b17707d
110 changed files with 102 additions and 2602 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/Components/Filter/Builder/FilterBuilderRow.js
View File

@@ -7,7 +7,6 @@ import BoolFilterBuilderRowValue from './BoolFilterBuilderRowValue';
import DateFilterBuilderRowValue from './DateFilterBuilderRowValue';
import FilterBuilderRowValueConnector from './FilterBuilderRowValueConnector';
import IndexerFilterBuilderRowValueConnector from './IndexerFilterBuilderRowValueConnector';
import MovieStatusFilterBuilderRowValue from './MovieStatusFilterBuilderRowValue';
import ProtocolFilterBuilderRowValue from './ProtocolFilterBuilderRowValue';
import TagFilterBuilderRowValueConnector from './TagFilterBuilderRowValueConnector';
import styles from './FilterBuilderRow.css';
@@ -60,9 +59,6 @@ function getRowValueConnector(selectedFilterBuilderProp) {
case filterBuilderValueTypes.PROTOCOL:
return ProtocolFilterBuilderRowValue;
case filterBuilderValueTypes.MOVIE_STATUS:
return MovieStatusFilterBuilderRowValue;
case filterBuilderValueTypes.TAG:
return TagFilterBuilderRowValueConnector;

21
frontend/src/Components/Filter/Builder/MovieStatusFilterBuilderRowValue.js
View File

@@ -1,21 +0,0 @@
import React from 'react';
import FilterBuilderRowValue from './FilterBuilderRowValue';
const protocols = [
{ id: 'tba', name: 'TBA' },
{ id: 'announced', name: 'Announced' },
{ id: 'inCinemas', name: 'In Cinemas' },
{ id: 'released', name: 'Released' },
{ id: 'deleted', name: 'Deleted' }
];
function MovieStatusFilterBuilderRowValue(props) {
return (
<FilterBuilderRowValue
tagList={protocols}
{...props}
/>
);
}
export default MovieStatusFilterBuilderRowValue;

4
frontend/src/Components/HeartRating.css
View File

@@ -1,4 +0,0 @@
.heart {
margin-right: 5px;
color: $themeRed;
}

34
frontend/src/Components/HeartRating.js
View File

@@ -1,34 +0,0 @@
import PropTypes from 'prop-types';
import React from 'react';
import Icon from 'Components/Icon';
import { icons } from 'Helpers/Props';
import styles from './HeartRating.css';
function HeartRating({ rating, iconSize, hideHeart }) {
return (
<span>
{
!hideHeart &&
<Icon
className={styles.heart}
name={icons.HEART}
size={iconSize}
/>
}
{rating * 10}%
</span>
);
}
HeartRating.propTypes = {
rating: PropTypes.number.isRequired,
iconSize: PropTypes.number.isRequired,
hideHeart: PropTypes.bool
};
HeartRating.defaultProps = {
iconSize: 14
};
export default HeartRating;

3
frontend/src/Components/ImportListList.css
View File

@@ -1,3 +0,0 @@
.lists {
flex: 1 0 auto;
}

43
frontend/src/Components/ImportListList.js
View File

@@ -1,43 +0,0 @@
import _ from 'lodash';
import PropTypes from 'prop-types';
import React from 'react';
import { kinds, sizes } from 'Helpers/Props';
import Label from './Label';
import styles from './ImportListList.css';
function ImportListList({ lists, importListList }) {
return (
<div className={styles.lists}>
{
lists.map((t) => {
const list = _.find(importListList, { id: t });
if (!list) {
return null;
}
return (
<Label
key={list.id}
kind={kinds.INFO}
size={sizes.MEDIUM}
>
{list.name}
</Label>
);
})
}
</div>
);
}
ImportListList.propTypes = {
lists: PropTypes.arrayOf(PropTypes.number).isRequired,
importListList: PropTypes.arrayOf(PropTypes.object).isRequired
};
ImportListList.defaultProps = {
lists: []
};
export default ImportListList;

17
frontend/src/Components/ImportListListConnector.js
View File

@@ -1,17 +0,0 @@
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import createImportListSelector from 'Store/Selectors/createImportListSelector';
import ImportListList from './ImportListList';
function createMapStateToProps() {
return createSelector(
createImportListSelector(),
(importListList) => {
return {
importListList
};
}
);
}
export default connect(createMapStateToProps)(ImportListList);

181
frontend/src/Components/Marquee.js
View File

@@ -1,181 +0,0 @@
import PropTypes from 'prop-types';
import React, { Component } from 'react';
const FPS = 20;
const STEP = 1;
const TIMEOUT = 1 / FPS * 1000;
class Marquee extends Component {
static propTypes = {
text: PropTypes.string,
title: PropTypes.string,
hoverToStop: PropTypes.bool,
loop: PropTypes.bool,
className: PropTypes.string
};
static defaultProps = {
text: '',
title: '',
hoverToStop: true,
loop: false
};
state = {
animatedWidth: 0,
overflowWidth: 0,
direction: 0
};
componentDidMount() {
this.measureText();
if (this.props.hoverToStop) {
this.startAnimation();
}
}
componentWillReceiveProps(nextProps) {
if (this.props.text.length !== nextProps.text.length) {
clearTimeout(this.marqueeTimer);
this.setState({ animatedWidth: 0, direction: 0 });
}
}
componentDidUpdate() {
this.measureText();
if (this.props.hoverToStop) {
this.startAnimation();
}
}
componentWillUnmount() {
clearTimeout(this.marqueeTimer);
}
onHandleMouseEnter = () => {
if (this.props.hoverToStop) {
clearTimeout(this.marqueeTimer);
} else if (this.state.overflowWidth > 0) {
this.startAnimation();
}
}
onHandleMouseLeave = () => {
if (this.props.hoverToStop && this.state.overflowWidth > 0) {
this.startAnimation();
} else {
clearTimeout(this.marqueeTimer);
this.setState({ animatedWidth: 0 });
}
}
startAnimation = () => {
clearTimeout(this.marqueeTimer);
const isLeading = this.state.animatedWidth === 0;
const timeout = isLeading ? 0 : TIMEOUT;
const animate = () => {
const { overflowWidth } = this.state;
let animatedWidth = this.state.animatedWidth;
let direction = this.state.direction;
if (direction === 0) {
animatedWidth = this.state.animatedWidth + STEP;
} else {
animatedWidth = this.state.animatedWidth - STEP;
}
const isRoundOver = animatedWidth < 0;
const endOfText = animatedWidth > overflowWidth;
if (endOfText) {
direction = direction === 1;
}
if (isRoundOver) {
if (this.props.loop) {
direction = direction === 0;
} else {
return;
}
}
this.setState({ animatedWidth, direction });
this.marqueeTimer = setTimeout(animate, TIMEOUT);
};
this.marqueeTimer = setTimeout(animate, timeout);
}
measureText = () => {
const container = this.container;
const node = this.text;
if (container && node) {
const containerWidth = container.offsetWidth;
const textWidth = node.offsetWidth;
const overflowWidth = textWidth - containerWidth;
if (overflowWidth !== this.state.overflowWidth) {
this.setState({ overflowWidth });
}
}
}
render() {
const style = {
position: 'relative',
right: this.state.animatedWidth,
whiteSpace: 'nowrap'
};
if (this.state.overflowWidth < 0) {
return (
<div
ref={(el) => {
this.container = el;
}}
className={`ui-marquee ${this.props.className}`}
style={{ overflow: 'hidden' }}
>
<span
ref={(el) => {
this.text = el;
}}
style={style}
title={(this.props.title && (this.props.text !== this.props.title)) ? `Original Title: ${this.props.title}` : this.props.text}
>
{this.props.text}
</span>
</div>
);
}
return (
<div
ref={(el) => {
this.container = el;
}}
className={`ui-marquee ${this.props.className}`.trim()}
style={{ overflow: 'hidden' }}
onMouseEnter={this.onHandleMouseEnter}
onMouseLeave={this.onHandleMouseLeave}
>
<span
ref={(el) => {
this.text = el;
}}
style={style}
title={(this.props.title && (this.props.text !== this.props.title)) ? `Original Title: ${this.props.title}` : this.props.text}
>
{this.props.text}
</span>
</div>
);
}
}
export default Marquee;

11
frontend/src/Components/MonitorToggleButton.css
View File

@@ -1,11 +0,0 @@
.toggleButton {
composes: button from '~Components/Link/IconButton.css';
padding: 0;
font-size: inherit;
}
.isDisabled {
color: $disabledColor;
cursor: not-allowed;
}

79
frontend/src/Components/MonitorToggleButton.js
View File

@@ -1,79 +0,0 @@
import classNames from 'classnames';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import SpinnerIconButton from 'Components/Link/SpinnerIconButton';
import { icons } from 'Helpers/Props';
import styles from './MonitorToggleButton.css';
function getTooltip(monitored, isDisabled) {
if (isDisabled) {
return 'Cannot toggle monitored state when movie is unmonitored';
}
if (monitored) {
return 'Monitored, click to unmonitor';
}
return 'Unmonitored, click to monitor';
}
class MonitorToggleButton extends Component {
//
// Listeners
onPress = (event) => {
const shiftKey = event.nativeEvent.shiftKey;
this.props.onPress(!this.props.monitored, { shiftKey });
}
//
// Render
render() {
const {
className,
monitored,
isDisabled,
isSaving,
size,
...otherProps
} = this.props;
const iconName = monitored ? icons.MONITORED : icons.UNMONITORED;
return (
<SpinnerIconButton
className={classNames(
className,
isDisabled && styles.isDisabled
)}
name={iconName}
size={size}
title={getTooltip(monitored, isDisabled)}
isDisabled={isDisabled}
isSpinning={isSaving}
{...otherProps}
onPress={this.onPress}
/>
);
}
}
MonitorToggleButton.propTypes = {
className: PropTypes.string.isRequired,
monitored: PropTypes.bool.isRequired,
size: PropTypes.number,
isDisabled: PropTypes.bool.isRequired,
isSaving: PropTypes.bool.isRequired,
onPress: PropTypes.func.isRequired
};
MonitorToggleButton.defaultProps = {
className: styles.toggleButton,
isDisabled: false,
isSaving: false
};
export default MonitorToggleButton;

0
frontend/src/Components/Page/Header/MovieSearchInput.css → frontend/src/Components/Page/Header/IndexerSearchInput.css
View File

12
frontend/src/Components/Page/Header/MovieSearchInput.js → frontend/src/Components/Page/Header/IndexerSearchInput.js
View File

@@ -6,12 +6,12 @@ import keyboardShortcuts, { shortcuts } from 'Components/keyboardShortcuts';
import LoadingIndicator from 'Components/Loading/LoadingIndicator';
import { icons } from 'Helpers/Props';
import translate from 'Utilities/String/translate';
import MovieSearchResult from './MovieSearchResult';
import styles from './MovieSearchInput.css';
import IndexerSearchResult from './IndexerSearchResult';
import styles from './IndexerSearchInput.css';
const ADD_NEW_TYPE = 'addNew';
class MovieSearchInput extends Component {
class IndexerSearchInput extends Component {
//
// Lifecycle
@@ -86,7 +86,7 @@ class MovieSearchInput extends Component {
}
return (
<MovieSearchResult
<IndexerSearchResult
{...item.item}
match={item.matches[0]}
/>
@@ -239,9 +239,9 @@ class MovieSearchInput extends Component {
}
}
MovieSearchInput.propTypes = {
IndexerSearchInput.propTypes = {
onGoToAddNewMovie: PropTypes.func.isRequired,
bindShortcut: PropTypes.func.isRequired
};
export default keyboardShortcuts(MovieSearchInput);
export default keyboardShortcuts(IndexerSearchInput);

8
frontend/src/Components/Page/Header/MovieSearchInputConnector.js → frontend/src/Components/Page/Header/IndexerSearchInputConnector.js
View File

@@ -5,14 +5,14 @@ import { setSearchDefault } from 'Store/Actions/releaseActions';
import createAllIndexersSelector from 'Store/Selectors/createAllIndexersSelector';
import createDeepEqualSelector from 'Store/Selectors/createDeepEqualSelector';
import createTagsSelector from 'Store/Selectors/createTagsSelector';
import MovieSearchInput from './MovieSearchInput';
import IndexerSearchInput from './IndexerSearchInput';
function createCleanMovieSelector() {
return createSelector(
createAllIndexersSelector(),
createTagsSelector(),
(allMovies, allTags) => {
return allMovies.map((movie) => {
(allIndexers, allTags) => {
return allIndexers.map((movie) => {
const {
name,
titleSlug,
@@ -66,4 +66,4 @@ function createMapDispatchToProps(dispatch, props) {
};
}
export default connect(createMapStateToProps, createMapDispatchToProps)(MovieSearchInput);
export default connect(createMapStateToProps, createMapDispatchToProps)(IndexerSearchInput);

0
frontend/src/Components/Page/Header/MovieSearchResult.css → frontend/src/Components/Page/Header/IndexerSearchResult.css
View File

8
frontend/src/Components/Page/Header/MovieSearchResult.js → frontend/src/Components/Page/Header/IndexerSearchResult.js
View File

@@ -2,9 +2,9 @@ import PropTypes from 'prop-types';
import React from 'react';
import Label from 'Components/Label';
import { kinds } from 'Helpers/Props';
import styles from './MovieSearchResult.css';
import styles from './IndexerSearchResult.css';
function MovieSearchResult(props) {
function IndexerSearchResult(props) {
const {
match,
title,
@@ -54,7 +54,7 @@ function MovieSearchResult(props) {
);
}
MovieSearchResult.propTypes = {
IndexerSearchResult.propTypes = {
title: PropTypes.string.isRequired,
year: PropTypes.number.isRequired,
alternateTitles: PropTypes.arrayOf(PropTypes.object).isRequired,
@@ -62,4 +62,4 @@ MovieSearchResult.propTypes = {
match: PropTypes.object.isRequired
};
export default MovieSearchResult;
export default IndexerSearchResult;

4
frontend/src/Components/Page/Header/PageHeader.js
View File

@@ -5,8 +5,8 @@ import IconButton from 'Components/Link/IconButton';
import Link from 'Components/Link/Link';
import { icons } from 'Helpers/Props';
import translate from 'Utilities/String/translate';
import IndexerSearchInputConnector from './IndexerSearchInputConnector';
import KeyboardShortcutsModal from './KeyboardShortcutsModal';
import MovieSearchInputConnector from './MovieSearchInputConnector';
import PageHeaderActionsMenuConnector from './PageHeaderActionsMenuConnector';
import styles from './PageHeader.css';
@@ -68,7 +68,7 @@ class PageHeader extends Component {
/>
</div>
<MovieSearchInputConnector />
<IndexerSearchInputConnector />
<div className={styles.right}>
<IconButton

10
frontend/src/Components/keyboardShortcuts.js
View File

@@ -37,16 +37,6 @@ export const shortcuts = {
SCROLL_BOTTOM: {
key: 'mod+end',
name: translate('MovieIndexScrollBottom')
},
DETAILS_NEXT: {
key: '→',
name: translate('MovieDetailsNextMovie')
},
DETAILS_PREVIOUS: {
key: '←',
name: translate('MovieDetailsPreviousMovie')
}
};