@knocklabs/react-core 0.6.3 → 0.6.4

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 0.6.4
+
+### Patch Changes
+
+- 96d70bc: fixes memory leak when unmounting the useNotifications hook
+
 ## 0.6.3
 
 ### Patch Changes

package/dist/cjs/modules/feed/hooks/useNotifications.js

@@ -1,2 +1,2 @@
-"use strict";const i=require("react");require("../../core/context/KnockProvider.js");require("@knocklabs/client");const o=require("../../core/hooks/useStableOptions.js");require("date-fns");function a(r,t,n={}){const e=i.useRef(),s=o(n);return i.useMemo(()=>(e.current&&e.current.dispose(),e.current=r.feeds.initialize(t,s),e.current.store.subscribe(c=>{var u;return(u=e==null?void 0:e.current)==null?void 0:u.store.setState(c)}),e.current.listenForUpdates(),e.current),[r,t,s])}module.exports=a;
+"use strict";const r=require("react");require("../../core/context/KnockProvider.js");require("@knocklabs/client");const o=require("../../core/hooks/useStableOptions.js");require("date-fns");function a(t,s,n={}){const e=r.useRef(),u=o(n);return r.useEffect(()=>()=>{e.current&&e.current.dispose()},[]),r.useMemo(()=>(e.current&&e.current.dispose(),e.current=t.feeds.initialize(s,u),e.current.store.subscribe(c=>{var i;return(i=e==null?void 0:e.current)==null?void 0:i.store.setState(c)}),e.current.listenForUpdates(),e.current),[t,s,u])}module.exports=a;
 //# sourceMappingURL=useNotifications.js.map

package/dist/cjs/modules/feed/hooks/useNotifications.js.map

