"use client";

import type { Block, SectionBlockProps, TextBlockProps } from "@/features/editor/state/editorStore";

export function createFeaturesTemplateBlocks(opts: {
  sectionId: string;
  createId: () => string;
}): { blocks: Block[]; lastSelectedId: string } {
  const { sectionId, createId } = opts;

  const columns = [
    { id: `${sectionId}_col_1`, span: 4 },
    { id: `${sectionId}_col_2`, span: 4 },
    { id: `${sectionId}_col_3`, span: 4 },
  ];

  const sectionProps: SectionBlockProps = {
    background: "muted",
    paddingY: "md",
    // 기능 리스트는 비교적 넓은 폭과 보통 수준의 여백을 사용한다.
    paddingYPx: 72,
    maxWidthPx: 1040,
    gapXPx: 32,
    backgroundColorCustom: "#0f172a",
    columns,
  } as any;

  const sectionBlock: Block = {
    id: sectionId,
    type: "section",
    props: sectionProps,
    sectionId: null,
    columnId: null,
  };

  const featureBlocks: Block[] = columns.flatMap((col, index) => {
    const titleId = createId();
    const descId = createId();

    const titleProps: TextBlockProps = {
      text: `Feature ${index + 1} 제목`,
      align: "left",
      size: "lg",
    } as any;

    const descProps: TextBlockProps = {
      text: "해당 기능을 간단히 설명하는 텍스트입니다.",
      align: "left",
      size: "sm",
    } as any;

    const title: Block = {
      id: titleId,
      type: "text",
      props: titleProps,
      sectionId,
      columnId: col.id,
    };

    const description: Block = {
      id: descId,
      type: "text",
      props: descProps,
      sectionId,
      columnId: col.id,
    };

    return [title, description];
  });

  const blocks: Block[] = [sectionBlock, ...featureBlocks];
  const lastSelectedId = featureBlocks[featureBlocks.length - 1]?.id ?? sectionId;

  return { blocks, lastSelectedId };
}
