diff --git a/src/components/SeriesCard/index.js b/src/components/SeriesCard/index.js index f39d276..6445544 100644 --- a/src/components/SeriesCard/index.js +++ b/src/components/SeriesCard/index.js @@ -7,15 +7,32 @@ import { Img, LabelBlock, Wrapper } from './styles' import { andList } from '../../helpers/string' import { colours } from '../../assets/theme' -const SeriesCard = ({ series: { image, episodes, title, subtitle, hosts: hostsArray, slug, }, isPast, ...rest }) => { +const SeriesCard = ({ + series: { image, episodes, title, subtitle, hosts: hostsArray, slug }, + isPast, + ...rest +}) => { const hosts = hostsArray.map(({ actor }) => actor.name) const episodesLength = episodes.past.length + episodes.future.length const getNextLastStreamText = () => { const hasFutureEpisodes = episodes.future.length - const prefix = hasFutureEpisodes ? strings.en.nextStream : strings.en.lastStream - const mainText = formatDistanceToNow(new Date(episodes[hasFutureEpisodes ? 'future' : 'past'][0][hasFutureEpisodes ? 'endsOn' : 'beginsOn']), { addSuffix: true }) + const prefix = hasFutureEpisodes + ? strings.en.nextStream + : strings.en.lastStream + + console.log({ el1: episodes }) + + const episodesList = episodes[hasFutureEpisodes ? 'future' : 'past'] + const mainText = formatDistanceToNow( + new Date( + episodesList[hasFutureEpisodes ? 0 : episodesList.length - 1][ + hasFutureEpisodes ? 'endsOn' : 'beginsOn' + ] + ), + { addSuffix: true } + ) return `${prefix} ${mainText}` } @@ -24,21 +41,24 @@ const SeriesCard = ({ series: { image, episodes, title, subtitle, hosts: hostsAr - - {episodesLength} {episodesLength === 1 ? strings.en.episode : strings.en.episodes} - - - {getNextLastStreamText()} + + {episodesLength}{' '} + {episodesLength === 1 ? strings.en.episode : strings.en.episodes} + {getNextLastStreamText()} -

{title}

-

{subtitle}

- {hosts.length ? : null} +

+ {title} +

+

+ {subtitle} +

+ {hosts.length ? ( + + ) : null}
) diff --git a/src/components/Video/index.js b/src/components/Video/index.js index 6580edc..47e2ecd 100644 --- a/src/components/Video/index.js +++ b/src/components/Video/index.js @@ -1,13 +1,7 @@ import { h } from 'preact' import { useEffect, useRef, useState } from 'preact/hooks' -import { - instanceOf, - number, - object, - shape, - string, -} from 'prop-types' -import 'regenerator-runtime/runtime' +import { instanceOf, number, object, shape, string } from 'prop-types' + import { PeerTubePlayer } from '@peertube/embed-api' import Chat from '../Chat' @@ -57,7 +51,6 @@ const Video = () => { setVideo() }, []) - const playVideo = () => { const { current: player } = ptVideo if (!videoReady) return @@ -84,7 +77,6 @@ const Video = () => { } } - const toggleVideo = () => { if (isPlaying) { pauseVideo() @@ -125,7 +117,6 @@ const Video = () => { console.log({ vol }) } - const handleKeyPress = keyCode => { if (keyCode === 32) { // key == 'space' diff --git a/src/hooks/data.js b/src/hooks/data.js index 2bd442c..b2105dd 100644 --- a/src/hooks/data.js +++ b/src/hooks/data.js @@ -1,12 +1,13 @@ -import { h, render } from 'preact' +import { h } from 'preact' import { useEffect, useState } from 'preact/hooks' +// eslint-disable-next-line import/no-extraneous-dependencies + +import { secondsToMilliseconds } from 'date-fns' import axios from 'axios' import ICAL from 'ical.js' import config from '../data/config' import { useSeriesStore, useStreamStore } from '../store/index' -import 'regenerator-runtime/runtime' import { useInterval } from './timerHooks' -import { secondsToMilliseconds } from 'date-fns' export const useEventCalendar = () => { const [data, setData] = useState([]) @@ -29,7 +30,7 @@ export const useEventCalendar = () => { vevent.getFirstPropertyValue('status') === null || (vevent.getFirstPropertyValue('status') && vevent.getFirstPropertyValue('status').toUpperCase() === - 'CONFIRMED') + 'CONFIRMED') ) .map(vevent => { const event = new ICAL.Event(vevent) @@ -99,10 +100,11 @@ export const useEventCalendar = () => { return { loading, data } } - - export const useEventApi = () => { - const [data, setData] = useSeriesStore(store => [store.series, store.setSeries]) + const [data, setData] = useSeriesStore(store => [ + store.series, + store.setSeries, + ]) const [error, setError] = useState(null) const [loading, setLoading] = useState(!!data.length) @@ -111,15 +113,14 @@ export const useEventApi = () => { setLoading(true) try { - const { data: responseData } = await axios.get( `${config.EVENTS_API_URL}/events` ) + console.log({ responseData }) setData(responseData) console.log({ data: responseData }) setLoading(false) - } - catch (err) { + } catch (err) { console.log('ERROR') setError(err) setLoading(false) @@ -135,7 +136,12 @@ export const useEventApi = () => { } export const usePeertubeApi = async () => { - const { currentStream, setCurrentStream, setStreamIsLive, streamIsLive } = useStreamStore(store => store) + const { + currentStream, + setCurrentStream, + setStreamIsLive, + streamIsLive, + } = useStreamStore(store => store) if (!currentStream) return @@ -143,10 +149,11 @@ export const usePeertubeApi = async () => { const { peertubeLive } = currentStream if (!peertubeLive || !peertubeLive.id) return - const { - data: { state, embedPath } - } = await axios.get(`https://tv.undersco.re/api/v1/videos/${peertubeLive.id}`) + data: { state, embedPath }, + } = await axios.get( + `https://tv.undersco.re/api/v1/videos/${peertubeLive.id}` + ) setStreamIsLive(state.id === 1) setCurrentStream({ ...currentStream, embedPath }) @@ -156,7 +163,10 @@ export const usePeertubeApi = async () => { fetchData() }, []) - useInterval(() => { - fetchData() - }, streamIsLive ? secondsToMilliseconds(15) : secondsToMilliseconds(1)) -} \ No newline at end of file + useInterval( + () => { + fetchData() + }, + streamIsLive ? secondsToMilliseconds(15) : secondsToMilliseconds(1) + ) +}