@@ -1 +1 @@
-{"version":3,"file":"useNotifications.js","sources":["../../../../../src/modules/feed/hooks/useNotifications.ts"],"sourcesContent":["import Knock, { Feed, FeedClientOptions } from \"@knocklabs/client\";\nimport { useMemo, useRef } from \"react\";\n\nimport { useStableOptions } from \"../../core\";\n\nfunction useNotifications(\n  knock: Knock,\n  feedChannelId: string,\n  options: FeedClientOptions = {},\n) {\n  const feedClientRef = useRef<Feed>();\n  const stableOptions = useStableOptions(options);\n\n  return useMemo(() => {\n    if (feedClientRef.current) {\n      feedClientRef.current.dispose();\n    }\n\n    feedClientRef.current = knock.feeds.initialize(\n      feedChannelId,\n      stableOptions,\n    );\n\n    // In development, we need to introduce this extra set state to force a render\n    // for Zustand as otherwise the state doesn't get reflected correctly\n    feedClientRef.current.store.subscribe((t) =>\n      feedClientRef?.current?.store.setState(t),\n    );\n\n    feedClientRef.current.listenForUpdates();\n\n    return feedClientRef.current;\n  }, [knock, feedChannelId, stableOptions]);\n}\n\nexport default useNotifications;\n"],"names":["useNotifications","knock","feedChannelId","options","feedClientRef","useRef","stableOptions","useStableOptions","useMemo","current","dispose","feeds","initialize","store","subscribe","t","setState","listenForUpdates"],"mappings":"8LAKA,SAASA,EACPC,EACAC,EACAC,EAA6B,CAAA,EAC7B,CACA,MAAMC,EAAgBC,EAAAA,OAAa,EAC7BC,EAAgBC,EAAiBJ,CAAO,EAE9C,OAAOK,UAAQ,KACTJ,EAAcK,SAChBL,EAAcK,QAAQC,QAAQ,EAGhCN,EAAcK,QAAUR,EAAMU,MAAMC,WAClCV,EACAI,CACF,EAIcG,EAAAA,QAAQI,MAAMC,UAAWC,UACrCX,OAAAA,EAAAA,GAAAA,YAAAA,EAAeK,UAAfL,YAAAA,EAAwBS,MAAMG,SAASD,GACzC,EAEAX,EAAcK,QAAQQ,iBAAiB,EAEhCb,EAAcK,SACpB,CAACR,EAAOC,EAAeI,CAAa,CAAC,CAC1C"}
+{"version":3,"file":"useNotifications.js","sources":["../../../../../src/modules/feed/hooks/useNotifications.ts"],"sourcesContent":["import Knock, { Feed, FeedClientOptions } from \"@knocklabs/client\";\nimport { useEffect, useMemo, useRef } from \"react\";\n\nimport { useStableOptions } from \"../../core\";\n\nfunction useNotifications(\n  knock: Knock,\n  feedChannelId: string,\n  options: FeedClientOptions = {},\n) {\n  const feedClientRef = useRef<Feed>();\n  const stableOptions = useStableOptions(options);\n\n  useEffect(() => {\n    return () => {\n      if (feedClientRef.current) {\n        feedClientRef.current.dispose();\n      }\n    };\n  }, []);\n\n  return useMemo(() => {\n    if (feedClientRef.current) {\n      feedClientRef.current.dispose();\n    }\n\n    feedClientRef.current = knock.feeds.initialize(\n      feedChannelId,\n      stableOptions,\n    );\n\n    // In development, we need to introduce this extra set state to force a render\n    // for Zustand as otherwise the state doesn't get reflected correctly\n    feedClientRef.current.store.subscribe((t) =>\n      feedClientRef?.current?.store.setState(t),\n    );\n\n    feedClientRef.current.listenForUpdates();\n\n    return feedClientRef.current;\n  }, [knock, feedChannelId, stableOptions]);\n}\n\nexport default useNotifications;\n"],"names":["useNotifications","knock","feedChannelId","options","feedClientRef","useRef","stableOptions","useStableOptions","useEffect","current","dispose","useMemo","feeds","initialize","store","subscribe","t","setState","listenForUpdates"],"mappings":"8LAKA,SAASA,EACPC,EACAC,EACAC,EAA6B,CAAA,EAC7B,CACA,MAAMC,EAAgBC,EAAAA,OAAa,EAC7BC,EAAgBC,EAAiBJ,CAAO,EAE9CK,OAAAA,EAAAA,UAAU,IACD,IAAM,CACPJ,EAAcK,SAChBL,EAAcK,QAAQC,QAAQ,CAElC,EACC,EAAE,EAEEC,UAAQ,KACTP,EAAcK,SAChBL,EAAcK,QAAQC,QAAQ,EAGhCN,EAAcK,QAAUR,EAAMW,MAAMC,WAClCX,EACAI,CACF,EAIcG,EAAAA,QAAQK,MAAMC,UAAWC,UACrCZ,OAAAA,EAAAA,GAAAA,YAAAA,EAAeK,UAAfL,YAAAA,EAAwBU,MAAMG,SAASD,GACzC,EAEAZ,EAAcK,QAAQS,iBAAiB,EAEhCd,EAAcK,SACpB,CAACR,EAAOC,EAAeI,CAAa,CAAC,CAC1C"}

package/dist/esm/modules/feed/hooks/useNotifications.mjs

@@ -1,14 +1,16 @@
-import { useRef as n, useMemo as c } from "react";
+import { useRef as n, useEffect as c, useMemo as p } from "react";
 import "../../core/context/KnockProvider.mjs";
 import "@knocklabs/client";
-import p from "../../core/hooks/useStableOptions.mjs";
+import f from "../../core/hooks/useStableOptions.mjs";
 import "date-fns";
