refactor(update docs and fix initial props): update docs and fix comp…

…onents to not render
trycourier · May 16, 2024 · a8c48f3 · a8c48f3
1 parent 1cfeff7
commit a8c48f3
Show file tree

Hide file tree

Showing 8 changed files with 22 additions and 16 deletions.
diff --git a/packages/react-brand-designer/package.json b/packages/react-brand-designer/package.json
@@ -36,6 +36,6 @@
     "deep-extend": "0.6.x",
     "react": ">=17.X.X",
     "react-dom": ">=17.X.X",
-    "styled-components": ">=^5.X.X"
+    "styled-components": ">=5.X.X"
   }
 }
diff --git a/packages/react-elements/package.json b/packages/react-elements/package.json
@@ -37,6 +37,6 @@
     "deep-extend": "0.6.x",
     "react": ">=17.X.X",
     "react-dom": ">=17.X.X",
-    "styled-components": ">=^5.X.X"
+    "styled-components": ">=5.X.X"
   }
 }
diff --git a/packages/react-inbox-next/package.json b/packages/react-inbox-next/package.json
@@ -33,7 +33,7 @@
   "peerDependencies": {
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
-    "styled-components": ">=^5.X.X"
+    "styled-components": ">=5.X.X"
   },
   "files": [
     "dist/",

diff --git a/packages/react-inbox/package.json b/packages/react-inbox/package.json
@@ -37,7 +37,7 @@
     "@trycourier/react-provider": ">=4.X.X",
     "react": ">=17.X.X",
     "react-dom": ">=17.X.X",
-    "styled-components": ">=^5.X.X"
+    "styled-components": ">=5.X.X"
   },
   "files": [
     "dist/",

diff --git a/packages/react-inbox/src/components/Inbox/index.tsx b/packages/react-inbox/src/components/Inbox/index.tsx
@@ -297,13 +297,16 @@ const Inbox: React.FunctionComponent<InboxProps> = (props) => {
 
 const InboxWrapper: React.FunctionComponent<InboxProps> = (props) => {
   const courierContext = useCourier<{ inbox: InboxProps }>();
+  const contextExists = Boolean(courierContext);
 
-  if (!courierContext) {
-    console.warn("Inbox: Missing Courier Provider");
-    return null;
-  }
+  return useMemo(() => {
+    if (!contextExists) {
+      console.warn("Inbox: Missing Courier Provider");
+      return null;
+    }
 
-  return <Inbox {...props} />;
+    return <Inbox {...props} />;
+  }, [contextExists, props]);
 };
 
 export default InboxWrapper;
diff --git a/packages/react-preferences/package.json b/packages/react-preferences/package.json
@@ -16,7 +16,7 @@
     "@trycourier/react-provider": ">=4.X.X",
     "react": ">=17.X.X",
     "react-dom": ">=17.X.X",
-    "styled-components": ">=^5.X.X"
+    "styled-components": ">=5.X.X"
   },
   "files": [
     "dist/",

diff --git a/packages/react-toast/package.json b/packages/react-toast/package.json
@@ -35,7 +35,7 @@
     "@trycourier/react-provider": ">=4.X.X",
     "react": ">=17.X.X",
     "react-dom": ">=17.X.X",
-    "styled-components": ">=^5.X.X"
+    "styled-components": ">=5.X.X"
   },
   "files": [
     "dist/",

diff --git a/packages/react-toast/src/components/Toast/index.tsx b/packages/react-toast/src/components/Toast/index.tsx
@@ -100,13 +100,16 @@ export const Toast: React.FunctionComponent<IToastConfig> = (props) => {
 
 const ToastWrapper: React.FunctionComponent<IToastConfig> = (props) => {
   const courierContext = useCourier();
+  const contextExists = Boolean(courierContext);
 
-  if (!courierContext) {
-    console.warn("Toast: Missing Courier Provider");
-    return null;
-  }
+  return useMemo(() => {
+    if (!contextExists) {
+      console.warn("Toast: Missing Courier Provider");
+      return null;
+    }
 
-  return <Toast {...props} />;
+    return <Toast {...props} />;
+  }, [contextExists, props]);
 };
 
 export default ToastWrapper;