import React, { Component, Fragment } from 'react';
import { configure, addDecorator } from '@storybook/react';
import { setOptions } from '@storybook/addon-options';
import { initializeRTL } from 'storybook-addon-rtl';
import 'typeface-source-sans-pro';
import '../lib/global.css';


/**
 * React intl support
 */

// Load the locale data for all your defined locales
import { setIntlConfig, withIntl } from 'storybook-addon-intl';

import daTranslations from '../translations/stripes-components/da.json';
import deTranslations from '../translations/stripes-components/de.json';
import enTranslations from '../translations/stripes-components/en.json';
import frTranslations from '../translations/stripes-components/fr.json';
import huTranslations from '../translations/stripes-components/hu.json';

import { addLocaleData } from 'react-intl';
import daLocaleData from 'react-intl/locale-data/da';
import deLocaleData from 'react-intl/locale-data/de';
import enLocaleData from 'react-intl/locale-data/en';
import frLocaleData from 'react-intl/locale-data/fr';
import huLocaleData from 'react-intl/locale-data/hu';

addLocaleData(daLocaleData);
addLocaleData(deLocaleData);
addLocaleData(enLocaleData);
addLocaleData(frLocaleData);
addLocaleData(huLocaleData);

// mimics the StripesTranslationPlugin in @folio/stripes-core
function prefixKeys(obj) {
  const res = {};
  for (const key of Object.keys(obj)) {
    res[`stripes-components.${key}`] = obj[key];
  }
  return res;
}

// Define messages
const messages = {
  da: prefixKeys(daTranslations),
  de: prefixKeys(deTranslations),
  en: prefixKeys(enTranslations),
  fr: prefixKeys(frTranslations),
  hu: prefixKeys(huTranslations),
};

// Set intl configuration
setIntlConfig({
    locales: ['da', 'de', 'en', 'fr', 'hu'],
    defaultLocale: 'en',
    getMessages: (locale) => messages[locale]
});

addDecorator(withIntl);

/**
 * RTL
 */
initializeRTL();

/**
 * Add OverlayContainer to all stories
 * Popovers, Modals etc. mount to this element in the real system
 */

 class AddOverlayContainer extends Component {
  constructor(props) {
    super(props);
    const name = 'OverlayContainer';
    if (!document.getElementById('OverlayContainer')) {
      var OverlayContainerEl = document.createElement("div");
      OverlayContainerEl.id = name;
      document.body.appendChild(OverlayContainerEl);
    }
  }

  render() {
    return (
      <Fragment>
        {this.props.children}
      </Fragment>
    )
  }
 }

addDecorator(storyFn => <AddOverlayContainer>{storyFn()}</AddOverlayContainer>);

/**
 * Set options
 */
setOptions({
  name: 'FOLIO Stripes',
});

const req = require.context('../lib', true, /\.stories\.js$/);

function loadStories() {
  req.keys().forEach((filename) => req(filename));
}

configure(loadStories, module);

@@ -423,24 +423,170 @@
 don-intl';%0A%0A
+import arTranslations from '../translations/stripes-components/ar.json';%0Aimport caTranslations from '../translations/stripes-components/ca.json';%0A
 import daTra
@@ -788,24 +788,97 @@
 s/en.json';%0A
+import esTranslations from '../translations/stripes-components/es.json';%0A
 import frTra
@@ -1015,50 +1015,310 @@
 n';%0A
-%0Aimport %7B addLocaleData %7D from 'react-intl
+import itTranslations from '../translations/stripes-components/it_IT.json';%0Aimport ptTranslations from '../translations/stripes-components/pt_BR.json';%0A%0Aimport %7B addLocaleData %7D from 'react-intl';%0Aimport arLocaleData from 'react-intl/locale-data/ar';%0Aimport caLocaleData from 'react-intl/locale-data/ca
 ';%0Ai
@@ -1474,24 +1474,78 @@
 e-data/en';%0A
+import esLocaleData from 'react-intl/locale-data/es';%0A
 import frLoc
@@ -1640,16 +1640,182 @@
 ta/hu';%0A
+import itLocaleData from 'react-intl/locale-data/it';%0Aimport ptLocaleData from 'react-intl/locale-data/pt';%0A%0AaddLocaleData(arLocaleData);%0AaddLocaleData(caLocaleData);
 %0AaddLoca
@@ -1886,32 +1886,61 @@
 (enLocaleData);%0A
+addLocaleData(esLocaleData);%0A
 addLocaleData(fr
@@ -1980,16 +1980,74 @@
 leData);
+%0AaddLocaleData(itLocaleData);%0AaddLocaleData(ptLocaleData);
 %0A%0A// mim
@@ -2295,16 +2295,84 @@
 ges = %7B%0A
+  ar: prefixKeys(arTranslations),%0A  ca: prefixKeys(caTranslations),%0A
   da: pr
@@ -2465,16 +2465,50 @@
 tions),%0A
+  es: prefixKeys(esTranslations),%0A
   fr: pr
@@ -2567,16 +2567,84 @@
 tions),%0A
+  it: prefixKeys(itTranslations),%0A  pt: prefixKeys(ptTranslations),%0A
 %7D;%0A%0A// S
@@ -2695,16 +2695,28 @@
 cales: %5B
+'ar', 'ca', 
 'da', 'd
@@ -2724,16 +2724,22 @@
 ', 'en',
+ 'es',
  'fr', '
@@ -2741,16 +2741,28 @@
 r', 'hu'
+, 'it', 'pt'
 %5D,%0A    d

Add more translations to storybook