// ** MUI Imports import Box from '@mui/material/Box' import Card from '@mui/material/Card' import Avatar from '@mui/material/Avatar' import Typography from '@mui/material/Typography' import CardHeader from '@mui/material/CardHeader' import CardContent from '@mui/material/CardContent' // ** Custom Components import CustomChip from 'src/@core/components/mui/chip' import OptionsMenu from 'src/@core/components/option-menu' import Image from 'next/image' interface DataType { src: string title: string imgAlt: string subtitle: string chipText: string imgWidth: number imgHeight: number } const data: DataType[] = [ { imgWidth: 22, imgHeight: 22, chipText: '$6,500', title: '3D Illustration', imgAlt: '3d-illustration', subtitle: 'Blender Illustration', src: '/images/cards/3d-illustration.png' }, { imgWidth: 33, imgHeight: 22, chipText: '$4,290', subtitle: 'Figma UI Kit', title: 'Finance App Design', imgAlt: 'finance-app-design', src: '/images/cards/finance-app-design.png' }, { imgWidth: 20, imgHeight: 22, title: '4 Square', imgAlt: '4-square', chipText: '$44,500', subtitle: 'Android Application', src: '/images/cards/4-square.png' }, { imgWidth: 19, imgHeight: 22, chipText: '$12,690', title: 'Delta Web App', imgAlt: 'delta-web-app', subtitle: 'React Dashboard', src: '/images/cards/delta-web-app.png' }, { imgWidth: 23, imgHeight: 22, chipText: '$10,850', subtitle: 'Vue + Laravel', title: 'eCommerce Website', imgAlt: 'ecommerce-website', src: '/images/cards/ecommerce-website.png' } ] const AnalyticsProjectStatistics = () => { return ( } /> Name Budget {data.map((item: DataType, index: number) => { return ( avatar {item.title} {item.subtitle} ) })} ) } export default AnalyticsProjectStatistics