mainmatter / ast-workshop Goto Github PK

class StripTestSelectorsTransform {
    transform(root) {
      this.syntax.traverse(root, {
        // TODO write your implementation here
        AttrNode(node) {
          if (node.name.startsWith('data-test-')) {
            return null;
          }
        }
      });

      return root;
    }
  }

const HEADING_LIST = ["h1", "h2", "h3", "h4", "h5", "h6"];

const ATTR_MAP = {
  class: "className"
};

function handleMustacheStatementParams(param) {
  if (param.type === "StringLiteral") {
    return `"${param.original}"`;
  } else {
    // todo: handle block statements
    // todo: handle SubExpression type
    return param.original;
  }
}

function handleMustacheStatementHashPairs(pair) {
  if (pair.type === "HashPair") {
    // eg without content bit: {{pluralize @count @nounLabel without-count=true}}
    return `${pair.key}=${pair.value.value}`;
  }
  // not sure of other hash pairs
}

function getOriginalChildValue(child, builder) {
  // todo: handle element node being a child. Will likely need to eject from the codemod there
  if (child.type === "TextNode") {
    return child.chars.trim();
  } else if (child.type === "MustacheStatement") {
    return builder;
    let paramsString = "";
    let hashString = "";
    if (child.params.length > 0) {
      // going to have to process potentially more params
      // see handleMustacheStatementParams
      // may not necessarily be a string here
      paramsString = child.params
        .map((param) => {
          return ` ${handleMustacheStatementParams(param)}`;
        })
        .join("");
    }

    if (child.hash.pairs.length > 0) {
      hashString = child.hash.pairs
        .map((pair) => {
          return ` ${handleMustacheStatementHashPairs(pair)}`;
        })
        .join("");
    }

    // handling just a single path with or without a param string
    return `{{${child.path.original}${paramsString}${hashString}}}`;
  }
}

function getChildren(node, builder) {
  return node.children.reduce(
    (accumulator, child) => accumulator + getOriginalChildValue(child, builder),
    ""
  );
}

module.exports = (env) => {
  let builder = env.syntax.builders;

  return {
    ElementNode(node) {
      if (node.type === "ElementNode" && HEADING_LIST.includes(node.tag)) {
        // get the node tag name for setting hierarchy with as
        // better than just setting everything as h1 by default
        const nodeTag = node.tag;

        node.tag = "Ds::Title";

        // iterate through each attribute and set to @ to set within the react component
        node.attributes.forEach((attr) => {
          attr.name = `@${ATTR_MAP[attr.name] || attr.name}`;
        });

        // replace the text prop with the children
        // have tried using builder.mustache and builder.hash here to handle specific types
        node.attributes.push(builder.attr("@text", builder.text(getChildren(node, builder))));

        // take in attribute with @as
        node.attributes.push(builder.attr("@as", builder.text(nodeTag)));

        // remove the children
        node.children = [];
      }
    }
  };
};