import type { ImageSourcePropType } from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import type { ComponentProps } from 'react';
import { colors } from '../../src/theme';

/**
 * 图片素材占位注册表（色块占位方案）
 * ------------------------------------------------------------
 * 【换真实图只改这里】把对应项的 source 改为 require('../../assets/xxx.png')
 * 即可启用真实图，Illustration 会自动渲染图片，否则渲染色块占位。
 * 所有页面组件只引用本注册表的 name，不直接持有图片，保证页面纯净。
 */
export type AssetName =
  | 'logo'
  | 'illustCandidate'
  | 'illustRecruiter'
  | 'illustCelebrate'
  | 'avatarDesigner'
  | 'wechat'
  | 'businessLicense'
  | 'defaultAvatar'
  // 系统预设头像：5 个独立素材位，各自可换真实图（此前 5 个选项共用 defaultAvatar，
  // 选哪个都一样，也没有区分「选了第几个」的依据）
  | 'avatarPreset1'
  | 'avatarPreset2'
  | 'avatarPreset3'
  | 'avatarPreset4'
  | 'avatarPreset5'
  // 引导页（/guide）三屏插图：每屏一张，补图只改这几行的 source
  | 'guideAiCopilot'
  | 'guideAbilityTest'
  | 'guideGrowthUnlock';

type IconName = ComponentProps<typeof Ionicons>['name'];

export interface AssetDef {
  /** 【换真实图只改这里】设为 require('../../assets/xxx.png') 即启用真实图，否则渲染色块占位 */
  source: ImageSourcePropType | null;
  tint: string;
  icon: IconName;
  /** 素材说明，仅供换图时对照：**不渲染到界面上**（曾经把开发备注当正文画给用户看） */
  hint: string;
}

export const ASSET_REGISTRY: Record<AssetName, AssetDef> = {
  // RN 静态图片仅支持 require 引用，豁免 no-require-imports 规则
  // eslint-disable-next-line @typescript-eslint/no-require-imports
  logo: { source: require('../../assets/brand-logo.jpg'), tint: colors.primary, icon: 'briefcase', hint: '轻松聘 Logo' },
  illustCandidate: { source: null, tint: colors.primaryLight, icon: 'document-text', hint: '手持 OFFER 职场男性插画' },
  illustRecruiter: { source: null, tint: colors.primaryLight, icon: 'person', hint: '手持 RESUME 职场男性插画' },
  illustCelebrate: { source: null, tint: colors.successLight, icon: 'ribbon', hint: '庆祝插画' },
  avatarDesigner: { source: null, tint: colors.infoLight, icon: 'person', hint: '资深 UI 设计师头像' },
  wechat: { source: null, tint: colors.success, icon: 'logo-wechat', hint: '微信图标' },
  businessLicense: { source: null, tint: colors.primaryLight, icon: 'document', hint: '营业执照示例图' },
  defaultAvatar: { source: null, tint: colors.borderLight, icon: 'person', hint: '默认头像剪影' },
  // 换真实图只改这几行的 source；tint/icon 只是占位期用来互相区分的
  avatarPreset1: { source: null, tint: colors.primaryLight, icon: 'person', hint: '预设头像 1' },
  avatarPreset2: { source: null, tint: colors.infoLight, icon: 'happy', hint: '预设头像 2' },
  avatarPreset3: { source: null, tint: colors.successLight, icon: 'woman', hint: '预设头像 3' },
  avatarPreset4: { source: null, tint: colors.actionLight, icon: 'man', hint: '预设头像 4' },
  avatarPreset5: { source: null, tint: colors.dangerLight, icon: 'person-circle', hint: '预设头像 5' },
  /*
   * 引导页三屏插图。hint 会**显示在页面上**（ImageSlot 的占位标注），
   * 所以这里写的是「给谁看的、画什么」，补图后标注自动消失。
   * 建议尺寸 640×480（4:3）；引导页底色是深蓝渐变，插画本身请用浅色底，
   * 否则浅色占位块换成深色插画后会和背景糊在一起。
   */
  guideAiCopilot: {
    source: null,
    tint: colors.primaryLight,
    icon: 'sparkles',
    hint: 'AI 助手对话界面：简历优化建议与模拟面试提问',
  },
  guideAbilityTest: {
    source: null,
    tint: colors.infoLight,
    icon: 'analytics',
    hint: '能力测评雷达图与测评得分报告',
  },
  guideGrowthUnlock: {
    source: null,
    tint: colors.actionLight,
    icon: 'map',
    hint: '职场成长地图：文章与闯关任务节点',
  },
};

/** 头像设置页可选用的系统预设头像（顺序即展示顺序） */
export const AVATAR_PRESETS: AssetName[] = [
  'avatarPreset1',
  'avatarPreset2',
  'avatarPreset3',
  'avatarPreset4',
  'avatarPreset5',
];

/**
 * 判断 P21 采集到的头像原始值是不是预设素材 key。
 *
 * 该字段是联合值：预设头像存素材 key，拍照 / 相册存本地图片 URI（见 `OnboardingProfile.avatar`）。
 * 消费方（如「我的」页头像）据此决定按素材渲染还是按 URI 渲染 ——
 * 这个判断依赖素材注册表，因此放在组件层，API 层只透传原始值。
 */
export function isAvatarPreset(value: string): value is AssetName {
  return (AVATAR_PRESETS as string[]).includes(value);
}

/**
 * 滑块拼图验证背景图池（每次刷新随机选一张）
 * RN 静态图片仅支持 require 引用，豁免 no-require-imports 规则
 */
/* eslint-disable @typescript-eslint/no-require-imports */
export const CAPTCHA_BACKGROUNDS = [
  require('../../assets/captcha-bg-1.jpg'), // 山峦晨雾
  require('../../assets/captcha-bg-2.jpg'), // 海岸礁石
  require('../../assets/captcha-bg-3.jpg'), // 多肉植物
  require('../../assets/captcha-bg-4.jpg'), // 欧洲街景
  require('../../assets/captcha-bg-5.jpg'), // 摩天大楼
] as ImageSourcePropType[];
/* eslint-enable @typescript-eslint/no-require-imports */