-function O(r, e, i = {}) {
-  const t = n(), s = p(i);
-  return c(() => (t.current && t.current.dispose(), t.current = r.feeds.initialize(e, s), t.current.store.subscribe((u) => {
-    var o;
-    return (o = t == null ? void 0 : t.current) == null ? void 0 : o.store.setState(u);
-  }), t.current.listenForUpdates(), t.current), [r, e, s]);
+function O(t, e, o = {}) {
+  const r = n(), s = f(o);
+  return c(() => () => {
+    r.current && r.current.dispose();
+  }, []), p(() => (r.current && r.current.dispose(), r.current = t.feeds.initialize(e, s), r.current.store.subscribe((u) => {
+    var i;
+    return (i = r == null ? void 0 : r.current) == null ? void 0 : i.store.setState(u);
+  }), r.current.listenForUpdates(), r.current), [t, e, s]);
 }
 export {
   O as default

package/dist/esm/modules/feed/hooks/useNotifications.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useNotifications.mjs","sources":["../../../../../src/modules/feed/hooks/useNotifications.ts"],"sourcesContent":["import Knock, { Feed, FeedClientOptions } from \"@knocklabs/client\";\nimport { useMemo, useRef } from \"react\";\n\nimport { useStableOptions } from \"../../core\";\n\nfunction useNotifications(\n  knock: Knock,\n  feedChannelId: string,\n  options: FeedClientOptions = {},\n) {\n  const feedClientRef = useRef<Feed>();\n  const stableOptions = useStableOptions(options);\n\n  return useMemo(() => {\n    if (feedClientRef.current) {\n      feedClientRef.current.dispose();\n    }\n\n    feedClientRef.current = knock.feeds.initialize(\n      feedChannelId,\n      stableOptions,\n    );\n\n    // In development, we need to introduce this extra set state to force a render\n    // for Zustand as otherwise the state doesn't get reflected correctly\n    feedClientRef.current.store.subscribe((t) =>\n      feedClientRef?.current?.store.setState(t),\n    );\n\n    feedClientRef.current.listenForUpdates();\n\n    return feedClientRef.current;\n  }, [knock, feedChannelId, stableOptions]);\n}\n\nexport default useNotifications;\n"],"names":["useNotifications","knock","feedChannelId","options","feedClientRef","useRef","stableOptions","useStableOptions","useMemo","current","dispose","feeds","initialize","store","subscribe","t","setState","listenForUpdates"],"mappings":";;;;;AAKA,SAASA,EACPC,GACAC,GACAC,IAA6B,CAAA,GAC7B;AACA,QAAMC,IAAgBC,EAAa,GAC7BC,IAAgBC,EAAiBJ,CAAO;AAE9C,SAAOK,EAAQ,OACTJ,EAAcK,WAChBL,EAAcK,QAAQC,QAAQ,GAGhCN,EAAcK,UAAUR,EAAMU,MAAMC,WAClCV,GACAI,CACF,GAIcG,EAAAA,QAAQI,MAAMC,UAAWC,CAAAA;;AACrCX,YAAAA,IAAAA,KAAAA,gBAAAA,EAAeK,YAAfL,gBAAAA,EAAwBS,MAAMG,SAASD;AAAAA,GACzC,GAEAX,EAAcK,QAAQQ,iBAAiB,GAEhCb,EAAcK,UACpB,CAACR,GAAOC,GAAeI,CAAa,CAAC;AAC1C;"}
+{"version":3,"file":"useNotifications.mjs","sources":["../../../../../src/modules/feed/hooks/useNotifications.ts"],"sourcesContent":["import Knock, { Feed, FeedClientOptions } from \"@knocklabs/client\";\nimport { useEffect, useMemo, useRef } from \"react\";\n\nimport { useStableOptions } from \"../../core\";\n\nfunction useNotifications(\n  knock: Knock,\n  feedChannelId: string,\n  options: FeedClientOptions = {},\n) {\n  const feedClientRef = useRef<Feed>();\n  const stableOptions = useStableOptions(options);\n\n  useEffect(() => {\n    return () => {\n      if (feedClientRef.current) {\n        feedClientRef.current.dispose();\n      }\n    };\n  }, []);\n\n  return useMemo(() => {\n    if (feedClientRef.current) {\n      feedClientRef.current.dispose();\n    }\n\n    feedClientRef.current = knock.feeds.initialize(\n      feedChannelId,\n      stableOptions,\n    );\n\n    // In development, we need to introduce this extra set state to force a render\n    // for Zustand as otherwise the state doesn't get reflected correctly\n    feedClientRef.current.store.subscribe((t) =>\n      feedClientRef?.current?.store.setState(t),\n    );\n\n    feedClientRef.current.listenForUpdates();\n\n    return feedClientRef.current;\n  }, [knock, feedChannelId, stableOptions]);\n}\n\nexport default useNotifications;\n"],"names":["useNotifications","knock","feedChannelId","options","feedClientRef","useRef","stableOptions","useStableOptions","useEffect","current","dispose","useMemo","feeds","initialize","store","subscribe","t","setState","listenForUpdates"],"mappings":";;;;;AAKA,SAASA,EACPC,GACAC,GACAC,IAA6B,CAAA,GAC7B;AACA,QAAMC,IAAgBC,EAAa,GAC7BC,IAAgBC,EAAiBJ,CAAO;AAE9CK,SAAAA,EAAU,MACD,MAAM;AACX,IAAIJ,EAAcK,WAChBL,EAAcK,QAAQC,QAAQ;AAAA,EAElC,GACC,EAAE,GAEEC,EAAQ,OACTP,EAAcK,WAChBL,EAAcK,QAAQC,QAAQ,GAGhCN,EAAcK,UAAUR,EAAMW,MAAMC,WAClCX,GACAI,CACF,GAIcG,EAAAA,QAAQK,MAAMC,UAAWC,CAAAA;;AACrCZ,YAAAA,IAAAA,KAAAA,gBAAAA,EAAeK,YAAfL,gBAAAA,EAAwBU,MAAMG,SAASD;AAAAA,GACzC,GAEAZ,EAAcK,QAAQS,iBAAiB,GAEhCd,EAAcK,UACpB,CAACR,GAAOC,GAAeI,CAAa,CAAC;AAC1C;"}

