add header

src/app/hooks/useClickOutside.tsx

@@ -0,0 +1,24 @@
+'use client';
+
+import { useEffect, RefObject } from 'react';
+
+export function useClickOutside(
+	ref: RefObject<HTMLDivElement | null>,
+	callback: () => void
+) {
+	useEffect(() => {
+		const handleClick = (event: MouseEvent) => {
+			if (!ref) {
+				return;
+			}
+			if (ref.current && !ref.current.contains(event.target as Node)) {
+				callback();
+			}
+		};
+
+		document.addEventListener('mousedown', handleClick);
+		return () => {
+			document.removeEventListener('mousedown', handleClick);
+		};
+	}, [ref, callback]);
+}