import {Divider, Grid} from "@mui/material";
import CallActions from "@/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/CallTabPanel/CallActions";
import CallHistory from "@/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/CallTabPanel/CallHistory";

const CallTabPanel = ({tab}) => {
    return (
        <Grid container columns={{xs: 3}} sx={{display: !tab.active && 'none', height: '100%', overflow: "hidden"}}
              role="tabpanel"
              id={`answer-tabpanel-${tab.id}`} aria-labelledby={`answer-tab-${tab.id}`}>
            <Grid item xs={2} sx={{height: "100%", overflow: "scroll"}}>
                <CallActions tab={tab}/>
            </Grid>
            <Grid item>
                <Divider orientation="vertical"/>
            </Grid>
            <Grid item xs sx={{height: "100%", overflow: "scroll"}}>
                <CallHistory tab={tab}/>
            </Grid>
        </Grid>
    )
}

export default CallTabPanel