package/dist/types/modules/feed/hooks/useNotifications.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useNotifications.d.ts","sourceRoot":"","sources":["../../../../../src/modules/feed/hooks/useNotifications.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAKnE,iBAAS,gBAAgB,CACvB,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,MAAM,EACrB,OAAO,GAAE,iBAAsB,QAyBhC;AAED,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"useNotifications.d.ts","sourceRoot":"","sources":["../../../../../src/modules/feed/hooks/useNotifications.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAKnE,iBAAS,gBAAgB,CACvB,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,MAAM,EACrB,OAAO,GAAE,iBAAsB,QAiChC;AAED,eAAe,gBAAgB,CAAC"}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@knocklabs/react-core",
   "description": "A set of React components to build notification experiences powered by Knock",
   "author": "@knocklabs",
-  "version": "0.6.3",
+  "version": "0.6.4",
   "license": "MIT",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.mjs",
@@ -11,10 +11,10 @@
   "react-native": "./src/index.ts",
   "exports": {
     ".": {
-      "require": "./dist/cjs/index.js",
-      "import": "./dist/esm/index.mjs",
       "types": "./dist/types/index.d.ts",
       "react-native": "./src/index.ts",
+      "require": "./dist/cjs/index.js",
+      "import": "./dist/esm/index.mjs",
       "default": "./dist/cjs/index.js"
     }
   },
@@ -67,15 +67,15 @@
     "eslint": "^8.56.0",
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.14",
-    "jsdom": "^25.0.1",
+    "jsdom": "^26.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "rimraf": "^6.0.1",
     "rollup-plugin-execute": "^1.1.1",
     "typescript": "^5.8.3",
-    "vite": "^5.0.0",
+    "vite": "^5.4.18",
     "vite-plugin-dts": "^4.5.0",
     "vite-plugin-no-bundle": "^4.0.0",
-    "vitest": "^2.1.8"
+    "vitest": "^3.1.1"
   }
 }

package/src/modules/feed/hooks/useNotifications.ts

@@ -1,5 +1,5 @@
 import Knock, { Feed, FeedClientOptions } from "@knocklabs/client";
-import { useMemo, useRef } from "react";
+import { useEffect, useMemo, useRef } from "react";
 
 import { useStableOptions } from "../../core";
 
@@ -11,6 +11,14 @@ function useNotifications(
   const feedClientRef = useRef<Feed>();
   const stableOptions = useStableOptions(options);
 
+  useEffect(() => {
+    return () => {
+      if (feedClientRef.current) {
+        feedClientRef.current.dispose();
+      }
+    };
+  }, []);
+
   return useMemo(() => {
     if (feedClientRef.current) {
       feedClientRef.current.dispose();