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