import type { ComponentType } from 'react';
import { isAppIconName, type AppIconName } from '../../catalog/app-icon-names';
import { APP_ICON_SIZE } from './app-icon-size-catalog';
import type { AppIconGlyphProps } from './app-icon-glyph-props';
import { GENERATED_ICON_REGISTRY } from './generated';

export type { AppIconName };
export { isAppIconName };

/** 1:1 registry — one generated SVG component per AppIconName (no aliases). */
const ICON_REGISTRY: Record<AppIconName, ComponentType<AppIconGlyphProps>> =
  GENERATED_ICON_REGISTRY;

export type AppIconProps = {
  name: AppIconName;
  color?: string;
  size?: number;
};

export function AppIcon({ name, color, size = APP_ICON_SIZE.composer }: AppIconProps) {
  const Glyph = ICON_REGISTRY[name];
  if (!Glyph) {
    if (__DEV__) {
      console.warn(`[AppIcon] unknown icon name: ${name}`);
    }
    return null;
  }
  return <Glyph color={color} size={size} />;
}

export { APP_ICON_SIZE, ICON_REGISTRY };