import {Box, Typography} from "@mui/material";

const NumberShowBox = ({showNumber, headerTitle, unitTitle}) => {
    return (
        <>
            <Box sx={{border: '1px solid #ccc', p: 2, mb: 2, borderRadius: '8px'}}>
                <Typography
                    sx={{color: "primary.main", fontWeight: 500}}>{headerTitle}</Typography>
                <Typography pt={1}>
                    {isNaN(showNumber) || showNumber === null
                        ? ""
                        : (showNumber).toLocaleString()}{" "}
                    {unitTitle}
                </Typography>
            </Box>
        </>
    );
};
export default NumberShowBox