From ce4e9b95e878a2efd3a0ab337d88b8235a646203 Mon Sep 17 00:00:00 2001 From: xiaoxia Date: Mon, 14 Sep 2026 20:44:53 +0800 Subject: [PATCH] refactor: delete useAddPicker.ts (#1899 #1900) --- .../hooks/timeline-menus/useAddPicker.ts | 113 ------------------ 1 file changed, 113 deletions(-) delete mode 100755 apps/web/src/pages/editing-planner/hooks/timeline-menus/useAddPicker.ts diff --git a/apps/web/src/pages/editing-planner/hooks/timeline-menus/useAddPicker.ts b/apps/web/src/pages/editing-planner/hooks/timeline-menus/useAddPicker.ts deleted file mode 100755 index 7d0b9d4fd..000000000 --- a/apps/web/src/pages/editing-planner/hooks/timeline-menus/useAddPicker.ts +++ /dev/null @@ -1,113 +0,0 @@ -import { useState, useRef, useCallback, useEffect, useMemo, useLayoutEffect } from "react" -import type { ClipType } from "../../types" -import { DEFAULT_ADD_DURATION, ADD_PICKER_WIDTH, TRACK_GAP } from "../../constants/timeline" - -interface UseAddPickerOptions { - currentMode: string - onAddClip: (type: ClipType, duration: number) => void -} - -export function useAddPicker({ currentMode, onAddClip }: UseAddPickerOptions) { - const [showAddPicker, setShowAddPicker] = useState(false) - const pickerRef = useRef(null) - const addCardRef = useRef(null) - const [pickerPos, setPickerPos] = useState<{ top: number; right: number }>({ top: 0, right: 0 }) - - const availableTypes: ClipType[] = useMemo( - () => - currentMode === "voice_over" ? ["voice"] : currentMode === "pip" ? ["pip"] : ["voice", "pip"], - [currentMode], - ) - - const defaultAddType: ClipType = useMemo(() => { - if (currentMode === "voice_over") return "voice" - if (currentMode === "pip") return "pip" - return "voice" - }, [currentMode]) - - const [addType, setAddType] = useState(defaultAddType) - useEffect(() => { - if (!availableTypes.includes(addType)) { - setAddType(defaultAddType) - } - }, [currentMode, addType, availableTypes, defaultAddType]) - - const updatePickerPosition = useCallback(() => { - if (!addCardRef.current) return - const rect = addCardRef.current.getBoundingClientRect() - const vw = window.innerWidth - const roughHeight = 180 - let top = rect.top - TRACK_GAP - roughHeight - if (top < 8) top = 8 - let right = vw - rect.right - if (rect.right - ADD_PICKER_WIDTH < 8) { - right = vw - ADD_PICKER_WIDTH - 8 - } - setPickerPos({ top, right }) - }, []) - - const handleTogglePicker = useCallback(() => { - if (!showAddPicker) { - setAddType(defaultAddType) - updatePickerPosition() - } - setShowAddPicker((v) => !v) - }, [showAddPicker, defaultAddType, updatePickerPosition]) - - useLayoutEffect(() => { - if (!showAddPicker || !pickerRef.current || !addCardRef.current) return - const pickerEl = pickerRef.current - const addRect = addCardRef.current.getBoundingClientRect() - const pickerH = pickerEl.offsetHeight - const vh = window.innerHeight - const vw = window.innerWidth - - let top = addRect.top - TRACK_GAP - pickerH - if (top < 8) { - top = addRect.bottom + TRACK_GAP - if (top + pickerH > vh - 8) { - top = vh - 8 - pickerH - if (top < 8) top = 8 - } - } - - let right = vw - addRect.right - const pickerRect = pickerEl.getBoundingClientRect() - if (pickerRect.left < 8) { - right = vw - ADD_PICKER_WIDTH - 8 - } - - setPickerPos({ top, right }) - }, [showAddPicker]) - - useEffect(() => { - const handleClickOutside = (e: MouseEvent) => { - if (pickerRef.current && !pickerRef.current.contains(e.target as Node)) { - setShowAddPicker(false) - } - } - if (showAddPicker) { - document.addEventListener("mousedown", handleClickOutside) - } - return () => document.removeEventListener("mousedown", handleClickOutside) - }, [showAddPicker]) - - const handleConfirmAdd = useCallback(() => { - onAddClip(addType, DEFAULT_ADD_DURATION) - setShowAddPicker(false) - }, [onAddClip, addType]) - - return { - showAddPicker, - setShowAddPicker, - pickerRef, - addCardRef, - pickerPos, - availableTypes, - addType, - addDuration: DEFAULT_ADD_DURATION, - setAddType, - handleTogglePicker, - handleConfirmAdd, - } -}