diff --git a/frontend/src/hooks/use-iframe-skill.ts b/frontend/src/hooks/use-iframe-skill.ts deleted file mode 100644 index 8e381a70..00000000 --- a/frontend/src/hooks/use-iframe-skill.ts +++ /dev/null @@ -1,92 +0,0 @@ -import { useSearchParams } from "next/navigation"; -import { useState, useEffect, useCallback } from "react"; - -const POST_MESSAGE_TYPES = { - SELECT_SKILL: "selectSkill", - OPEN_SKILL_DIALOG: "openSkillDialog", -} as const; - -const RECEIVE_MESSAGE_TYPES = { - SELECTED_SKILL: "selectedSkill", -} as const; - -type SelectedSkillMessage = { - type: typeof RECEIVE_MESSAGE_TYPES.SELECTED_SKILL; - id: string | number; - title: string; -}; - -function sendToParent(message: unknown): void { - if (window.parent !== window) { - window.parent.postMessage(message, "*"); - } -} - -// Skill 数据类型 -interface SkillData { - skill_id: string; - title: string; -} - -// Hook 返回类型 -interface UseIframeSkillReturn { - selectedSkill: SkillData | null; - sendSelectSkill: (skill_id: string) => void; - openSkillDialog: () => void; - clearSkill: () => void; -} - -export function useIframeSkill(): UseIframeSkillReturn { - const searchParams = useSearchParams(); - const skillIdFromQuery = searchParams.get("skill_id"); - const titleFromQuery = searchParams.get("title"); - - const [selectedSkill, setSelectedSkill] = useState(null); - - // 1. 监听 query 参数变化 - useEffect(() => { - if (skillIdFromQuery && titleFromQuery) { - setSelectedSkill({ skill_id: skillIdFromQuery, title: titleFromQuery }); - } - }, [skillIdFromQuery, titleFromQuery]); - - // 2. 监听宿主页 postMessage - useEffect(() => { - const handleMessage = (event: MessageEvent) => { - if (event.data?.type === RECEIVE_MESSAGE_TYPES.SELECTED_SKILL) { - const { id, title } = event.data as SelectedSkillMessage; - setSelectedSkill({ skill_id: String(id), title }); - } - }; - window.addEventListener("message", handleMessage); - return () => window.removeEventListener("message", handleMessage); - }, []); - - // 发送选择预定义 skill - const sendSelectSkill = useCallback((skill_id: string) => { - const message = { type: POST_MESSAGE_TYPES.SELECT_SKILL, skill_id }; - console.log("[useIframeSkill] sendSelectSkill:", message); - sendToParent(message); - }, []); - - // 打开 skill 选择对话框 - const openSkillDialog = useCallback(() => { - const message = { - type: POST_MESSAGE_TYPES.OPEN_SKILL_DIALOG, - openSkillDialog: true, - } as const; - console.log("[useIframeSkill] openSkillDialog:", message); - sendToParent(message); - }, []); - - // 清除选中并发送 skill_id=0 给主页 - const clearSkill = useCallback(() => { - setSelectedSkill(null); - // 发送 skill_id=0 给主页,通知取消选择 - const message = { type: POST_MESSAGE_TYPES.SELECT_SKILL, skill_id: "0" }; - console.log("[useIframeSkill] clearSkill, sending skill_id=0:", message); - sendToParent(message); - }, []); - - return { selectedSkill, sendSelectSkill, openSkillDialog, clearSkill }; -}