PlaylistProvider

Zarządza stanem playlist

PlaylistProvider.js
import React, { useState, useEffect, useContext } from 'react';
import { v4 as uuidv4 } from 'uuid';
import { FirebaseContext } from './FirebaseProvider';
import { ContentContext } from './ContentProvider';
import { NotificationContext } from './NotificationProvider';

export const PlaylistContext = React.createContext({
  addText: () => {},
  deleteText: () => {},
  savePlaylist: () => {},
  deletePlaylist: () => {},
  setSelectedContent: () => {},
  setIsPlaylistUpdated: () => {},
  setUpdatedPlaylist: () => {},
  selectedContent: [],
  playlists: [],
  isPlaylistUpdated: [],
  updatedPlaylist: {},
});

const PlaylistProvider = ({ children }) => {
  const { getPlaylists, writePlaylist, removePlaylist } = useContext(FirebaseContext);
  const { contentType } = useContext(ContentContext);
  const { openNotification } = useContext(NotificationContext);
  const [selectedContent, setSelectedContent] = useState([]);
  const [playlists, setPlaylists] = useState([]);
  const [isPlaylistUpdated, setIsPlaylistUpdated] = useState(false);
  const [updatedPlaylist, setUpdatedPlaylist] = useState({});

  // Get playlists
  useEffect(() => {
    getPlaylists().then((value) => {
      setPlaylists(value);
    });
    // eslint-disable-next-line
  }, []);

  const modifyId = (id) => {
    return contentType === 'songs' ? `song__${id.toString()}` : `pray__${id.toString()}`;
  };

  // Add text to list of selected texts
  const addText = ({ content, id, name }) => {
    id = modifyId(id);
    if (selectedContent.filter((text) => text.id === id).length)
      openNotification('Ten utwór został już wybrany');
    else setSelectedContent([...selectedContent, { content, id, name }]);
  };

  // Delete text from list of selected texts
  const deleteText = (id) => {
    const filteredContent = selectedContent.filter((text) => text.id !== id);
    setSelectedContent(filteredContent);
  };

  // Save playlist
  const savePlaylist = (day, expiration) => {
    let filteredPlaylists = isPlaylistUpdated
      ? playlists.filter((playlist) => playlist.id !== updatedPlaylist.id)
      : playlists;

    let newPlaylist = {
      id: isPlaylistUpdated ? updatedPlaylist.id : uuidv4(),
      playlist: selectedContent.map((text) => text.id),
      day: day,
      expiration,
    };

    let currentPlaylists = [...filteredPlaylists, newPlaylist];

    setPlaylists(currentPlaylists);
    writePlaylist(JSON.parse(JSON.stringify(newPlaylist)));
    setSelectedContent([]);
    setTimeout(() => {
      isPlaylistUpdated
        ? openNotification('Zmiany zostały zapisane')
        : openNotification('Playlista została zapisana');
    }, 100);
    setIsPlaylistUpdated(false);
  };

  // Delete playlist
  const deletePlaylist = (id) => {
    const filteredPlaylists = playlists.filter((playlist) => playlist.id !== id);
    setPlaylists(filteredPlaylists);
    removePlaylist(id);
  };

  return (
    <PlaylistContext.Provider
      value={{
        addText,
        deleteText,
        savePlaylist,
        deletePlaylist,
        setSelectedContent,
        setIsPlaylistUpdated,
        setUpdatedPlaylist,
        selectedContent,
        playlists,
        isPlaylistUpdated,
        updatedPlaylist,
      }}
    >
      {children}
    </PlaylistContext.Provider>
  );
};

export default PlaylistProvider;

Last updated