import xml2js from 'xml2js';
import builder from './build-xml';
import filter from './deep-filter';
import {svgTags, svgAttrs} from './react-svg-elements';
import makeComponent from './make-component';
import {styleAttrToJsx, convertRootToProps} from './parsers';

export default function(content) {

  this.cacheable && this.cacheable(true);
  this.addDependency(this.resourcePath);

  let loaderContext = this;
  let callback = this.async();

  let parser = new xml2js.Parser({
    normalize: true,
    normalizeTags: true,
    explicitArray: true,
    explicitChildren: true,
    preserveChildrenOrder: true
  });

  parser.addListener('error', err => callback(err));

  parser.addListener('end', function(result) {
    let svg = result.svg;
    let allowedTags = svgTags.concat(['$', '$$', '#name']);
    let filtered = filter(result, function(value, key, parent, parentKey) {
      if ('number' === typeof key) {
        if (parentKey === '$$')
          return allowedTags.indexOf(value['#name']) > -1;
        return true;
      }
      // if the attribute is a namespace attr, then ignore
      if (parentKey === '$') {
        return key.indexOf(':') < 0;
      }
      return allowedTags.indexOf(key) > -1;
    });

    // add some basic props by default
    if ('undefined' === typeof filtered.svg['$'].width)
      filtered.svg['$'].width = "300";
    if ('undefined' === typeof filtered.svg['$'].height)
      filtered.svg['$'].height = "300";

    // pass things through the pipeline
    let xml = builder(filtered);
    xml = styleAttrToJsx(xml);
    xml = convertRootToProps(xml);
    var componentStr = makeComponent(xml);
    callback(null, componentStr);
  });

  parser.parseString(content.toString());

};

@@ -1499,25 +1499,213 @@
     
-let xml = builder
+// everything is synchronous anyway,%0A    // but the promise chain gives us a neat way to%0A    // list a pipeline - a list of transformations to%0A    // be done on some initial data%0A    Promise%0A      .resolve
 (fil
@@ -1714,153 +1714,206 @@
 red)
-;
 %0A    
-xml = styleAttrToJsx(xml);%0A    xml = convertRootToProps(xml);%0A    var componentStr = makeComponent(xml);%0A    callback(null, componentStr
+  .then(builder)%0A      .then(styleAttrToJsx)%0A      .then(convertRootToProps)%0A      .then(makeComponent)%0A      .then(component =%3E callback(null, component))%0A      .catch(err =%3E callback(err)
 );%0A
+%0A
   %7D)

Make pipeline neater via Promise.then-s