// Shared data: providers, model variants, prompts.
//
// PROVIDERS — top-level families (OpenAI, Anthropic, Google, xAI, DeepSeek).
//   Each provider has a brand mark (geometric SVG, not a logo reproduction),
//   short positioning copy, and a list of variants. Variants are individual
//   models the user can select in chat (e.g. GPT-5.5 Pro, Claude Haiku 4.5).
//
// MODELS — flattened list of ALL variants, each tagged with provider info,
//   used by the chat-app sidebar and by every place that needs a single
//   model record (avatar mark, label, accent color).
//
// MODEL_MARKS — keyed by provider id. Stylized brand glyphs in the
//   provider's signature color. Replace with official SVGs later if you have
//   the rights.

// Local PNG logos for each provider — placed in /logos.
// If a logo is missing, we fall back to the geometric MODEL_MARK below.
const PROVIDER_LOGOS = {
  openai:    'logos/openai.png',
  anthropic: 'logos/anthropic.png',
  google:    'logos/google.png',
  xai:       'logos/xai.png',
  deepseek:  'logos/deepseek.png',
};

const MODEL_MARKS = {
  openai: (
    <g fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round">
      <path d="M12 3.2l7.6 4.4v8.8L12 20.8 4.4 16.4V7.6L12 3.2z"/>
      <path d="M12 8.2v7.6M8.4 10.1l7.2 3.8M15.6 10.1l-7.2 3.8"/>
    </g>
  ),
  anthropic: (
    <g fill="currentColor">
      <path d="M12 2.5l1.3 6.4 6.4 1.3-6.4 1.3-1.3 6.4-1.3-6.4-6.4-1.3 6.4-1.3z"/>
      <circle cx="12" cy="12" r="1.4"/>
    </g>
  ),
  deepseek: (
    <g fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round">
      <path d="M3.5 12.5c2.5-4 7-5.5 10.5-3 2.5 1.7 4 4.5 6.5 4.5"/>
      <path d="M3.5 16.5c2 -2 4-3 6-3"/>
      <circle cx="15" cy="9.5" r="0.9" fill="currentColor" stroke="none"/>
    </g>
  ),
  xai: (
    <g fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round">
      <path d="M5 5l14 14M19 5L5 19"/>
    </g>
  ),
  google: (
    <g fill="currentColor">
      <path d="M12 2.5c0 4.5 2.2 7 7 7-4.8 0-7 2.5-7 7 0-4.5-2.2-7-7-7 4.8 0 7-2.5 7-7z"/>
    </g>
  ),
  // Coming-soon family
  imagine: (
    <g fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinejoin="round">
      <path d="M12 3l5 5-5 13-5-13z"/>
      <path d="M7 8h10"/>
    </g>
  ),
};

// Tier badges used in the picker
const TIERS = {
  flagship:  { label: 'Флагман',    color: '#5b8cff' },
  pro:       { label: 'Про',         color: '#a06bff' },
  standard:  { label: 'Базовая',     color: '#7c8fff' },
  fast:      { label: 'Быстрая',     color: '#4be3d0' },
  cheap:     { label: 'Эконом',      color: '#4be3d0' },
  reasoning: { label: 'Рассуждение', color: '#ff6bd0' },
  soon:      { label: 'Скоро',       color: '#a06bff' },
};

