61 lines
1.8 KiB
JavaScript

import React from "react"
import PropTypes from "prop-types"
import { List } from "immutable"
import Dropdown from "react-bootstrap/Dropdown"
export const SubtitlesButton = ({
subtitles,
inLibrary,
searching,
search,
}) => {
if (inLibrary === false) { return null }
const count = (subtitles && subtitles.size !== 0) ? subtitles.size : 0;
return (
<span className="mr-1 mb-1">
<Dropdown drop="up">
<Dropdown.Toggle variant="success">
<i className="fa fa-language mr-1" />
Subtitles
<span className="ml-1 badge badge-pill badge-light">
{count}
</span>
</Dropdown.Toggle>
<Dropdown.Menu>
<Dropdown.Header>
<span className="text-warning">Advanced</span>
</Dropdown.Header>
<Dropdown.Item onClick={search} >
<i className={`fa ${ searching ? "fa-spin" : "" } fa-refresh mr-1`} />
Automatic search
</Dropdown.Item>
{count > 0 &&
<React.Fragment>
<Dropdown.Divider />
<Dropdown.Header>
<span className="text-warning">
Available subtitles
</span>
</Dropdown.Header>
</React.Fragment>
}
{count > 0 && subtitles.toIndexedSeq().map((subtitle, index) => (
<Dropdown.Item href={subtitle.get("url")} key={index}>
{subtitle.get("language").split("_")[1]}
</Dropdown.Item>
))}
</Dropdown.Menu>
</Dropdown>
</span>
);
}
SubtitlesButton.propTypes = {
subtitles: PropTypes.instanceOf(List),
inLibrary: PropTypes.bool.isRequired,
searching: PropTypes.bool.isRequired,
search: PropTypes.func.isRequired,
}