#14: rename file and move out memorization from React

storybookjs · Apr 18, 2019 · 86aa772 · 86aa772
1 parent b485b30
commit 86aa772
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 11 deletions.
diff --git a/addons/addon-contexts/src/@types/index.ts b/addons/addon-contexts/src/@types/index.ts
@@ -78,7 +78,7 @@ export declare type TAddonManager = FCNoChildren<{
 }>;
 export declare type TAddonWrapper = FC<{
   channel: Channel;
-  settings: WrapperSettings;
+  nodes: ContextNode[];
   children: (ready: boolean) => ReactNode;
 }>;
 export declare type TMenuController = FCNoChildren<

diff --git a/...-contexts/src/containers/AddonWrapper.tsx → ...-contexts/src/containers/ReactWrapper.tsx b/...-contexts/src/containers/AddonWrapper.tsx → ...-contexts/src/containers/ReactWrapper.tsx
@@ -1,16 +1,15 @@
 import React from 'react';
-import { useEffect, useMemo, useReducer, useState } from 'react';
+import { useEffect, useReducer, useState } from 'react';
 import { useChannel } from '../libs/hooks';
-import { getNodes, renderAggregatedContexts } from '../libs/helpers';
+import { renderAggregatedContexts } from '../libs/helpers';
 import { propsTreeReducer, propsTreeUpdater } from '../libs/ducks';
 import { INIT_WRAPPER, UPDATE_MANAGER, UPDATE_WRAPPER } from '../libs/constants';
 import { TAddonWrapper, StringObject, StringTuple } from '../@types';
 
 /**
  * Wrap story under addon-injected contexts
  */
-export const AddonWrapper: TAddonWrapper = ({ channel, settings, children }) => {
-  const nodes = useMemo(() => getNodes(settings), []);
+export const ReactWrapper: TAddonWrapper = ({ channel, nodes, children }) => {
   const [propsMap, dispatch] = useReducer(propsTreeReducer, {});
   const [ready, setReady] = useState(false);
 

diff --git a/addons/addon-contexts/src/index.ts b/addons/addon-contexts/src/index.ts
@@ -1,15 +1,18 @@
-import { createElement as h, Fragment } from 'react';
+import { createElement as h } from 'react';
 import addons, { makeDecorator } from '@storybook/addons';
-import { AddonWrapper } from './containers/AddonWrapper';
+import { ReactWrapper } from './containers/ReactWrapper';
 import { ID, PARAM } from './libs/constants';
+import { getNodes } from './libs/helpers';
 import { WithContexts, Wrapper } from './@types';
 
-const wrapper: Wrapper = (getStory, context, settings) =>
-  h(AddonWrapper, {
-    settings,
+const wrapper: Wrapper = (getStory, context, settings) => {
+  const nodes = getNodes(settings);
+  return h(ReactWrapper, {
+    nodes,
     channel: addons.getChannel(),
-    children: (ready: boolean) => () => (ready ? getStory(context) : h(Fragment)),
+    children: (ready: boolean) => () => (ready ? getStory(context) : h('div')),
   });
+};
 
 export const withContexts: WithContexts = makeDecorator({
   name: ID,