const PROVIDERS = [
  {
    id: 'openai',
    name: 'OpenAI',
    family: 'ChatGPT',
    markColor: '#10a37f',
    accent: '#3ec4a3',
    gradient: ['#0f8a6b', '#3ec4a3'],
    desc: 'Универсальный помощник: письма, идеи, рассуждения, повседневные задачи.',
    tags: ['Универсальный', 'Reasoning'],
    variants: [
      { id: 'gpt-5.5',       name: 'GPT-5.5',        tier: 'flagship',  desc: 'Флагман — лучший баланс качества и скорости.' },
      { id: 'gpt-5.5-pro',   name: 'GPT-5.5 Pro',    tier: 'pro',       desc: 'Глубокие задачи: аналитика, длинный контекст, агенты.' },
      { id: 'gpt-4.1',       name: 'GPT-4.1',        tier: 'standard',  desc: 'Стабильный универсал для большинства запросов.' },
      { id: 'gpt-4.1-mini',  name: 'GPT-4.1 mini',   tier: 'cheap',     desc: 'Быстрее и дешевле — для коротких запросов.' },
      { id: 'gpt-4.1-nano',  name: 'GPT-4.1 nano',   tier: 'cheap',     desc: 'Самая лёгкая модель — почти бесплатно по токенам.' },
      { id: 'o1',            name: 'o1',             tier: 'reasoning', desc: 'Рассуждающая: математика, логика, доказательства.' },
      { id: 'o3',            name: 'o3',             tier: 'reasoning', desc: 'Глубокое мышление и многошаговые задачи.' },
    ],
  },
  {
    id: 'anthropic',
    name: 'Anthropic',
    family: 'Claude',
    markColor: '#e89070',
    accent: '#e89070',
    gradient: ['#d97757', '#f0a87a'],
    desc: 'Длинные документы, нюансы языка и сложные тексты без потери контекста.',
    tags: ['Длинный контекст', 'Письмо'],
    variants: [
      { id: 'claude-opus-4.7',   name: 'Claude Opus 4.7',   tier: 'flagship', desc: 'Самая мощная модель Anthropic. Глубокий разбор и тонкое письмо.' },
      { id: 'claude-sonnet-4.6', name: 'Claude Sonnet 4.6', tier: 'standard', desc: 'Универсальный Claude: качество и скорость в балансе.' },
      { id: 'claude-haiku-4.5',  name: 'Claude Haiku 4.5',  tier: 'fast',     desc: 'Быстрые ответы для коротких задач и интерфейсов.' },
    ],
  },
  {
    id: 'google',
    name: 'Google',
    family: 'Gemini',
    markColor: '#7c8fff',
    accent: '#7c8fff',
    gradient: ['#4285f4', '#a472ff'],
    desc: 'Мультимодальные модели: текст, изображения и таблицы в одном запросе.',
    tags: ['Multimodal', 'Vision'],
    variants: [
      { id: 'gemini-3.1-pro',   name: 'Gemini 3.1 Pro',   tier: 'flagship', desc: 'Флагман Google. Длинный контекст, vision, рассуждение.' },
      { id: 'gemini-3.1-flash', name: 'Gemini 3.1 Flash', tier: 'fast',     desc: 'Быстрая мультимодальная модель.' },
      { id: 'gemini-2.5-flash', name: 'Gemini 2.5 Flash', tier: 'cheap',    desc: 'Бюджетный вариант предыдущего поколения.' },
    ],
  },
  {
    id: 'xai',
    name: 'xAI',
    family: 'Grok',
    markColor: '#dde1ea',
    accent: '#c4cbd6',
    gradient: ['#9aa1ad', '#dde1ea'],
    desc: 'Острый стиль и актуальные ответы. Хорошо работает с реалтайм-контекстом.',
    tags: ['Realtime', 'Стиль'],
    variants: [
      { id: 'grok-4.3',  name: 'Grok 4.3',  tier: 'flagship', desc: 'Флагман xAI: быстрый, дерзкий, с веб-доступом.' },
      { id: 'grok-4.20', name: 'Grok 4.20', tier: 'pro',      desc: 'Расширенная версия с более длинным контекстом.' },
    ],
  },
  {
    id: 'deepseek',
    name: 'DeepSeek',
    family: 'DeepSeek',
    markColor: '#7e96ff',
    accent: '#6f8aff',
    gradient: ['#4d6bfe', '#7e96ff'],
    desc: 'Сильна в коде, математике и алгоритмах. Отвечает быстро и по делу.',
    tags: ['Код', 'Math'],
    variants: [
      { id: 'deepseek-v4-pro',   name: 'DeepSeek V4-Pro',   tier: 'flagship', desc: 'Флагман: код, длинный reasoning, сложные алгоритмы.' },
      { id: 'deepseek-v4-flash', name: 'DeepSeek V4-Flash', tier: 'fast',     desc: 'Быстрая версия для коротких задач и автокомплита.' },
    ],
  },
  {
    id: 'imagine',
    name: 'Nepl',
    family: 'Image & Video',
    markColor: '#a06bff',
    accent: '#a06bff',
    gradient: ['#a06bff', '#4be3d0'],
    desc: 'Генерация изображений и коротких видео — в следующих обновлениях.',
    tags: ['Coming soon'],
    soon: true,
    variants: [
      { id: 'imagine-soon', name: 'Image & Video', tier: 'soon', desc: 'Скоро: генерация картинок и роликов.' },
    ],
  },
];

