FirebaseProvider

Pobiera dane do utworzenia playlist z Firebase Real Time Database.

FirebaseProvider.js
import React, { useState } from 'react';
import { initializeApp } from 'firebase/app';
import { getDatabase, ref, set, remove, child, get } from 'firebase/database';

export const FirebaseContext = React.createContext({
  writePlaylist: () => {},
  getPlaylists: () => {},
  removePlaylist: () => {},
});

const firebaseConfig = {
  apiKey: '',
  authDomain: '',
  databaseURL: '',
  projectId: '',
  storageBucket: '',
  messagingSenderId: '',
  appId: '',
  measurementId: '',
};

const FirebaseProvider = ({ children }) => {
  const [app] = useState(initializeApp(firebaseConfig));
  const [db] = useState(getDatabase(app));

  const getPlaylists = async () => {
    return get(child(ref(db), '/'))
      .then((snapshot) => {
        if (snapshot.exists()) {
          let playlists = [];
          let value = snapshot.val();
          for (const key in value) {
            value[key].day = new Date(value[key].day);
            playlists.push(value[key]);
          }
          return playlists.sort((a, b) => {
            return b.day > a.day ? -1 : a.day > b.day ? 1 : 0;
          });
        } else {
          return [];
        }
      })
      .catch((error) => {
        console.error(error);
      });
  };

  const writePlaylist = (playlist) => {
    const reference = ref(db, '/' + playlist.id);
    set(reference, playlist);
  };

  const removePlaylist = (id) => {
    const reference = ref(db, `/${id}`);
    remove(reference);
  };

  return (
    <FirebaseContext.Provider
      value={{
        writePlaylist,
        getPlaylists,
        removePlaylist,
      }}
    >
      {children}
    </FirebaseContext.Provider>
  );
};

export default FirebaseProvider;

Last updated