import React from "react";

import { StyleSheetType } from "../services/StyleSheet";
import getStyleAndDataIdAttributes from "./getStyleAndDataIdAttributes";

export type IconSet = {
  [iconName: string]: React.ComponentType<any>;
};

function iconComponent(iconSet: IconSet) {
  const Icon = class extends React.PureComponent<{
    color?: string;
    name: keyof typeof iconSet;
    size?: number;
    style?: StyleSheetType;
  }> {
    static displayName;

    render() {
      const { name, size, style, ...props } = this.props;
      const Component = iconSet[name];
      const iconProps = {
        ...(size ? { width: size, height: size } : {}),
        ...props,
      };

      return (
        <Component {...getStyleAndDataIdAttributes(style)} {...iconProps} />
      );
    }
  };

  Icon.displayName = "Icon";
  return Icon;
}

export default iconComponent;