fix: storybook beta breaking SET_CURRENT_STORY

ccontrols · Jun 22, 2020 · 11e0386 · 11e0386
1 parent 74d3b51
commit 11e0386
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 7 deletions.
diff --git a/misc/storybook-custom-docs/src/components/ManagerContainer.tsx b/misc/storybook-custom-docs/src/components/ManagerContainer.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
-import { API } from '@storybook/api';
+import { API, Consumer, Combo } from '@storybook/api';
+import { UPDATE_STORY_CONTEXT } from '../types';
 
 interface ManagerContainerProps {
   active?: boolean;
@@ -11,7 +12,7 @@ interface ManagerContainerProps {
 export const ManagerContainer: React.FC<ManagerContainerProps> = props => {
   const { active, api, route } = props;
   const channel = React.useMemo(() => api.getChannel(), [api]);
-
+  const storyRef = React.useRef('');
   React.useEffect(() => {
     const ATTACH_DOCS_PAGE = `attach_docs_page_${route}`;
 
@@ -29,5 +30,16 @@ export const ManagerContainer: React.FC<ManagerContainerProps> = props => {
     };
     updateDOM();
   }, [active, api, route, channel]);
-  return null;
+
+  return (
+    <Consumer>
+      {({ state }: Combo) => {
+        if (state.storyId !== storyRef.current) {
+          storyRef.current = state.storyId;
+          channel.emit(UPDATE_STORY_CONTEXT, state);
+        }
+        return null;
+      }}
+    </Consumer>
+  );
 };
diff --git a/misc/storybook-custom-docs/src/index.tsx b/misc/storybook-custom-docs/src/index.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import addons from '@storybook/addons';
-import { SET_CURRENT_STORY } from '@storybook/core-events';
 import { ConfigApi } from '@storybook/client-api';
+import { UPDATE_STORY_CONTEXT } from './types';
 export * from './types';
 
 /**
@@ -49,10 +49,10 @@ export const useStoryId = () => {
     const onStoryChange = ({ storyId: id }: { storyId: string }) => {
       setStoryId(id);
     };
-    channel.on(SET_CURRENT_STORY, onStoryChange);
+    channel.on(UPDATE_STORY_CONTEXT, onStoryChange);
 
     return () => {
-      channel.off(SET_CURRENT_STORY, onStoryChange);
+      channel.off(UPDATE_STORY_CONTEXT, onStoryChange);
     };
   }, [channel]);
   return storyId;

diff --git a/misc/storybook-custom-docs/src/types.ts b/misc/storybook-custom-docs/src/types.ts
@@ -47,3 +47,5 @@ export interface CustomPageDef {
   // Return an object that can be rendered from ReactDOM.render
   render: CustomPageRenderFn;
 }
+
+export const UPDATE_STORY_CONTEXT = `update_story_context`;
diff --git a/ui/blocks/src/context/block/BlockContext.tsx b/ui/blocks/src/context/block/BlockContext.tsx
@@ -57,7 +57,6 @@ export const BlockContextProvider: React.FC<BlockContextInputProps> = ({
   options,
 }) => {
   let storyId = propsStoryId;
-  console.log(propsStoryId, propsDocId);
   const docId = storyId || propsDocId;
   if (!storyId && docId) {
     const doc = store.getStoryDoc(docId);