GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-01 05:05:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

CHANGE getDescription to properly typed & have a fallback for if there's no kind

Browse Source
This commit is contained in:
Norbert de Langen 2020-03-03 11:33:25 +01:00
parent 09fe2c3498
commit 9f988130ec
No known key found for this signature in database
GPG Key ID: 976651DA156C2825
1 changed files with 22 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
lib/ui/src/containers/preview.tsx
View File

@ -1,11 +1,13 @@
import { PREVIEW_URL } from 'global';
import React from 'react';
import { State, Consumer, Combo, StoriesHash } from '@storybook/api';
import { Consumer, Combo, StoriesHash, isRoot, isGroup, isStory } from '@storybook/api';
import { Preview } from '../components/preview/preview';
import { PreviewProps } from '../components/preview/PreviewProps';
type Item = StoriesHash[keyof StoriesHash];
const nonAlphanumSpace = /[^a-z0-9 ]/gi;
const doubleSpace = /\s\s/gi;
const replacer = (match: string) => ` ${match} `;
@ -13,40 +15,46 @@ const replacer = (match: string) => ` ${match} `;
const addExtraWhiteSpace = (input: string) =>
input.replace(nonAlphanumSpace, replacer).replace(doubleSpace, ' ');
const getDescription = (storiesHash: StoriesHash, storyId: string) => {
const storyInfo = storiesHash[storyId];
if (storyInfo) {
// @ts-ignore
const { kind, name } = storyInfo;
return kind && name ? addExtraWhiteSpace(`${kind} - ${name}`) : '';
const getDescription = (item: Item) => {
if (isRoot(item)) {
return item.name ? `${item.name} ⋅ Storybook` : 'Storybook';
}
if (isGroup(item)) {
return item.name ? `${item.name} ⋅ Storybook` : 'Storybook';
}
if (isStory(item)) {
const { kind, name } = item;
return kind && name ? addExtraWhiteSpace(`${kind} - ${name} ⋅ Storybook`) : 'Storybook';
}
return '';
return 'Storybook';
};
const mapper = ({ api, state }: Combo) => {
const { layout, location, customQueryParams, storiesHash, storyId } = state;
const { parameters } = storiesHash[storyId] || {};
const story = api.getData(storyId);
const parameters = story ? story.parameters : {};
const docsOnly = story && story.parameters ? !!story.parameters.docsOnly : false;
return {
api,
options: layout,
description: getDescription(storiesHash, storyId),
description: getDescription(story),
...api.getUrlState(),
queryParams: customQueryParams,
docsOnly: (parameters && parameters.docsOnly) as boolean,
docsOnly,
location,
parameters,
};
};
function getBaseUrl(): string {
const getBaseUrl = (): string => {
try {
return PREVIEW_URL || 'iframe.html';
} catch (e) {
return 'iframe.html';
}
}
};
const PreviewConnected = React.memo<{ id: string; withLoader: boolean }>(props => (
<Consumer filter={mapper}>