From 6462f327c9203b5f9daeb7ee21deca95c871559c Mon Sep 17 00:00:00 2001
From: sunda <>
Date: Fri, 6 May 2022 15:10:53 +0200
Subject: [PATCH] fix 'last stream' message on series card
---
src/components/SeriesCard/index.js | 50 +++++++++++++++++++++---------
src/components/Video/index.js | 13 ++------
src/hooks/data.js | 46 ++++++++++++++++-----------
3 files changed, 65 insertions(+), 44 deletions(-)
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)
+ )
+}