import type { ComponentType } from 'react';
import {
  FoxCalendarStarIcon,
  FoxChartBarIcon,
  FoxHouseIcon,
  FoxIdentificationCardIcon,
  FoxMedalIcon,
  FoxNutIcon,
  FoxPencilSimpleIcon,
  FoxPhoneCallIcon,
  FoxPottedPlantIcon,
  FoxShieldCheckIcon,
  FoxSquaresFourIcon,
  FoxUserSquareIcon,
  FoxUsersThreeIcon,
  type FoxIconProps,
} from '@fox/core/icons';

/**
 * 메뉴 아이콘 이름(백엔드가 주는 문자열) → @fox 아이콘 컴포넌트.
 *
 * 화이트리스트로 두는 이유 — @fox에는 아이콘이 1,512종 있고, 이름으로 동적 import를 하면
 * 번들러가 무엇이 쓰일지 몰라 전부 싣게 된다. 여기 적힌 것만 번들에 들어간다.
 *
 * 목록은 시안 1depth가 쓰는 세트다. 백엔드가 새 이름을 보내면 여기에 한 줄 추가한다 —
 * 모르는 이름이 와도 화면은 깨지지 않고 기본 아이콘으로 그려진다.
 */
const ICONS: Record<string, ComponentType<FoxIconProps>> = {
  house: FoxHouseIcon,
  'users-three': FoxUsersThreeIcon,
  'user-square': FoxUserSquareIcon,
  'potted-plant': FoxPottedPlantIcon,
  'pencil-simple': FoxPencilSimpleIcon,
  medal: FoxMedalIcon,
  'identification-card': FoxIdentificationCardIcon,
  'calendar-star': FoxCalendarStarIcon,
  nut: FoxNutIcon,
  'shield-check': FoxShieldCheckIcon,
  'phone-call': FoxPhoneCallIcon,
  'chart-bar': FoxChartBarIcon,
};

/** 모르는 이름이 왔을 때. 메뉴가 통째로 사라지는 것보다 낫다. */
const FALLBACK = FoxSquaresFourIcon;

interface SidebarMenuIconProps {
  name: string;
}

/** 시안 1depth 아이콘은 Fill 굵기다. */
export function SidebarMenuIcon({ name }: SidebarMenuIconProps) {
  const Icon = ICONS[name] ?? FALLBACK;
  return <Icon weight="fill" />;
}