import React , { useState } from 'react' ; export const StateContext = React . createContext ( { } ) ; const StateProvider = ( { children } ) => { const [ darkMode , setDarkMode ] = useState ( true ) ; const darkModeHandler = ( ) => { setDarkMode ( ! darkMode ) ; } ; const [ updateTree , setUpdateTree ] = useState ( false ) ; const updateTreeHandler = ( ) => { setUpdateTree ( ! updateTree ) ; } ; const [ activePort , setActivePort ] = useState ( '' ) ; const activePortHandler = ( port ) : void => { setActivePort ( port ) ; } ; const [ activeFile , setActiveFile ] = useState ( '' ) ; const activeFileHandler = ( chosen ) : void => { setActiveFile ( chosen ) ; } ; const [ userPath , setUserPath ] = useState ( '' ) ; const pathHandler = ( pathValue ) : void => { setUserPath ( pathValue ) ; } ; const [ toggleFileTree , setToggleFileTree ] = useState ( true ) ; const handleToggleFileTree = ( ) : void => { setToggleFileTree ( ! toggleFileTree ) ; } ; const [ fileTree , setFileTree ] = useState ( [ ] ) ; const fileTreeHandler = ( tree ) : void => { setFileTree ( tree ) ; } ; const [ testFileName , setTestFileName ] = useState ( '' ) ; return ( < StateContext . Provider value = { { darkMode , darkModeHandler , updateTree , updateTreeHandler , activePort , activePortHandler , userPath , pathHandler , fileTree , fileTreeHandler , activeFile , activeFileHandler , toggleFileTree , handleToggleFileTree , testFileName , setTestFileName } } > { children } < /StateContext.Provider>); } ; export default StateProvider ;