stream/src/store/index.js

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'
import { colours, defaultTheme } from '../assets/theme'

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 trailer = getResourcesByKey(resources, 'SERIES_TRAILER')?.[0]?.resourceUrl ?? null
      const theme = striptags(getPostByKey(posts, 'THEME'))


      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'),
        trailer,
        links: getResourcesByKey(resources, 'LINK') || [],
        theme: theme ? JSON.parse(theme) : defaultTheme
      }
      return series
    })

    set({ series: allSeries })
  }
}))