added store and some helpers to parse series data

This commit is contained in:
Sunda 2021-10-11 19:14:55 +02:00
parent 7c63f7538c
commit 3cab6fb683
4 changed files with 80 additions and 9 deletions

View File

@ -27,7 +27,8 @@
"prop-types": "^15.7.2", "prop-types": "^15.7.2",
"react-router-dom": "^5.3.0", "react-router-dom": "^5.3.0",
"striptags": "^3.2.0", "striptags": "^3.2.0",
"styled-components": "^5.2.1" "styled-components": "^5.2.1",
"zustand": "^3.5.13"
}, },
"devDependencies": { "devDependencies": {
"@babel/eslint-parser": "^7.13.10", "@babel/eslint-parser": "^7.13.10",

View File

@ -2,6 +2,7 @@ import { useEffect, useState } from 'preact/hooks'
import axios from 'axios' import axios from 'axios'
import ICAL from 'ical.js' import ICAL from 'ical.js'
import config from '../data/config' import config from '../data/config'
import { useSeriesStore } from '../store/index'
export const useEventCalendar = () => { export const useEventCalendar = () => {
const [data, setData] = useState([]) const [data, setData] = useState([])
@ -97,24 +98,27 @@ export const useEventCalendar = () => {
export const useEventApi = () => { export const useEventApi = () => {
const [data, setData] = useState([]) const [series, setSeries] = useSeriesStore(store => [store.series, store.setSeries])
const [loading, setLoading] = useState(true) const [loading, setLoading] = useState(true)
async function fetchData() { async function fetchData() {
if (!series.length) {
setLoading(true) setLoading(true)
const { data: responseData } = await axios.get( const { data: responseData } = await axios.get(
`${config.EVENTS_API_URL}/events` `${config.EVENTS_API_URL}/events`
) )
setData(responseData) setSeries(responseData)
setLoading(false) setLoading(false)
} }
}
useEffect(() => { useEffect(() => {
fetchData() fetchData()
}, []) }, [])
return { loading, data } return { loading, data: series }
} }

23
src/store/helpers.js Normal file
View File

@ -0,0 +1,23 @@
export const getMetadataByKey = (episode, key) => {
const filteredItems = episode.metadata.length ? episode.metadata.filter(
meta => meta.key === key
) : null
if (filteredItems) {
return filteredItems[0].value
}
return null
}
export const getPostByKey = (posts, key) => {
const filteredPostItems = posts.elements.length ? posts.elements.filter(post => post.title === key) : []
return filteredPostItems.length ? filteredPostItems[0].body : null
}
export const getResourcesByKey = (resources, key) => {
const filteredResources = resources.elements.length ? resources.elements.filter(resource => resource.title === key) : []
return filteredResources.length ? filteredResources[0].resourceUrl : null
}
export const getPeertubeIDfromUrl = (string) => string && string.includes('https://tv.undersco.re') ? string.split('/').pop() : string

43
src/store/index.js Normal file
View File

@ -0,0 +1,43 @@
import create from 'zustand'
import striptags from 'striptags'
import { isFuture, isPast } from 'date-fns'
import { slugify } from '../helpers/string'
import { getMetadataByKey, getPostByKey, getResourcesByKey, getPeertubeIDfromUrl } from './helpers'
export const [useSeriesStore] = create(set => ({
series: [],
setSeries: seriesArray => {
const allSeries = seriesArray.map(({ name, organizedEvents, posts, resources, banner, summary }) => {
const allEpisodes = organizedEvents.elements.length ? organizedEvents.elements.map(ep => ({
title: ep.title,
beginsOn: ep.beginsOn,
endsOn: ep.endsOn,
description: ep.description,
media: ep.media,
image: ep.picture ? ep.picture.url : null,
peertubeId: getPeertubeIDfromUrl(getMetadataByKey(ep, 'mz:live:peertube:url')),
})) : []
const series = {
title: name,
subtitle: striptags(summary),
description: getPostByKey(posts, 'SERIES_INFO'),
posts: posts.elements,
resources: resources.elements,
image: banner ? banner.url : '',
episodes: {
future: allEpisodes.filter(ep => isFuture(new Date(ep.endsOn))).sort((a, b) => new Date(a.beginsOn) - new Date(b.beginsOn)),
past: allEpisodes.filter(ep => isPast(new Date(ep.endsOn))).sort((a, b) => new Date(a.beginsOn) - new Date(b.beginsOn))
},
slug: slugify(name),
credits: getPostByKey(posts, 'SERIES_CREDITS'),
trailerId: getPeertubeIDfromUrl(getResourcesByKey(resources, 'SERIES_TRAILER'))
}
return series
})
set({ series: allSeries })
}
}))