Parafia Skoczów
  • 👋Witaj w Parafii Skoczów
  • O APLIKACJI
    • ✨Funkcjonalności
    • 📷Galeria
    • 🛠️Zarządzanie treściami
  • DLA PROGRAMISTÓW
    • 🏗️Przegląd narzędzi
    • ⛪Parafia Skoczów
      • Assets
      • Components
        • Atoms
        • Molecules
        • Organisms
        • Templates
      • Helpers
        • getAnimationProps
        • getData
        • getTransmissionUrl
        • searchContent
        • useModal
      • Hooks
        • useDisablePinchZoom
        • usePinching
        • useSwipe
      • Providers
        • ContentProvider
        • FirebaseProvider
        • PlaylistProvider
      • Utils
      • Views
        • Home
        • Categories
        • Titles
        • Text
        • Playlist
        • Search
      • Cordova
      • Rozwiązywanie problemów
    • 🎶Playlist Maker
      • Assets
      • Components
        • Atoms
        • Molecules
        • Organisms
        • Templates
      • Helpers
      • Hooks
        • useDnd
        • useEdit
        • useName
        • useModal
      • Providers
        • ContentProvider
        • FirebaseProvider
        • NotificationProvider
        • PlaylistProvider
      • Utils
      • Cordova
      • Rozwiązywanie problemów
Powered by GitBook
On this page
  1. DLA PROGRAMISTÓW
  2. Playlist Maker
  3. Providers

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;
PreviousNotificationProviderNextUtils

Last updated 1 year ago

🎶