Add stories in storybook for media icons in psammead-assets

packages/utilities/psammead-assets/CHANGELOG.md

@@ -3,6 +3,7 @@
 <!-- prettier-ignore -->
 | Version | Description |
 |---------|-------------|
+| 2.4.1 | [PR#2189](https://github.com/bbc/psammead/pull/2189) Add storybook stories for media icons in psammead-assets |
 | 2.4.0 | [PR#2192](https://github.com/bbc/psammead/pull/2192) Add SVG for BBC Scotland |
 | 2.3.0 | [PR#2115](https://github.com/bbc/psammead/pull/2115) Added media icons SVGs |
 | 2.2.4 | [PR#1942](https://github.com/bbc/psammead/pull/1942) Talos - Bump React to 16.9.0 |

packages/utilities/psammead-assets/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbc/psammead-assets",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "sideEffects": false,
   "description": "A collection of common assets that are likely to be required by many Psammead components or users, such as SVGs or small scripts.",
   "repository": {

packages/utilities/psammead-assets/src/svgs.stories.jsx

@@ -4,7 +4,9 @@ import { node, number, shape } from 'prop-types';
 import { storiesOf } from '@storybook/react';
 import { number as numberKnob, withKnobs } from '@storybook/addon-knobs';
 import notes from '../README.md';
-import * as svgs from './svgs';
+import * as allSvgs from './svgs';
+
+const { mediaIcons, ...svgs } = allSvgs;
 
 // `currentColor` has been used to address high contrast mode in Firefox.
 const Svg = styled.svg`
@@ -58,10 +60,11 @@ getSVG.propTypes = {
   height: number,
 };
 
-const stories = storiesOf('Utilities|SVGs', module).addDecorator(withKnobs);
-
+const stories = storiesOf('Utilities|SVGs/Brand Svgs', module).addDecorator(
+  withKnobs,
+);
 Object.keys(svgs)
-  .filter(svgName => svgName !== 'BBC_BLOCKS' && svgName !== 'mediaIcons')
+  .filter(svgName => svgName !== 'BBC_BLOCKS')
   .forEach(svgName => {
     stories.add(
       svgName,
@@ -72,3 +75,12 @@ Object.keys(svgs)
       { notes },
     );
   });
+
+const mediaIconStories = storiesOf(
+  'Utilities|SVGs/MediaIcons Svgs',
+  module,
+).addDecorator(withKnobs);
+
+Object.keys(mediaIcons).forEach(iconName => {
+  mediaIconStories.add(iconName, () => mediaIcons[iconName], { notes });
+});