import React from 'react';
import GenericIconMap from './Generics/GenericIconMap';
import MatrixResourceMap from './MatrixResources/MatrixResourceMap';

export const iconSources = {
  generic: GenericIconMap,
  matrix: MatrixResourceMap,
  component: [],
};

// The resource sources options
export type ResourceSources = keyof typeof iconSources;
export type IconOptions = string;

/**
 * Renders an icon based on the resource source and the icon name
 * @param {{resourceSource?: ResourceSources; icon?: IconOptions; props: React.HTMLAttributes<HTMLOrSVGElement>}} props - The props for the Icon component
 * @returns {React.FunctionComponent} - The icon component
 * @example
 * <Icon />
 * @example
 * <Icon resourceSource="generic" icon="generic_file" />
 * @example
 * <Icon resourceSource="matrix" icon="page" />
 * @example
 * <Icon resourceSource="matrix" icon="page" height={24} width={24} />
 * @example
 * <Icon resourceSource="matrix" icon="page" className="custom-class" />
 */
export function Icon({
  resourceSource = 'generic',
  icon,
  componentIcon,
  isDecorative = true,
  ...props
}: {
  icon?: IconOptions;
  resourceSource?: ResourceSources;
  isDecorative?: boolean;
  componentIcon?: React.ReactNode | undefined;
} & React.HTMLAttributes<HTMLElement> &
  React.SVGAttributes<SVGElement>) {
  if (resourceSource === 'component' && componentIcon !== undefined) {
    const className = props?.className || '';
    return <div className={className}>{componentIcon}</div>;
  }

  const icons = (iconSources[resourceSource] as any) || null;

  // If the resource source is the current source and the icon is in the current source map, render the icon
  if (icons && icon && icon in icons) {
    // Get the icon from the current source map
    const Icon = icons[icon] as React.FunctionComponent<{ isDecorative: boolean } & React.SVGProps<SVGSVGElement>>;

    // Render the icon
    return <Icon isDecorative={isDecorative} {...props} />;
  }

  // If the icon is not defined, render the default icon
  const DefaultIcon = MatrixResourceMap['generic_file'];
  return <DefaultIcon isDecorative={isDecorative} {...props} />;
}