import Stack from '@material-hu/mui/Stack';

import HuCardContainer from '@material-hu/components/design-system/CardContainer';
import HuListItemSkeleton from '@material-hu/components/design-system/List/components/ListItemSkeleton';
import HuSkeleton from '@material-hu/components/design-system/Skeleton';

export const FeedPostSkeleton = () => (
  <HuCardContainer fullWidth>
    <Stack sx={{ gap: 2 }}>
      <HuListItemSkeleton sx={{ p: 0 }} />
      <Stack sx={{ gap: 1 }}>
        {Array.from({ length: 4 }, (_, i) => (
          <HuSkeleton
            key={i}
            sx={{ height: '16px' }}
          />
        ))}
      </Stack>
    </Stack>
  </HuCardContainer>
);

export default FeedPostSkeleton;
