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.
42 lines
853 B
42 lines
853 B
import map from 'lodash/map'
|
|
|
|
import {
|
|
LoadedProgress,
|
|
PlayedProgress,
|
|
} from 'features/StreamPlayer/components/ProgressBar/styled'
|
|
|
|
import type { Chapter } from '../../types'
|
|
import {
|
|
ChapterList,
|
|
ChapterContainer,
|
|
} from './styled'
|
|
|
|
type ChapterWithStyles = Chapter & {
|
|
loaded: number,
|
|
played: number,
|
|
width: number,
|
|
}
|
|
|
|
type Props = {
|
|
chapters: Array<ChapterWithStyles>,
|
|
}
|
|
|
|
export const Chapters = ({ chapters }: Props) => (
|
|
<ChapterList>
|
|
{
|
|
map(
|
|
chapters,
|
|
({
|
|
loaded,
|
|
played,
|
|
width,
|
|
}, index) => (
|
|
<ChapterContainer key={index} style={{ width: `${width}%` }}>
|
|
<LoadedProgress style={{ width: `${loaded}%` }} />
|
|
<PlayedProgress style={{ width: `${played}%` }} />
|
|
</ChapterContainer>
|
|
),
|
|
)
|
|
}
|
|
</ChapterList>
|
|
)
|
|
|