You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 lines
2.5 KiB
105 lines
2.5 KiB
7 years ago
|
import PropTypes from 'prop-types';
|
||
|
import React from 'react';
|
||
|
import DescriptionList from 'Components/DescriptionList/DescriptionList';
|
||
|
import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
|
||
|
import styles from './ArtistIndexFooter.css';
|
||
|
|
||
|
function ArtistIndexFooter({ series }) {
|
||
|
const count = series.length;
|
||
|
let episodes = 0;
|
||
|
let episodeFiles = 0;
|
||
|
let ended = 0;
|
||
|
let continuing = 0;
|
||
|
let monitored = 0;
|
||
|
|
||
|
series.forEach((s) => {
|
||
|
episodes += s.trackCount || 0;
|
||
|
episodeFiles += s.trackFileCount || 0;
|
||
|
|
||
|
if (s.status === 'ended') {
|
||
|
ended++;
|
||
|
} else {
|
||
|
continuing++;
|
||
|
}
|
||
|
|
||
|
if (s.monitored) {
|
||
|
monitored++;
|
||
|
}
|
||
|
});
|
||
|
|
||
|
return (
|
||
|
<div className={styles.footer}>
|
||
|
<div>
|
||
|
<div className={styles.legendItem}>
|
||
|
<div className={styles.continuing}></div>
|
||
|
<div>Continuing (All tracks downloaded)</div>
|
||
|
</div>
|
||
|
|
||
|
<div className={styles.legendItem}>
|
||
|
<div className={styles.ended}></div>
|
||
|
<div>Ended (All tracks downloaded)</div>
|
||
|
</div>
|
||
|
|
||
|
<div className={styles.legendItem}>
|
||
|
<div className={styles.missingMonitored}></div>
|
||
|
<div>Missing Tracks (Artist monitored)</div>
|
||
|
</div>
|
||
|
|
||
|
<div className={styles.legendItem}>
|
||
|
<div className={styles.missingUnmonitored}></div>
|
||
|
<div>Missing Tracks (Artist not monitored)</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div className={styles.statistics}>
|
||
|
<DescriptionList>
|
||
|
<DescriptionListItem
|
||
|
title="Artist"
|
||
|
data={count}
|
||
|
/>
|
||
|
|
||
|
<DescriptionListItem
|
||
|
title="Ended"
|
||
|
data={ended}
|
||
|
/>
|
||
|
|
||
|
<DescriptionListItem
|
||
|
title="Continuing"
|
||
|
data={continuing}
|
||
|
/>
|
||
|
</DescriptionList>
|
||
|
|
||
|
<DescriptionList>
|
||
|
<DescriptionListItem
|
||
|
title="Monitored"
|
||
|
data={monitored}
|
||
|
/>
|
||
|
|
||
|
<DescriptionListItem
|
||
|
title="Unmonitored"
|
||
|
data={count - monitored}
|
||
|
/>
|
||
|
</DescriptionList>
|
||
|
|
||
|
<DescriptionList>
|
||
|
<DescriptionListItem
|
||
|
title="Tracks"
|
||
|
data={episodes}
|
||
|
/>
|
||
|
|
||
|
<DescriptionListItem
|
||
|
title="Files"
|
||
|
data={episodeFiles}
|
||
|
/>
|
||
|
</DescriptionList>
|
||
|
</div>
|
||
|
</div>
|
||
|
);
|
||
|
}
|
||
|
|
||
|
ArtistIndexFooter.propTypes = {
|
||
|
series: PropTypes.arrayOf(PropTypes.object).isRequired
|
||
|
};
|
||
|
|
||
|
export default ArtistIndexFooter;
|