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

Flatten stories fo improve filtering logic

Browse Source
This commit is contained in:
igor 2017-08-17 11:27:55 +03:00
parent adf50bba81
commit 4a094e1408
1 changed files with 42 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
lib/ui/src/modules/ui/libs/filters.js
View File

@ -13,7 +13,7 @@ const searchOptions = {
distance: 200,
maxPatternLength: 32,
minMatchCharLength: 2,
keys: ['namespaces', 'stories', 'searchHook'],
keys: ['namespaces', 'storyName', 'searchHook'],
};
function sort(stories, sortStoriesByKind) {
@ -22,6 +22,18 @@ function sort(stories, sortStoriesByKind) {
return sortBy(stories, ['kind']);
}
function flattenStories(items) {
return items.reduce((arr, item) => {
const flatten = item.stories.map(story => ({
kind: item.kind,
namespaces: item.namespaces,
storyName: story,
}));
return arr.concat(flatten);
}, []);
}
function applySearchHookForSelectedKind(stories, filter, selectedKind) {
return stories.map(story => {
if (story.kind !== selectedKind) {
@ -35,49 +47,38 @@ function applySearchHookForSelectedKind(stories, filter, selectedKind) {
});
}
function isMatched(matches, type, value) {
if (!matches) {
return null;
}
function groupStories(matchedItems) {
const storiesMap = matchedItems.reduce((map, matchedItem) => {
const { item, matches } = matchedItem;
let current = map.get(item.kind);
return matches.filter(match => match.key === type).find(match => match.value === value);
}
if (!current) {
current = {
kind: item.kind,
namespaces: item.namespaces,
stories: [],
matches: matches.filter(match => match.key === 'namespaces'),
};
function isKindMatched(matches, namespaces) {
return namespaces.some(namespace => isMatched(matches, 'namespaces', namespace));
}
function isStoryMatched(matches, story) {
return isMatched(matches, 'stories', story);
}
function isSelectedKind(storyItem, selectedKind) {
return storyItem.kind === selectedKind;
}
function filterOutUnmatchedStories({ stories, matches }) {
return stories.filter(story => isStoryMatched(matches, story));
}
function flattenStories(stories, selectedKind) {
return stories.map(found => {
const storyItem = {
...found.item,
matches: found.matches,
};
if (isSelectedKind(storyItem, selectedKind)) {
return storyItem;
map.set(item.kind, current);
}
if (isKindMatched(storyItem.matches, storyItem.namespaces)) {
return storyItem;
current.stories.push(item.storyName);
const storyMatch = matches.find(match => match.key === 'storyName');
if (storyMatch) {
current.matches.push({
indices: storyMatch.indices,
value: storyMatch.value,
key: 'stories',
});
}
storyItem.stories = filterOutUnmatchedStories(storyItem);
return map;
}, new Map());
return storyItem;
});
return Array.from(storiesMap.values());
}
export function storyFilter(stories, filter, selectedKind, sortStoriesByKind) {
@ -91,8 +92,10 @@ export function storyFilter(stories, filter, selectedKind, sortStoriesByKind) {
return sorted;
}
const storiesWithHook = applySearchHookForSelectedKind(sorted, filter, selectedKind);
const flattened = flattenStories(sorted);
const storiesWithHook = applySearchHookForSelectedKind(flattened, filter, selectedKind);
const fuse = new Fuse(storiesWithHook, searchOptions);
const foundStories = fuse.search(filter);
return flattenStories(foundStories, selectedKind);
return groupStories(foundStories);
}