Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
function ConnectFunction(props) {
const [propsContext, forwardedRef, wrapperProps] = useMemo(() => {
// Distinguish between actual "data" props that were passed to the wrapper component,
// and values needed to control behavior (forwarded refs, alternate context instances).
// To maintain the wrapperProps object reference, memoize this destructuring.
const { forwardedRef, ...wrapperProps } = props;
return [props.context, forwardedRef, wrapperProps];
}, [props]);
const ContextToUse = useMemo(() => {
// Users may optionally pass in a custom context instance to use instead of our ReactReduxContext.
// Memoize the check that determines which context instance we should use.
return propsContext &&
propsContext.Consumer
// && isContextConsumer()
? propsContext
: Context;
}, [propsContext, Context]);
// Retrieve the store and ancestor subscription via context, if available
const contextValue = useContext(ContextToUse);
// The store _must_ exist as either a prop or in context
const didStoreComeFromProps = Boolean(props.store);
const didStoreComeFromContext =
Boolean(contextValue) && Boolean(contextValue.store);
);
// `notifyNestedSubs` is duplicated to handle the case where the component is unmounted in
// the middle of the notification loop, where `subscription` will then be null. This can
// probably be avoided if Subscription's listeners logic is changed to not call listeners
// that have been unsubscribed in the middle of the notification loop.
const notifyNestedSubs = subscription.notifyNestedSubs.bind(
subscription
);
return [subscription, notifyNestedSubs];
}, [store, didStoreComeFromProps, contextValue]);
// Determine what {store, subscription} value should be put into nested context, if necessary,
// and memoize that value to avoid unnecessary context updates.
const overriddenContextValue = useMemo(() => {
if (didStoreComeFromProps) {
// This component is directly subscribed to a store from props.
// We don't want descendants reading from this store - pass down whatever
// the existing context value is from the nearest connected ancestor.
return contextValue;
}
// Otherwise, put this component's subscription instance into context, so that
// connected descendants won't update until after this component is done
return {
...contextValue,
subscription
};
}, [didStoreComeFromProps, contextValue, subscription]);
// We need to force this wrapper component to re-render whenever a Redux store update
}
};
return unsubscribeWrapper;
}, [store, subscription, childPropsSelector]);
// Now that all that's done, we can finally try to actually render the child component.
// We memoize the elements for the rendered child component as an optimization.
const renderedWrappedComponent = useMemo(
() => ,
[forwardedRef, WrappedComponent, actualChildProps]
);
// If React sees the exact same element reference as last time, it bails out of re-rendering
// that child, same as if it was wrapped in React.memo() or returned false from shouldComponentUpdate.
const renderedChild = useMemo(() => {
if (shouldHandleStateChanges) {
// If this component is subscribed to store updates, we need to pass its own
// subscription instance down to our descendants. That means rendering the same
// Context instance, and putting a different value into the context.
return (
{renderedWrappedComponent}
);
}
return renderedWrappedComponent;
}, [ContextToUse, renderedWrappedComponent, overriddenContextValue]);
return renderedChild;
}
// The store _must_ exist as either a prop or in context
const didStoreComeFromProps = Boolean(props.store);
const didStoreComeFromContext =
Boolean(contextValue) && Boolean(contextValue.store);
invariant(
didStoreComeFromProps || didStoreComeFromContext,
'Could not find "store" in the context of ' +
`"${displayName}". Either wrap the root component in a , ` +
'or pass a custom React context provider to and the corresponding ' +
`React context consumer to ${displayName} in connect options.`
);
const store = props.store || contextValue.store;
const childPropsSelector = useMemo(() => {
// The child props selector needs the store reference as an input.
// Re-create this selector whenever the store changes.
return createChildSelector(store);
}, [store]);
const [subscription, notifyNestedSubs] = useMemo(() => {
if (!shouldHandleStateChanges) return NO_SUBSCRIPTION_ARRAY;
// This Subscription's source should match where store came from: props vs. context. A component
// connected to the store via props shouldn't use subscription from context, or vice versa.
const subscription = new Subscription(
store,
didStoreComeFromProps ? null : contextValue.subscription
);
// `notifyNestedSubs` is duplicated to handle the case where the component is unmounted in
if (lastThrownError) {
// It's possible that we caught an error due to a bad mapState function, but the
// parent re-rendered without this component and we're about to unmount.
// This shouldn't happen as long as we do top-down subscriptions correctly, but
// if we ever do those wrong, this throw will surface the error in our tests.
// In that case, throw the error from here so it doesn't get lost.
throw lastThrownError;
}
};
return unsubscribeWrapper;
}, [store, subscription, childPropsSelector]);
// Now that all that's done, we can finally try to actually render the child component.
// We memoize the elements for the rendered child component as an optimization.
const renderedWrappedComponent = useMemo(
() => ,
[forwardedRef, WrappedComponent, actualChildProps]
);
// If React sees the exact same element reference as last time, it bails out of re-rendering
// that child, same as if it was wrapped in React.memo() or returned false from shouldComponentUpdate.
const renderedChild = useMemo(() => {
if (shouldHandleStateChanges) {
// If this component is subscribed to store updates, we need to pass its own
// subscription instance down to our descendants. That means rendering the same
// Context instance, and putting a different value into the context.
return (
{renderedWrappedComponent}
);
didStoreComeFromProps || didStoreComeFromContext,
'Could not find "store" in the context of ' +
`"${displayName}". Either wrap the root component in a , ` +
'or pass a custom React context provider to and the corresponding ' +
`React context consumer to ${displayName} in connect options.`
);
const store = props.store || contextValue.store;
const childPropsSelector = useMemo(() => {
// The child props selector needs the store reference as an input.
// Re-create this selector whenever the store changes.
return createChildSelector(store);
}, [store]);
const [subscription, notifyNestedSubs] = useMemo(() => {
if (!shouldHandleStateChanges) return NO_SUBSCRIPTION_ARRAY;
// This Subscription's source should match where store came from: props vs. context. A component
// connected to the store via props shouldn't use subscription from context, or vice versa.
const subscription = new Subscription(
store,
didStoreComeFromProps ? null : contextValue.subscription
);
// `notifyNestedSubs` is duplicated to handle the case where the component is unmounted in
// the middle of the notification loop, where `subscription` will then be null. This can
// probably be avoided if Subscription's listeners logic is changed to not call listeners
// that have been unsubscribed in the middle of the notification loop.
const notifyNestedSubs = subscription.notifyNestedSubs.bind(
subscription
);
function CapitalizedText(props) {
const text = props.text;
const capitalizedText = useMemo(
() => {
return text.toUpperCase();
},
[text],
);
return
function CapitalizedText(props) {
const computed = useMemo(props.compute);
return
export default function useImport(create, args) {
let [mod, error] = usePromise(
useMemo(create, [args])
);
if (mod) {
mod = mod.__esModule ? mod.default : mod;
}
return [mod, error];
}
function Provider({ store, context, children }) {
const contextValue = useMemo(() => {
const subscription = new Subscription(store);
subscription.onStateChange = subscription.notifyNestedSubs;
return {
store,
subscription
};
}, [store]);
const previousState = useMemo(() => store.getState(), [store]);
useEffect(() => {
const { subscription } = contextValue;
subscription.trySubscribe();
if (previousState !== store.getState()) {
subscription.notifyNestedSubs();