import clsx from 'clsx'

// import Image from 'next/image'

import { TbPresentationAnalytics } from 'react-icons/tb'

import { rootStyles, RootStylesProps } from './ProjectIcon.styles'

type ProjectIconProps = RootStylesProps & {
	icon: {
		name: string
		color: string
	}
	className?: string
}

function ProjectIcon({ icon, size, className }: ProjectIconProps) {
	const iconStyle: any = { '--icon-color': icon.color }

	return (
		<div
			style={iconStyle}
			className={clsx(
				rootStyles({ size, className }),
				'bg-(--icon-color)/16 text-(--icon-color)'
			)}
		>
			{/* {icon.path ? (
				<Image src={icon.path} alt={icon.name} />
			) : ( */}
			<TbPresentationAnalytics />
			{/* )} */}
		</div>
	)
}

export { ProjectIcon }
