render component in place when context is not available instead of th…

…rowing
FormidableLabs · May 17, 2024 · 422b1db · 422b1db
1 parent 56e8765
commit 422b1db
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 26 deletions.
diff --git a/packages/victory-core/src/victory-portal/portal-context.tsx b/packages/victory-core/src/victory-portal/portal-context.tsx
@@ -13,12 +13,6 @@ PortalContext.displayName = "PortalContext";
 
 export const usePortalContext = () => {
   const context = React.useContext(PortalContext);
-
-  if (!context) {
-    throw new Error(
-      "`usePortalContext` must be used within a `<PortalProvider />`",
-    );
-  }
   return context;
 };
 

diff --git a/packages/victory-core/src/victory-portal/portal-outlet.tsx b/packages/victory-core/src/victory-portal/portal-outlet.tsx
@@ -17,7 +17,10 @@ export const PortalOutlet = ({
 }: PortalOutletProps) => {
   const portalContext = usePortalContext();
 
-  const children = Array.from(portalContext.children.values());
+  if (!portalContext) {
+    return null;
+  }
 
+  const children = Array.from(portalContext.children.values());
   return React.cloneElement(portalComponent, props, children);
 };
diff --git a/packages/victory-core/src/victory-portal/victory-portal.tsx b/packages/victory-core/src/victory-portal/victory-portal.tsx
@@ -25,33 +25,33 @@ export const VictoryPortal = (initialProps: VictoryPortalProps) => {
     Log.warn(msg);
   }
 
+  const children = Array.isArray(props.children)
+    ? props.children[0]
+    : props.children;
+  const { groupComponent } = props;
+  const childProps = (children && children.props) || {};
+  const standardProps = childProps.groupComponent
+    ? { groupComponent, standalone: false }
+    : {};
+  const newProps = defaults(
+    standardProps,
+    childProps,
+    Helpers.omit(props, ["children", "groupComponent"]),
+    { key: childProps.key ?? id },
+  );
+  const child = children && React.cloneElement(children, newProps);
+
   React.useEffect(() => {
-    const children = Array.isArray(props.children)
-      ? props.children[0]
-      : props.children;
-    const { groupComponent } = props;
-    const childProps = (children && children.props) || {};
-    const standardProps = childProps.groupComponent
-      ? { groupComponent, standalone: false }
-      : {};
-    const newProps = defaults(
-      standardProps,
-      childProps,
-      Helpers.omit(props, ["children", "groupComponent"]),
-      { key: childProps.key ?? id },
-    );
-    const child = children && React.cloneElement(children, newProps);
-
-    portalContext.addChild(id, child);
+    portalContext?.addChild(id, child);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [props.children]);
 
   React.useEffect(() => {
-    return () => portalContext.removeChild(id);
+    return () => portalContext?.removeChild(id);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  return null;
+  return portalContext ? null : child;
 };
 
 VictoryPortal.role = "portal";