fix(link): listen on the list and fix timeout

web/components/routes/link/LinkRoute.tsx

@@ -1,43 +1,53 @@
 "use client"
 
-import React, { useEffect, useState, useCallback } from "react"
+import React, { useEffect, useState, useCallback, useRef } from "react"
 import { LinkHeader } from "@/components/routes/link/header"
 import { LinkList } from "@/components/routes/link/list"
 import { LinkManage } from "@/components/routes/link/manage"
 import { useQueryState } from "nuqs"
 import { atom, useAtom } from "jotai"
-import { linkEditIdAtom } from "@/store/link"
 import { LinkBottomBar } from "./bottom-bar"
 import { commandPaletteOpenAtom } from "@/components/custom/command-palette/command-palette"
 
 export const isDeleteConfirmShownAtom = atom(false)
 
 export function LinkRoute(): React.ReactElement {
-	const [, setEditId] = useAtom(linkEditIdAtom)
 	const [nuqsEditId] = useQueryState("editId")
 	const [activeItemIndex, setActiveItemIndex] = useState<number | null>(null)
 	const [isCommandPaletteOpen] = useAtom(commandPaletteOpenAtom)
 	const [isDeleteConfirmShown] = useAtom(isDeleteConfirmShownAtom)
 	const [disableEnterKey, setDisableEnterKey] = useState(false)
-
-	useEffect(() => {
-		setEditId(nuqsEditId)
-	}, [nuqsEditId, setEditId])
+	const timeoutRef = useRef<NodeJS.Timeout | null>(null)
 
 	const handleCommandPaletteClose = useCallback(() => {
+		if (timeoutRef.current) {
+			clearTimeout(timeoutRef.current)
+		}
+
 		setDisableEnterKey(true)
-		setTimeout(() => setDisableEnterKey(false), 100)
+		timeoutRef.current = setTimeout(() => {
+			setDisableEnterKey(false)
+			timeoutRef.current = null
+		}, 100)
 	}, [])
 
 	useEffect(() => {
-		if (!isCommandPaletteOpen) {
+		if (isDeleteConfirmShown || isCommandPaletteOpen) {
+			setDisableEnterKey(true)
+			if (timeoutRef.current) {
+				clearTimeout(timeoutRef.current)
+				timeoutRef.current = null
+			}
+		} else if (!isCommandPaletteOpen) {
 			handleCommandPaletteClose()
 		}
-	}, [isCommandPaletteOpen, handleCommandPaletteClose])
 
-	useEffect(() => {
-		setDisableEnterKey(isDeleteConfirmShown || isCommandPaletteOpen)
-	}, [isDeleteConfirmShown, isCommandPaletteOpen])
+		return () => {
+			if (timeoutRef.current) {
+				clearTimeout(timeoutRef.current)
+			}
+		}
+	}, [isDeleteConfirmShown, isCommandPaletteOpen, handleCommandPaletteClose])
 
 	return (
 		<div className="flex h-full flex-auto flex-col overflow-hidden">