docs(storybook): add theme addon

Author: arturbien

.storybook/addons.js

@@ -1,20 +1,8 @@
 import { configure, addDecorator } from '@storybook/react';
-import { ThemeProvider } from 'styled-components';
+import { withThemesProvider } from 'storybook-addon-styled-component-theme';
 import themes from '../src/components/common/themes';
-import React from 'react';
 import GlobalStyle from './decorators/globalStyle';
 
-const demoThemes = [
-  themes.default,
-  themes.lilacRoseDark,
-  themes.water,
-  themes.coldGray,
-  themes.violetDark
-];
-
 addDecorator(GlobalStyle);
-addDecorator(story => (
-  <ThemeProvider theme={themes.default}>{story()}</ThemeProvider>
-));
-
+addDecorator(withThemesProvider(Object.values(themes)));
 configure(require.context('../src/', true, /\.stories\.js$/), module);

.storybook/config.js

@@ -1,4 +1,8 @@
 module.exports = {
   stories: ['../src/**/*.stories.(js|mdx)'],
-  addons: ['@storybook/addon-docs']
+  addons: [
+    '@storybook/addon-docs',
+    'storybook-addon-styled-component-theme/dist/register',
+    '@storybook/addon-storysource'
+  ]
 };

.storybook/main.js

@@ -49,10 +49,7 @@
     "@babel/plugin-transform-runtime": "^7.8.3",
     "@babel/preset-env": "^7.9.0",
     "@babel/preset-react": "^7.8.3",
-    "@storybook/addon-actions": "^5.3.18",
     "@storybook/addon-docs": "^5.3.18",
-    "@storybook/addon-links": "^5.3.18",
-    "@storybook/addon-options": "^5.3.18",
     "@storybook/addon-storysource": "^5.3.18",
     "@storybook/react": "^5.3.18",
     "@testing-library/jest-dom": "^4.2.4",