import Grid from '@mui/material/Grid'
import { makeStyles } from '@material-ui/core'

import HeaderBar from './HeaderBar'
import ChatBar from './ChatBar'
import { TRightIsOpen } from '../../../typescript/redux/control/types'

const useStyles = makeStyles({
  chatBar: {
    background: 'linear-gradient(to bottom right, #e7f097 , #b1e667,#f4f75e)',
  },
})

const CentralBar = ({rightIsOpen}:{rightIsOpen:TRightIsOpen}) => {
  const classes = useStyles()

    return ( 
     <Grid item lg={rightIsOpen?8:12}>
        <Grid item lg={12} >
          <HeaderBar/>
        </Grid>          
        <Grid item lg={12} className={classes.chatBar}>
          <ChatBar />
        </Grid>
      </Grid>
    )   
}

export default CentralBar