// Flatten variants into MODELS, attach provider info each.
const MODELS = PROVIDERS.flatMap(p =>
  p.variants.map(v => ({
    id: v.id,
    name: v.name,
    short: v.name.split(/[ -]/)[0].slice(0, 3),
    tier: v.tier,
    desc: v.desc,
    provider: p.id,
    providerName: p.name,
    family: p.family,
    markColor: p.markColor,
    accent: p.accent,
    gradient: p.gradient,
    tags: p.tags,
    soon: !!p.soon,
  }))
);

// Default chat model id
const DEFAULT_MODEL_ID = 'gpt-5.5';

const PROMPTS = [
  { label: 'Идеи',   text: 'Дай 5 идей для подкаста про технологии и людей за ними.' },
  { label: 'Код',    text: 'Напиши функцию на Python, которая считает кол-во гласных в строке.' },
  { label: 'Учёба',  text: 'Объясни простыми словами, что такое трансформер в ML.' },
  { label: 'Письмо', text: 'Помоги составить вежливый отказ от рабочего проекта.' },
  { label: 'Перевод', text: 'Переведи на английский и сделай тоном для делового письма.' },
];

const ModelMark = ({ model, size = 20 }) => {
  if (!model) return null;
  const providerId = model.provider || model.id;
  const logo = PROVIDER_LOGOS[providerId];
  if (logo) {
    return (
      <img
        src={logo}
        alt={model.providerName || model.name || ''}
        width={size}
        height={size}
        style={{ display: 'block', objectFit: 'contain', borderRadius: 4 }}
        draggable={false}
      />
    );
  }
  return (
    <svg
      width={size}
      height={size}
      viewBox="0 0 24 24"
      style={{ color: model.markColor, display: 'block' }}
    >
      {MODEL_MARKS[providerId] || MODEL_MARKS.openai}
    </svg>
  );
};

// Render a provider mark by provider id (used in dropdown headers).
const ProviderMark = ({ providerId, size = 14, color }) => {
  const logo = PROVIDER_LOGOS[providerId];
  if (logo) {
    return (
      <img
        src={logo}
        alt=""
        width={size}
        height={size}
        style={{ display: 'block', objectFit: 'contain', borderRadius: 3 }}
        draggable={false}
      />
    );
  }
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" style={{ color, display: 'block' }}>
      {MODEL_MARKS[providerId]}
    </svg>
  );
};

// Find provider by id
const getProvider = (id) => PROVIDERS.find(p => p.id === id);
const getModel = (id) => MODELS.find(m => m.id === id);

// One representative MODEL per provider — first variant. Used where we want
// to show one card/pill per family (hero orbit, hero mockup, problem hub).
const PROVIDER_REPS = PROVIDERS
  .filter(p => !p.soon)
  .map(p => MODELS.find(m => m.provider === p.id));

Object.assign(window, {
  MODELS, PROVIDERS, PROVIDER_REPS, MODEL_MARKS, PROVIDER_LOGOS, TIERS,
  PROMPTS, DEFAULT_MODEL_ID,
  ModelMark, ProviderMark, getProvider, getModel,
});