/**
 * slides/18-customization-6-points.js
 * ----------------------------------------------------------------------------
 * Slide 18 -- 6 точек кастомизации
 * sandbox / model / tools / triggers / prompt / middleware
 */
'use strict';

const { helpers, layouts } = require('../../design-system');

function buildCustomization6(pres, theme) {
  const slide = pres.addSlide();
  helpers.slideBase(slide, pres, theme);
  helpers.addHeader(slide, pres, theme, {
    eyebrow: 'STAGE 4',
    sectionNumber: 4,
    title: '6 точек кастомизации',
  });

  const items = [
    { num: '1', name: 'Sandbox provider', code: 'backend=ModalBackend(...)' },
    { num: '2', name: 'Model',            code: 'init_chat_model("anthropic:...")' },
    { num: '3', name: 'Tools',            code: 'tools=[execute, fetch_url, ...]' },
    { num: '4', name: 'Triggers',         code: 'router.add_route("/my", my_handler)' },
    { num: '5', name: 'System prompt',    code: 'construct_system_prompt(repo_dir, ...)' },
    { num: '6', name: 'Middleware',       code: 'middleware=[AuditLogger(), ...]' },
  ];

  const cardY = layouts.CONTENT_TOP;
  const cardW = 2.95;
  const cardH = 1.65;
  const gap = 0.13;

  items.forEach(function (it, idx) {
    const col = idx % 3;
    const row = Math.floor(idx / 3);
    const cx = 0.5 + col * (cardW + gap);
    const cy = cardY + row * (cardH + gap);

    slide.addShape(pres.ShapeType.roundRect, {
      x: cx, y: cy, w: cardW, h: cardH,
      fill: { color: theme.palette.bg.elevated },
      line: { color: theme.palette.border.subtle, width: 0.75 },
      rectRadius: 0.08,
    });

    // Number badge
    slide.addShape(pres.ShapeType.ellipse, {
      x: cx + 0.15, y: cy + 0.15, w: 0.45, h: 0.45,
      fill: { color: theme.palette.accent.primary },
      line: { color: theme.palette.accent.primary, width: 1 },
    });
    slide.addText(it.num, {
      x: cx + 0.15, y: cy + 0.15, w: 0.45, h: 0.45,
      fontFace: helpers.withFallback(theme.fonts.ui),
      fontSize: 18,
      color: theme.palette.text.inverse,
      bold: true,
      align: 'center',
      valign: 'middle',
    });

    slide.addText(it.name, {
      x: cx + 0.7, y: cy + 0.15, w: cardW - 0.85, h: 0.45,
      fontFace: helpers.withFallback(theme.fonts.ui),
      fontSize: theme.sizes.h3,
      color: theme.palette.text.primary,
      bold: true,
      valign: 'middle',
    });

    // Code block
    slide.addShape(pres.ShapeType.rect, {
      x: cx + 0.15, y: cy + 0.7, w: cardW - 0.3, h: cardH - 0.85,
      fill: { color: theme.palette.bg.code },
      line: { color: theme.palette.border.subtle, width: 0.5 },
    });
    slide.addText(it.code, {
      x: cx + 0.25, y: cy + 0.75, w: cardW - 0.5, h: cardH - 0.95,
      fontFace: helpers.withFallback(theme.fonts.code),
      fontSize: theme.sizes.code,
      color: theme.palette.text.primary,
      valign: 'top',
    });
  });

  helpers.addPageNumber(slide, pres, theme, 18);
  helpers.addSourceLine(slide, pres, theme, {
    source: 'github.com/langchain-ai/open-swe/blob/main/CUSTOMIZATION.md',
  });
  return slide;
}

module.exports = { buildCustomization6 };