FINAL-PROJECT-FRONT/src/components/HomePage/RightBar/HeaderBar/index.tsx

import Toolbar from '@mui/material/Toolbar'
import AppBar from '@mui/material/AppBar';
import { makeStyles } from '@material-ui/core'

import RightLists from './RightLists'
import Credentials from './Credentials'
import Buttons from './Buttons'

const useStyles = makeStyles({
  toolBar: {
    color: '#6e6d6d',
    display: 'flex',
    justifyContent: 'space-between',
    backgroundColor: '#ffffff',
  },
})

const HeaderBar = () => {
  const classes = useStyles()
    return (
      <AppBar position="static">
        <Toolbar  className={classes.toolBar}>
          <Credentials/>
          <Buttons/>
          <RightLists/>
        </Toolbar>
      </AppBar>        
    )
}

export default HeaderBar