1 files changed, 36 insertions, 0 deletions
diff --git a/apps/web/src/hooks/use-reveal-item.ts b/apps/web/src/hooks/use-reveal-item.ts
new file mode 100644
index 00000000..5004f60c
--- /dev/null
+++ b/apps/web/src/hooks/use-reveal-item.ts
@@ -0,0 +1,36 @@
+import { useEffect, useState, useRef } from "react";
+
+export function useRevealItem(
+	highlightId: string | null,
+	onClearHighlight: () => void,
+	highlightDuration = 1000,
+) {
+	const [highlightedId, setHighlightedId] = useState<string | null>(null);
+	const elementRefs = useRef<Map<string, HTMLElement>>(new Map());
+
+	const registerElement = (id: string, element: HTMLElement | null) => {
+		if (element) {
+			elementRefs.current.set(id, element);
+		} else {
+			elementRefs.current.delete(id);
+		}
+	};
+
+	useEffect(() => {
+		if (!highlightId) return;
+
+		setHighlightedId(highlightId);
+
+		const target = elementRefs.current.get(highlightId);
+		target?.scrollIntoView({ block: "center" });
+
+		const timeout = setTimeout(() => {
+			setHighlightedId(null);
+			onClearHighlight();
+		}, highlightDuration);
+
+		return () => clearTimeout(timeout);
+	}, [highlightId, onClearHighlight, highlightDuration]);
+
+	return { highlightedId, registerElement };
+}