From 7aa413ff6483b6ad326b14365e854cd85c8325d9 Mon Sep 17 00:00:00 2001
From: Vitaly Rtishchev <rtivital@gmail.com>
Date: Fri, 12 Aug 2022 08:40:45 +0300
Subject: [PATCH] [@mantine/utils] Fix custom events not firing in strict mode

---
 .../create-use-external-events.ts             | 23 ++++++++-----------
 1 file changed, 10 insertions(+), 13 deletions(-)

diff --git a/src/mantine-utils/src/create-use-external-events/create-use-external-events.ts b/src/mantine-utils/src/create-use-external-events/create-use-external-events.ts
index ff59863f6b7..36de645d084 100644
--- a/src/mantine-utils/src/create-use-external-events/create-use-external-events.ts
+++ b/src/mantine-utils/src/create-use-external-events/create-use-external-events.ts
@@ -1,9 +1,11 @@
-import { useEffect, useMemo } from 'react';
+import { useEffect, useLayoutEffect } from 'react';
 
 function dispatchEvent<T>(type: string, detail?: T) {
   window.dispatchEvent(new CustomEvent(type, { detail }));
 }
 
+const useIsomorphicEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
+
 export function createUseExternalEvents<Handlers extends Record<string, (detail: any) => void>>(
   prefix: string
 ) {
@@ -13,22 +15,17 @@ export function createUseExternalEvents<Handlers extends Record<string, (detail:
       return acc;
     }, {});
 
-    useMemo(() => {
-      if (typeof window !== 'undefined') {
+    useIsomorphicEffect(() => {
+      Object.keys(handlers).forEach((eventKey) => {
+        window.removeEventListener(eventKey, handlers[eventKey]);
+        window.addEventListener(eventKey, handlers[eventKey]);
+      });
+
+      return () =>
         Object.keys(handlers).forEach((eventKey) => {
           window.removeEventListener(eventKey, handlers[eventKey]);
-          window.addEventListener(eventKey, handlers[eventKey]);
         });
-      }
     }, []);
-
-    useEffect(
-      () => () =>
-        Object.keys(handlers).forEach((eventKey) => {
-          window.removeEventListener(eventKey, handlers[eventKey]);
-        }),
-      []
-    );
   }
 
   function createEvent<EventKey extends keyof Handlers>(event: EventKey) {