import {Box, CardContent, Table, TableBody, TableCell, TableRow, Tooltip, Typography} from "@mui/material";
import React from "react";

const ChampionshipCardContent = ({champ}) => {
    return (
        <CardContent>
            <Box
                sx={{display: 'flex', justifyContent: 'space-between', alignItems: 'start', mb: 2}}>
                <Box>
                    <Typography variant="h6">
                        {champ.title}
                    </Typography>
                    <Tooltip title={champ.status}>
                        <Typography
                            variant="caption"
                            sx={{
                                backgroundColor: champ.status === 'Идёт' ? 'warning.main' :
                                    champ.status === 'Регистрация открыта' ? 'success.main' : 'info.main',
                                color: 'white',
                                px: 1,
                                borderRadius: 1,
                                whiteSpace: 'nowrap'
                            }}
                        >
                            {champ.status}
                        </Typography>
                    </Tooltip>
                    <Typography variant="subtitle2" color="text.secondary">
                        {champ.season}
                    </Typography>
                </Box>

            </Box>

            {/* Таблица с основными данными */}
            <Table size="small" sx={{mt: 2}}>
                <TableBody>
                    <TableRow>
                        <TableCell variant="head">Этапы</TableCell>
                        <TableCell>{champ.stages}</TableCell>
                    </TableRow>
                    <TableRow>
                        <TableCell variant="head">Классы</TableCell>
                        <TableCell>
                            {champ.classes.join(', ')}
                        </TableCell>
                    </TableRow>
                    <TableRow>
                        <TableCell variant="head">Начало</TableCell>
                        <TableCell>{champ.startDate}</TableCell>
                    </TableRow>
                    <TableRow>
                        <TableCell variant="head">Конец</TableCell>
                        <TableCell>{champ.endDate}</TableCell>
                    </TableRow>
                </TableBody>
            </Table>
        </CardContent>
    )
}

export default ChampionshipCardContent;