import { ReactElement } from 'react';
import { Card, CardContent, CardMedia, Stack, Typography } from '@mui/material';
import { PropertiesAPI } from 'types';
import Image from 'components/base/Image';
import { currencyFormat } from 'helpers/format-functions';
import MarkUnreadChatAltIcon from '@mui/icons-material/MarkUnreadChatAlt';

export const NotificationInfoCard = () => {
    return(
        <Stack direction={{sm:'row'}} justifyContent={{ sm: 'space-between' }} gap={3.75}>
            <Card
                sx={(theme) => ({
                    boxShadow: theme.shadows[4],
                    width: 1,
                    height: 'auto',
                })}
                >
                    <CardMedia
                    sx={{
                    maxWidth: 70,
                    maxHeight: 70,
                    }}
                >
                    <MarkUnreadChatAltIcon />
                </CardMedia>
                <CardContent
                        sx={{
                          flex: '1 1 auto',
                          padding: 0,
                          ':last-child': {
                            paddingBottom: 0,
                          },
                        }}
                      >
                        <Stack direction="row" justifyContent="space-between" alignItems="center" flexWrap="wrap">
                          <Typography variant="subtitle1" component="p" minWidth={100} color="text.primary">
                            Unread Notifications
                          </Typography>
                        </Stack>
                        <Typography variant="body1" component="p" color="text.secondary">
                          Messages
                        </Typography>
                        <Typography variant="body1" component="p" color="text.secondary">
                          Offers
                        </Typography>
                        
                      </CardContent>
                </Card>


        </Stack>
    )
}

export default NotificationInfoCard;