import React from 'react';
import cx from 'classnames';
import type { IconProps } from '../types';

export const PlaceholderAppIcon: React.FC<IconProps> = ({
    className,
    testId = 'PlaceholderAppIcon',
    size,
}) => (
    <svg
        data-testid={testId}
        className={cx('Icon AppIcon PlaceholderAppIcon', className)}
        width={size}
        height={size}
        viewBox="0 0 48 48"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
    >
        <circle cx="24" cy="24" r="16" fill="url(#PlaceholderAppIconGradient)" />
        <defs>
            <linearGradient
                id="PlaceholderAppIconGradient"
                x1="8"
                y1="8"
                x2="39.2"
                y2="40"
                gradientUnits="userSpaceOnUse"
            >
                <stop stopColor="var(--app-icon-gradient-color-0)" />
                <stop offset="1" stopColor="var(--app-icon-gradient-color-1)" />
            </linearGradient>
        </defs>
    </svg>
);