import PropTypes from 'prop-types'; import React, { Fragment } from 'react'; import padNumber from 'Utilities/Number/padNumber'; import { icons, kinds, tooltipPositions } from 'Helpers/Props'; import Icon from 'Components/Icon'; import Popover from 'Components/Tooltip/Popover'; import SceneInfo from './SceneInfo'; import styles from './EpisodeNumber.css'; function getAlternateTitles(seasonNumber, sceneSeasonNumber, alternateTitles) { return alternateTitles.filter((alternateTitle) => { if (sceneSeasonNumber && sceneSeasonNumber === alternateTitle.sceneSeasonNumber) { return true; } return seasonNumber === alternateTitle.seasonNumber; }); } function getWarningMessage(unverifiedSceneNumbering, seriesType, absoluteEpisodeNumber) { const messages = []; if (unverifiedSceneNumbering) { messages.push('Scene number hasn\'t been verified yet'); } if (seriesType === 'anime' && !absoluteEpisodeNumber) { messages.push('Episode does not have an absolute episode number'); } return messages.join('\n'); } function EpisodeNumber(props) { const { seasonNumber, episodeNumber, absoluteEpisodeNumber, sceneSeasonNumber, sceneEpisodeNumber, sceneAbsoluteEpisodeNumber, unverifiedSceneNumbering, alternateTitles: seriesAlternateTitles, seriesType, showSeasonNumber } = props; const alternateTitles = getAlternateTitles(seasonNumber, sceneSeasonNumber, seriesAlternateTitles); const hasSceneInformation = sceneSeasonNumber !== undefined || sceneEpisodeNumber !== undefined || (seriesType === 'anime' && sceneAbsoluteEpisodeNumber !== undefined) || !!alternateTitles.length; const warningMessage = getWarningMessage(unverifiedSceneNumbering, seriesType, absoluteEpisodeNumber); return ( { hasSceneInformation ? { showSeasonNumber && seasonNumber != null && {seasonNumber}x } {showSeasonNumber ? padNumber(episodeNumber, 2) : episodeNumber} { seriesType === 'anime' && !!absoluteEpisodeNumber && ({absoluteEpisodeNumber}) } } title="Scene Information" body={ } position={tooltipPositions.RIGHT} /> : { showSeasonNumber && seasonNumber != null && {seasonNumber}x } {showSeasonNumber ? padNumber(episodeNumber, 2) : episodeNumber} { seriesType === 'anime' && !!absoluteEpisodeNumber && ({absoluteEpisodeNumber}) } } { warningMessage ? : null } ); } EpisodeNumber.propTypes = { seasonNumber: PropTypes.number.isRequired, episodeNumber: PropTypes.number.isRequired, absoluteEpisodeNumber: PropTypes.number, sceneSeasonNumber: PropTypes.number, sceneEpisodeNumber: PropTypes.number, sceneAbsoluteEpisodeNumber: PropTypes.number, unverifiedSceneNumbering: PropTypes.bool.isRequired, alternateTitles: PropTypes.arrayOf(PropTypes.object).isRequired, seriesType: PropTypes.string, showSeasonNumber: PropTypes.bool.isRequired }; EpisodeNumber.defaultProps = { unverifiedSceneNumbering: false, alternateTitles: [], showSeasonNumber: false }; export default EpisodeNumber;