Allow processors to add siblings

🗣 Feature Discussions Awaiting Development
,
1

— Roadmap Card

Description

Right now it’s nearly impossible to inject new nodes in the content using Html2React. It should be possible to add nodes, for slots, ads and so on…

User Stories

As a Frontity theme developer
I want to add node to the content
so that I can insert ads or other things between my content

Possible solution

Maybe we can add a function to node like this:

import Ad from "../components/Ad";

let count = 0;
let n = 3;

export const adsAfterNparagraphs = {
  test: node => node.component === "p",
  process: node => {
    count += 1;
    if (count % n) {
      node.insertAfter({
        component: Ad,
        props: { index: count }
      })
    }
  }
};

We could allow JSX, but I’m not sure if that is a good idea:

export const adsAfterNparagraphs = {
  test: node => node.component === "p",
  process: node => {
    count += 1;
    if (count % n)
      node.insertAfter(<Ad index={count} />);
  }
};