From a5564d705d99444149ebac33754f4c1ed374229a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=8B=A0=ED=98=81=EC=88=98?=
 <122273080+sins051301@users.noreply.github.com>
Date: Sun, 23 Nov 2025 17:29:24 +0900
Subject: [PATCH] fix: toast stacking issue on mobile after closing a
 notification

---
 src/components/ToastContainer.tsx | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/src/components/ToastContainer.tsx b/src/components/ToastContainer.tsx
index a3d22b2c..f9231952 100644
--- a/src/components/ToastContainer.tsx
+++ b/src/components/ToastContainer.tsx
@@ -109,6 +109,22 @@ export function ToastContainer(props: ToastContainerProps) {
     };
   }, [hotKeys]);
 
+  useEffect(() => {
+    function handleOutsideInteraction(e: PointerEvent) {
+      const container = containerRef.current;
+      if (!container) return;
+
+      const target = e.target;
+
+      if (target instanceof Node && !container.contains(target)) {
+        setIsCollapsed(true);
+        toast.play();
+      }
+    }
+    document.addEventListener('pointerdown', handleOutsideInteraction);
+    return () => document.removeEventListener('pointerdown', handleOutsideInteraction);
+  }, []);
+
   return (
     <section
       ref={containerRef}