fix: initializing current overlay after close all overlays (#119)

* test: add test for current overlay state when all overlays are closed

* fix: Reset current overlay to null when closing all overlays

* Create stupid-boxes-pay.md

---------

Co-authored-by: Yongbeen Im <meis1541@naver.com>
Co-authored-by: Yongbeen Im <been.im@toss.im>

Author: ho991217

.changeset/stupid-boxes-pay.md

@@ -0,0 +1,5 @@
+---
+"overlay-kit": patch
+---
+
+fix: initializing current overlay after close all overlays

packages/src/context/reducer.ts

@@ -114,6 +114,7 @@ export function overlayReducer(state: OverlayData, action: OverlayReducerAction)
     case 'CLOSE_ALL': {
       return {
         ...state,
+        current: null,
         overlayData: Object.keys(state.overlayData).reduce(
           (prev, curr) => ({
             ...prev,

packages/src/event.test.tsx

@@ -288,6 +288,39 @@ describe('overlay object', () => {
     });
   });
 
+  it('should not be able to get current overlay when all overlays are closed', async () => {
+    const contents = {
+      first: 'overlay-content-1',
+      second: 'overlay-content-2',
+    };
+
+    function Component() {
+      const current = useCurrentOverlay();
+
+      useEffect(() => {
+        // Open 2 overlays sequentially
+        overlay.open(({ isOpen }) => isOpen && <div data-testid="overlay-1">{contents.first}</div>);
+        overlay.open(({ isOpen }) => isOpen && <div data-testid="overlay-2">{contents.second}</div>);
+      }, []);
+
+      return <div data-testid="current-overlay">{current}</div>;
+    }
+
+    render(<Component />, { wrapper });
+
+    // Wait for all overlays to be mounted
+    await waitFor(() => {
+      expect(screen.getByTestId('overlay-1')).toBeInTheDocument();
+      expect(screen.getByTestId('overlay-2')).toBeInTheDocument();
+    });
+
+    // close all overlays
+    overlay.closeAll();
+    await waitFor(() => {
+      expect(screen.getByTestId('current-overlay')).toHaveTextContent('');
+    });
+  });
+
   it('should be able to unmount all overlays', async () => {
     const contents = {
       first: 'overlay-content-1',