Add storyFileName

storybookjs · Sep 8, 2021 · afa2fa8 · afa2fa8
1 parent 53d7d4b
commit afa2fa8
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/addons/interactions/src/Panel.tsx b/addons/interactions/src/Panel.tsx
@@ -1,7 +1,7 @@
 import global from 'global';
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { useChannel } from '@storybook/api';
+import { useChannel, useParameter } from '@storybook/api';
 import { AddonPanel, Icons } from '@storybook/components';
 import { styled } from '@storybook/theming';
 
@@ -192,6 +192,8 @@ export const Panel: React.FC<PanelProps> = (props) => {
     },
   });
 
+  const [fileName] = useParameter('fileName', '').split('/').slice(-1);
+
   const { log, interactions, callsById, isDebugging } = state;
   const hasException = interactions.some((call) => call.state === CallState.ERROR);
   const hasPrevious = interactions.some((call) => call.state !== CallState.PENDING);
@@ -243,6 +245,7 @@ export const Panel: React.FC<PanelProps> = (props) => {
       {tabButton && showStatus && ReactDOM.createPortal(statusIcon, tabButton)}
       <Subnav
         status={hasException ? CallState.ERROR : CallState.DONE}
+        storyFileName={fileName}
         onPrevious={prev}
         onNext={next}
         onReplay={stop}

diff --git a/addons/interactions/src/components/Subnav/Subnav.tsx b/addons/interactions/src/components/Subnav/Subnav.tsx
@@ -67,6 +67,7 @@ const StyledLocation = styled(P)(({ theme }) => ({
   justifyContent: 'flex-end',
   textAlign: 'right',
   paddingRight: 15,
+  fontSize: 13,
 }));
 
 const Group = styled.div({