From 3ad142f06838784fe705e33d3e460f08338e55bf Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Thu, 21 Feb 2019 02:20:23 +0100 Subject: [PATCH 1/4] FIX initial state of ColorBlindness Tool --- addons/a11y/src/components/ColorBlindness.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/a11y/src/components/ColorBlindness.js b/addons/a11y/src/components/ColorBlindness.js index b5ac802b308e..2a480ebacc28 100644 --- a/addons/a11y/src/components/ColorBlindness.js +++ b/addons/a11y/src/components/ColorBlindness.js @@ -24,7 +24,7 @@ const ColorIcon = styled.span( class ColorBlindness extends Component { state = { expanded: false, - filter: false, + filter: null, }; setFilter = filter => { From 04d5f4d79a240fde026d548e9f82ec0c589ba548 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Thu, 21 Feb 2019 02:20:55 +0100 Subject: [PATCH 2/4] FIX rotate function of ViewportTool --- addons/viewport/src/Tool.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/viewport/src/Tool.js b/addons/viewport/src/Tool.js index ed9652afef6a..333fbe831bdf 100644 --- a/addons/viewport/src/Tool.js +++ b/addons/viewport/src/Tool.js @@ -49,7 +49,7 @@ const getState = memoize(10)((props, state, change) => { id: 'rotate', title: 'Rotate viewport', onClick: () => { - change({ isRotated: !state.isRotate, expanded: false }); + change({ isRotated: !state.isRotated, expanded: false }); }, }, ] From 0cb4ec7d52aee3fb8eba1219ffccb3e285010a87 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Thu, 21 Feb 2019 02:21:48 +0100 Subject: [PATCH 3/4] FIX Background Tool linting & reset state --- .../src/containers/BackgroundSelector.tsx | 67 +++++++------------ 1 file changed, 26 insertions(+), 41 deletions(-) diff --git a/addons/backgrounds/src/containers/BackgroundSelector.tsx b/addons/backgrounds/src/containers/BackgroundSelector.tsx index 9dd602b9a72e..b9b4b3450c62 100644 --- a/addons/backgrounds/src/containers/BackgroundSelector.tsx +++ b/addons/backgrounds/src/containers/BackgroundSelector.tsx @@ -31,10 +31,7 @@ const createBackgroundSelectorItem = memoize(1000)( }) ); -const getSelectedBackgroundColor = ( - list: BackgroundConfig[], - currentSelectedValue: string -): string => { +const getSelectedBackgroundColor = (list: BackgroundConfig[], currentSelectedValue: string): string => { if (!list.length) { return 'transparent'; } @@ -54,36 +51,30 @@ const getSelectedBackgroundColor = ( return 'transparent'; }; -const getDisplayableState = memoize(10)( - (props: BackgroundToolProps, state: BackgroundToolState, change) => { - const data = props.api.getCurrentStoryData(); - const list: BackgroundConfig[] = (data && data.parameters && data.parameters[PARAM_KEY]) || []; - - const selectedBackgroundColor = getSelectedBackgroundColor(list, state.selected); - - let availableBackgroundSelectorItems: BackgroundSelectorItem[] = []; - - if (selectedBackgroundColor !== 'transparent') { - availableBackgroundSelectorItems.push( - createBackgroundSelectorItem('reset', 'Clear background', 'transparent', false, change) - ); - } - - if (list.length) { - availableBackgroundSelectorItems = [ - ...availableBackgroundSelectorItems, - ...list.map(({ name, value }) => - createBackgroundSelectorItem(null, name, value, true, change) - ), - ]; - } - - return { - items: availableBackgroundSelectorItems, - selectedBackgroundColor, - }; +const getDisplayableState = memoize(10)((props: BackgroundToolProps, state: BackgroundToolState, change) => { + const data = props.api.getCurrentStoryData(); + const list: BackgroundConfig[] = (data && data.parameters && data.parameters[PARAM_KEY]) || []; + + const selectedBackgroundColor = getSelectedBackgroundColor(list, state.selected); + + let availableBackgroundSelectorItems: BackgroundSelectorItem[] = []; + + if (selectedBackgroundColor !== 'transparent') { + availableBackgroundSelectorItems.push(createBackgroundSelectorItem('reset', 'Clear background', 'transparent', null, change)); } -); + + if (list.length) { + availableBackgroundSelectorItems = [ + ...availableBackgroundSelectorItems, + ...list.map(({ name, value }) => createBackgroundSelectorItem(null, name, value, true, change)), + ]; + } + + return { + items: availableBackgroundSelectorItems, + selectedBackgroundColor, + }; +}); interface BackgroundToolProps { api: { @@ -128,11 +119,7 @@ export class BackgroundSelector extends Component @@ -149,9 +136,7 @@ export class BackgroundSelector extends Component - this.setState({ expanded: newVisibility }) - } + onVisibilityChange={(newVisibility: boolean) => this.setState({ expanded: newVisibility })} tooltip={} closeOnClick > From 3480bc0f627f7047820d65a3754865c9c2775e21 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Thu, 21 Feb 2019 02:22:19 +0100 Subject: [PATCH 4/4] ADD safe-gaurd against missing storysource locations --- addons/storysource/src/StoryPanel.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/storysource/src/StoryPanel.js b/addons/storysource/src/StoryPanel.js index 07e17f75163f..a80f461edf43 100644 --- a/addons/storysource/src/StoryPanel.js +++ b/addons/storysource/src/StoryPanel.js @@ -95,7 +95,7 @@ export default class StoryPanel extends Component { const story = this.createPart(storyRows, stylesheet, useInlineStyles); const storyKey = `${first}-${last}`; - if (areLocationsEqual(location, currentLocation)) { + if (location && currentLocation && areLocationsEqual(location, currentLocation)) { return ( {story}