diff --git a/frontend/elements/src/contexts/AppProvider.tsx b/frontend/elements/src/contexts/AppProvider.tsx index 8225be78..bb3b8e4e 100644 --- a/frontend/elements/src/contexts/AppProvider.tsx +++ b/frontend/elements/src/contexts/AppProvider.tsx @@ -1,5 +1,5 @@ import { JSXInternal } from "preact/src/jsx"; -import { ComponentChildren, createContext, h, JSX } from "preact"; +import { ComponentChildren, createContext, h } from "preact"; import { TranslateProvider } from "@denysvuika/preact-translate"; import { @@ -370,41 +370,58 @@ const AppProvider = ({ }, [isReadyToInit, authComponentFlow, componentName, init]); useEffect(() => { - hanko.onUserDeleted(() => { + const cleanUserDeleted = hanko.onUserDeleted(() => { dispatchEvent("onUserDeleted"); }); - hanko.onSessionCreated((detail) => { + const cleanSessionCreated = hanko.onSessionCreated((detail) => { dispatchEvent("onSessionCreated", detail); }); - hanko.onSessionExpired(() => { + const cleanSessionExpired = hanko.onSessionExpired(() => { dispatchEvent("onSessionExpired"); }); - hanko.onUserLoggedOut(() => { + const cleanUserLoggedOut = hanko.onUserLoggedOut(() => { dispatchEvent("onUserLoggedOut"); }); - hanko.onBeforeStateChange((detail) => { + const cleanBeforeStateChange = hanko.onBeforeStateChange((detail) => { dispatchEvent("onBeforeStateChange", detail); }); - hanko.onAfterStateChange((detail) => { + const cleanAfterStateChange = hanko.onAfterStateChange((detail) => { dispatchEvent("onAfterStateChange", detail); }); + + return () => { + cleanUserDeleted(); + cleanSessionCreated(); + cleanSessionExpired(); + cleanUserLoggedOut(); + cleanBeforeStateChange(); + cleanAfterStateChange(); + }; }, [hanko]); - useMemo(() => { + useEffect(() => { const cb = () => { init(componentName); }; if (["auth", "login", "registration"].includes(componentName)) { - hanko.onUserLoggedOut(cb); - hanko.onSessionExpired(cb); - hanko.onUserDeleted(cb); + const cleanUserLoggedOut = hanko.onUserLoggedOut(cb); + const cleanSessionExpired = hanko.onSessionExpired(cb); + const cleanUserDeleted = hanko.onUserDeleted(cb); + return () => { + cleanUserLoggedOut(); + cleanSessionExpired(); + cleanUserDeleted(); + }; } else if (componentName === "profile") { - hanko.onSessionCreated(cb); + const cleanSessionCreated = hanko.onSessionCreated(cb); + return () => { + cleanSessionCreated(); + }; } }, [componentName, hanko, init]);