import React, { Component, PropTypes } from 'react';
import fetch from 'node-fetch';

import lib from './lib';

const DEFAULT_PROP_TYPES = {
  tag: PropTypes.string.isRequired,
  options: PropTypes.object,
  fallback: PropTypes.string,
  className: PropTypes.string,
  onClick: PropTypes.func,
};

const PROP_TYPES = {
  a: Object.assign({
    href: PropTypes.string,
    target: PropTypes.string,
  }, DEFAULT_PROP_TYPES),
};

function getPropTypes(tagName) {
  return PROP_TYPES[tagName] || DEFAULT_PROP_TYPES;
}

function getInitialState(tagName) {
  return function() {
    return {
      tagName,
      message: [ this.props.fallback ],
    };
  };
};

const DEFAULT_RENDER_PROPS = {
  className: true,
};

const ELEM_RENDER_PROPS = {
  a: Object.assign({
    href: true,
    target: true,
    onClick: true,
    className: true,
  }, DEFAULT_RENDER_PROPS),
};

function renderDataProp(value) {
  return typeof value === 'object' ? JSON.stringify(value) : value;
}

function filterProps(tagName) {
  const tagProps = ELEM_RENDER_PROPS[tagName] || DEFAULT_RENDER_PROPS;
  return function () {
    const props = {};
    Object.keys(this.props).forEach((prop) => {
      const isElemProp = tagProps[prop];
      const propKey = isElemProp ? prop : `data-${ prop }`;
      const propValue = this.props[prop];
      props[propKey] = isElemProp ? propValue : renderDataProp(propValue);
    });
    return props;
  };
}

const DEFAULT_ELEM = {
  componentWillMount: function() {
    const localeKey = this.props.tag;
    lib._loadBundleAsync(localeKey).then(() => {
      const message = lib.getMessage(localeKey);
      if (message) {
        this.setState({
          message,
        });
      }
    });
  },
  render: function() {
    const state = this.state;
    const props = this.filterProps();
    return (
      <state.tagName { ...props }>
        { lib._renderMessage(state.message, this.props.options) }
      </state.tagName>
    );
  },
};

const i18n = {};
['p', 'span', 'a', 'strong'].forEach((tagName) => {
  i18n[tagName] = React.createClass(Object.assign({
    getInitialState: getInitialState(tagName),
    propTypes: getPropTypes(tagName),
    filterProps: filterProps(tagName),
  }, DEFAULT_ELEM));
});

export default i18n;

@@ -134,16 +134,40 @@
 PES = %7B%0A
+  id: PropTypes.string,%0A
   tag: P
@@ -449,96 +449,8 @@
 %7D;%0A%0A
-function getPropTypes(tagName) %7B%0A  return PROP_TYPES%5BtagName%5D %7C%7C DEFAULT_PROP_TYPES;%0A%7D%0A%0A
 func
@@ -597,761 +597,144 @@
 nst 
-DEFAULT_RENDER_PROPS = %7B%0A  className: true,%0A%7D;%0A%0Aconst ELEM_RENDER_PROPS = %7B%0A  a: Object.assign(%7B%0A    href: true,%0A    target: true,%0A    onClick: true,%0A    className: true,%0A  %7D, DEFAULT_RENDER_PROPS),%0A%7D;%0A%0Afunction renderDataProp(value) %7B
+PROP_WHITELIST = %7B%0A  id: 'id',%0A  className: 'className',%0A  onClick: 'onClick',
 %0A  
+h
 re
-turn typeof value === 'object' ? JSON.stringify(value) : value;%0A%7D%0A%0Afunction filterProps(tagName) %7B%0A  const tagProps = ELEM_RENDER_PROPS%5BtagName%5D %7C%7C DEFAULT_RENDER_PROPS;%0A  return function () %7B%0A    const props = %7B%7D;%0A    Object.keys(this.props).forEach((prop) =%3E %7B%0A      const isElemProp = tagProps%5Bprop%5D;%0A      const propKey = isElemProp ? prop : %60
+f: 'href',%0A  target: 'target',%0A  tag: '
 data-
-$%7B prop %7D%60;%0A      const propValue = this.props%5Bprop%5D;%0A      props%5BpropKey%5D = isElemProp ? propValue : renderDataProp(propValue);%0A    %7D);%0A    return props;%0A  %7D;%0A%7D
+tag',%0A%7D;
 %0A%0Aco
@@ -1022,16 +1022,261 @@
 );%0A  %7D,%0A
+  filterProps: function() %7B%0A    const props = %7B%7D;%0A    Object.keys(this.props).forEach((prop) =%3E %7B%0A      const propKey = PROP_WHITELIST%5Bprop%5D;%0A      if (propKey) %7B%0A        props%5BpropKey%5D = this.props%5Bprop%5D;%0A      %7D%0A    %7D);%0A    return props;%0A  %7D,%0A
   render
@@ -1528,17 +1528,39 @@
 n = %7B%7D;%0A
-%5B
+const VALID_TAGS = %5B%0A  
 'p', 'sp
@@ -1577,17 +1577,79 @@
 'strong'
-%5D
+, 'button',%0A  'h1', 'h2', 'h3', 'h4', 'h5', 'h6',%0A%5D;%0AVALID_TAGS
 .forEach
@@ -1782,68 +1782,49 @@
 es: 
-getPropTypes(tagName),%0A    filterProps: filterProps(tagName)
+PROP_TYPES%5BtagName%5D %7C%7C DEFAULT_PROP_TYPES
 ,%0A  

remove unnecessary functions