project_context.jsx

import React, { useState, useEffect, useContext } from "react"

import { FirebaseContext } from 'bentowidgets/widgets/firebase_context'
import { UserContext } from 'bentowidgets/widgets/user_context'

import { get } from 'lodash'

const ProjectContext = React.createContext()

function ProjectProvider(props) {

  const { pageId, containerWindow } = props
  //const user = useContext(UserContext)
  //const firebase = useContext(FirebaseContext)
  //  let DB = firebase.firestore()

  console.log(props)
  //console.log(user)
  //console.log(firebase)
  //console.log(DB)

	let [ test, setTest ] = useState(42)
	let [ recentProjects, setRecentProjects ] = useState([])
	let [ projects, setProjects ] = useState({})
	let [ project, setProject ] = useState(undefined)
	let [ projectId, setProjectId ] = useState(undefined)
	let [ expand, setExpand ] = useState(true)
	let [ cards, setCards ] = useState(undefined)
	let [ page, setPage ] = useState(undefined)

  function getUserLastAccess(project, uid) {
    return get(project, ['users', uid, 'lastAccess', 'seconds'], 0)
  }

  useEffect(() => {
    console.log('effect')
  })


  let context = {
		setProjectId,
		recentProjects,
		projects,
		project,
		expand,
		cards,
		page
  }

  return (
    <ProjectContext.Provider value={context}>
			{ props.children }
    </ProjectContext.Provider>
  )
}


function withProject(Component) {
  // ...and returns another component...
  return function FirebaseProjectComponent(props) {
    // ... and renders the wrapped component with the context theme!
    // Notice that we pass through any additional props as well
    return (
      <ProjectContext.Consumer>
        { projectContext => <Component {...props} projectContext={projectContext}/> }
      </ProjectContext.Consumer>
    );
  };
}

export default ProjectProvider
export { ProjectContext, withProject }