JAVASCRIPT

context

A complete set of OpenGL state variables. Note that framebuffer contents are not part of the OpenGL state, but that the configuration of the framebuffer is.

context

import { useContext, createContext, useReducer } from 'react'

export const StateContext = createContext()

export const StateProvider = ({ reducer, initialState, children }) => {
  return (
    <StateContext.Provider value={useReducer(reducer, initialState)}>
      {children}
    </StateContext.Provider>
  )
}

export const useStateValue = () => useContext(StateContext)

context

export const actionType = {
  SET_USER: 'SET_USER',
}

const reducer = (state, action) => {
  console.log(action)

  switch (action.type) {
    case actionType.SET_USER:
      return {
        ...state,
        user: action.user,
      }
    default:
      return state
  }
}

export default reducer

context

export const initialState = {
  user: null,
  searchTerm: '',
  filterTerm: 'all',
  artists: null,
  artistFilter: null,
  languageFilter: null,
  allUsers: null,
  allSongs: null,
  allAlbums: null,
  albumFilter: null,
  song: 0,
  isSongPlaying: false,
  miniPlayer: false,
}

context

import React from 'react'
import ReactDOM from 'react-dom/client'
import { BrowserRouter as Router } from 'react-router-dom'
import './index.css'
import App from './App'
import { StateProvider } from './Context/StateProvider'
import { initialState } from './Context/initialState'
import reducer from './Context/reducer'

const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(
  <React.StrictMode>
    <Router>
      <StateProvider initialState={initialState} reducer={reducer}>
        <App />
      </StateProvider>
    </Router>
  </React.StrictMode>
)