import React from 'react'
import { isFunction, isObj, hasOwnProp } from 'exotic'
import { observable } from 'xmobx/mobx'
import { observer } from 'xmobx/mobx-react'
import { withConsumer } from 'view-container'
import { makeCommonState } from 'src/state/common'
import { SidebarGroupProps, SidebarItemProps } from './typings'
import { sidebarGroupState } from './_deps'

const RenderContext = React.createContext({
  groupState: sidebarGroupState,
})

const { Provider, Consumer } = RenderContext

// could be SidebarGroupContext too...
@observer
class SidebarItemContext extends React.Component<Props> {}

// just simple, optional, an idea
Consumer.connect = withConsumer(Consumer)

export { withConsumer, Consumer }