import Image from 'next/image';
import React, { forwardRef } from 'react';
import { CardMediaProps, CardMediaType } from './card.types';

export const CardMedia = forwardRef<CardMediaType, CardMediaProps>(
    (
        {
            alt,
            src,
            type,
            quality = 80,
            rounded = true,
            preview = true,
            className = '',
            ...props
        },
        ref,
    ) => {
        const classes =
            `m3 m3-card-media${rounded ? ' m3-rounded' : ''}${preview ? ' m3-preview' : ''} ${className}`.trimEnd();

        switch (type) {
            case 'img':
                return <Image alt={alt} quality={quality} src={src} />;
            default:
                return React.createElement(type, {
                    ...props,
                    className: classes,
                    ref: ref,
                });
        }
    },
);
