xiaoxia-saas/apps/web/src/pages/generate/hooks/useStep4Title/index.ts

import { useEffect, useRef } from "react"
import { useQuery } from "@tanstack/react-query"
// #1894: 标题候选从文案库 scripts[].title 获取，不再调用废弃的 /api/titles
import { getScripts } from "@/api/scripts"
import type { TitleSettings } from "../../types"
import { useAiTitleGenerator } from "./useAiTitleGenerator"
import { useTitleStyleUpdaters } from "./useTitleStyleUpdaters"
import { useDraftAutoSave } from "../useDraftAutoSave"

interface UseStep4TitleProps {
  titleSettings: TitleSettings
  onTitleSettingsChange: (settings: TitleSettings) => void
  /** 当前选中的模板/草稿 ID，用于自动保存 */
  selectedTemplate?: string
}

/**
 * Step 4 标题设置 Hook
 * 封装 AI 标题生成、标题样式设置等逻辑
 */
export function useStep4Title({
  titleSettings,
  onTitleSettingsChange,
  selectedTemplate,
}: UseStep4TitleProps) {
  // 标题候选（#1894：统一从文案库取 scripts[].title，去重）
  const { data: userTitles = [] } = useQuery({
    queryKey: ["scripts", "titles-source"],
    queryFn: async () => {
      const res = await getScripts({ page_size: 200 })
      const items = Array.isArray(res) ? res : (res.items ?? [])
      return items.map((s) => ({ content: (s.title || "").trim() })).filter((s) => !!s.content)
    },
    staleTime: 30_000,
  })

  // AI 标题生成
  const {
    aiTitleInput,
    setAiTitleInput,
    aiTitleGenerating,
    aiTitleResults,
    hasGeneratedTitles,
    handleGenerateAiTitles,
    handleSelectAiTitle,
    handleRefreshAiTitles,
    autoGenerateTitle,
  } = useAiTitleGenerator({ titleSettings, onTitleSettingsChange })

  // 样式更新
  const styleUpdaters = useTitleStyleUpdaters({ titleSettings, onTitleSettingsChange })

  // 追踪 AI 自动选择开关的上一次值 & 是否首次挂载
  const prevAiAutoSelect = useRef(titleSettings.aiAutoSelect)
  const isFirstMount = useRef(true)

  /* ── Step4 标题内容/样式变化后自动保存草稿（防抖 800ms，失败静默） ── */
  const { scheduleSave: scheduleTitleSave } = useDraftAutoSave(selectedTemplate)
  useEffect(() => {
    if (!selectedTemplate) return
    scheduleTitleSave(
      {
        title: {
          text: titleSettings.title,
          font: titleSettings.font,
          font_size: titleSettings.size,
          color: titleSettings.color,
          position: titleSettings.position,
          bold: titleSettings.bold,
          stroke: titleSettings.stroke,
          shadow: titleSettings.shadow,
        },
      },
      800,
    )
  }, [
    selectedTemplate,
    titleSettings.title,
    titleSettings.font,
    titleSettings.size,
    titleSettings.color,
    titleSettings.position,
    titleSettings.bold,
    titleSettings.stroke,
    titleSettings.shadow,
    scheduleTitleSave,
  ])

  // 当 AI 自动选择开关打开时，自动生成/选择一个标题填入
  // 首次挂载时如果开关已经是 true 且无标题，也需要触发
  useEffect(() => {
    if (isFirstMount.current) {
      isFirstMount.current = false
      if (titleSettings.aiAutoSelect && !titleSettings.title) {
        autoGenerateTitle()
      }
      prevAiAutoSelect.current = titleSettings.aiAutoSelect
      return
    }
    if (titleSettings.aiAutoSelect && !prevAiAutoSelect.current && !titleSettings.title) {
      autoGenerateTitle()
    }
    prevAiAutoSelect.current = titleSettings.aiAutoSelect
  }, [titleSettings.aiAutoSelect, titleSettings.title, autoGenerateTitle])

  return {
    // 数据
    userTitles,
    titleSettings,
    // AI 标题状态
    aiTitleInput,
    setAiTitleInput,
    aiTitleGenerating,
    aiTitleResults,
    hasGeneratedTitles,
    activePreset: styleUpdaters.activePreset,
    titlePresets: styleUpdaters.titlePresets,
    // AI 标题操作
    handleGenerateAiTitles,
    handleSelectAiTitle,
    handleRefreshAiTitles,
    autoGenerateTitle,
    // 标题设置操作
    updateTitle: styleUpdaters.updateTitle,
    toggleAiAutoSelect: styleUpdaters.toggleAiAutoSelect,
    updatePosition: styleUpdaters.updatePosition,
    updateFont: styleUpdaters.updateFont,
    updateSize: styleUpdaters.updateSize,
    updateColor: styleUpdaters.updateColor,
    toggleBold: styleUpdaters.toggleBold,
    toggleItalic: styleUpdaters.toggleItalic,
    toggleStroke: styleUpdaters.toggleStroke,
    toggleShadow: styleUpdaters.toggleShadow,
    applyPreset: styleUpdaters.applyPreset,
  }
}

export default useStep4Title