// MUI Imports
import Grid from '@mui/material/Grid2'

// Type Imports
import type { UserDataType } from '@components/card-statistics/HorizontalWithSubtitle'

// Component Imports
import HorizontalWithSubtitle from '@components/card-statistics/HorizontalWithSubtitle'

// Vars
const data: UserDataType[] = [
  // Fixed Assets Data (from the image)
  {
    title: 'Nilai Aset',
    stats: 'Rp 17.900.000',
    avatarIcon: 'tabler-building-store',
    avatarColor: 'success',
    trend: 'positive',
    trendNumber: '100%',
    subtitle: 'Hari ini vs 365 hari lalu'
  },
  {
    title: 'Depresiasi Aset',
    stats: 'Rp 0',
    avatarIcon: 'tabler-trending-down',
    avatarColor: 'secondary',
    trend: 'neutral',
    trendNumber: '0%',
    subtitle: 'Tahun ini vs tanggal sama tahun lalu'
  },
  {
    title: 'Laba/Rugi Pelepasan Aset',
    stats: 'Rp 0',
    avatarIcon: 'tabler-exchange',
    avatarColor: 'secondary',
    trend: 'neutral',
    trendNumber: '0%',
    subtitle: 'Tahun ini vs tanggal sama tahun lalu'
  },
  {
    title: 'Aset Baru',
    stats: 'Rp 17.900.000',
    avatarIcon: 'tabler-plus-circle',
    avatarColor: 'success',
    trend: 'positive',
    trendNumber: '100%',
    subtitle: 'Tahun ini vs tanggal sama tahun lalu'
  }
]

const FixedAssetCards = () => {
  return (
    <Grid container spacing={6}>
      {data.map((item, i) => (
        <Grid key={i} size={{ xs: 12, sm: 6, md: 3 }}>
          <HorizontalWithSubtitle {...item} />
        </Grid>
      ))}
    </Grid>
  )
}

export default FixedAssetCards