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

/**
 * Step 1 模板选择 Hook
 * 封装模板选择的交互逻辑
 */
import { useCallback } from "react"
import type { EditingTemplate } from "@/api/editing-planner"

interface UseStep1TemplateProps {
  templates: EditingTemplate[]
  selectedTemplate: string
  onSelectTemplate: (id: string) => void
}

export function useStep1Template({
  templates,
  selectedTemplate,
  onSelectTemplate,
}: UseStep1TemplateProps) {
  const handleSelect = useCallback(
    (id: string) => {
      onSelectTemplate(id)
    },
    [onSelectTemplate],
  )

  const handleKeySelect = useCallback(
    (e: React.KeyboardEvent, id: string) => {
      if (e.key === "Enter" || e.key === " ") {
        e.preventDefault()
        onSelectTemplate(id)
      }
    },
    [onSelectTemplate],
  )

  return {
    templates,
    selectedTemplate,
    handleSelect,
    handleKeySelect,
  }
}

export default useStep1Template