How to use the react-native-web.AppRegistry.registerComponent function in react-native-web

async function respondWithApp(
  App,
  props,
  res,
  path,
  docID,
  clientAgent,
  clientScriptID,
) {
  res.set("content-type", "text/html");
  // Horrible horrible horrible hacks to support react native web styles:
  const appKey = `App-${docID}-${path}`;
  const appKeys = AppRegistry.getAppKeys();
  if (appKeys.indexOf(appKey) === -1) {
    AppRegistry.registerComponent(appKey, () => App);
  }
  const { element, getStyleElement } = AppRegistry.getApplication(appKey, {
    initialProps: props,
  });
  const appHtml = ReactDOMServer.renderToString(element);
  const css = ReactDOMServer.renderToStaticMarkup(getStyleElement());

  const title = App.title;
  const html = `






<title>${title}</title>

static getInitialProps({ renderPage }: (cb: Function) => void) {
    AppRegistry.registerComponent('Main', () => Main);
    // $FlowFixMe Wrong libdef. https://gist.github.com/paularmstrong/f60b40d16fc83e1e8e532d483336f9bb
    const { getStyleElement } = AppRegistry.getApplication('Main');
    const page = renderPage();

    const styles = [
      // eslint-disable-next-line react/jsx-key
      <style>,
      getStyleElement(),
    ];
    return { ...page, styles: React.Children.toArray(styles) };
  }
</style>

);
  }
}

function sleep(n: number) {
  return new Promise(resolve => setTimeout(resolve, n));
}

class Display extends React.Component<{}, { screen: number }> {
  state = { screen: 0 };
  render() {
    return  } />;
  }
}

AppRegistry.registerComponent('App', () => Display);

AppRegistry.runApplication('App', {
  initialProps: {},
  rootTag: window.root,
});

// A <-> B <-> C
//
//  content
//     set to position A'
//     put that inside another

// @flow

import { AppRegistry } from 'react-native-web'

import './index.css'
import Onyx from './Onyx'

document.addEventListener('dragover', event => event.preventDefault())
document.addEventListener('drop', event => event.preventDefault())

AppRegistry.registerComponent('Onyx', () => Onyx)
AppRegistry.runApplication('Onyx', {
  rootTag: document.getElementById('root'),
})

getDataFromTree(app).then(() => {
    AppRegistry.registerComponent("App", () => () => app);

    const { element, getStyleElement } = AppRegistry.getApplication("App");
    const serverStylesheet = new ServerStyleSheet();

    const markup = ReactDOMServer.renderToString(
      serverStylesheet.collectStyles(element)
    );

    const responsiveStyles = serverStylesheet.getStyleTags();
    const styles = ReactDOMServer.renderToStaticMarkup(getStyleElement());

    const { helmet } = helmetContext;
    const headMarkup = helmet
      ? ["title", "meta", "link", "script"].reduce(
          (head, key) => head + helmet[key].toString(),
          ""

static async getInitialProps({ renderPage }) {
        AppRegistry.registerComponent('Main', () => Main);
        const { getStyleElement } = AppRegistry.getApplication('Main');
        const page = renderPage();
        const styles = [
            <style>,
            getStyleElement()
        ];
        return { ...page, styles: React.Children.toArray(styles) };
    }
</style>

async function domRender({page, initialProps, CONTAINER_ID}) {
  const viewElement = React.createElement(page.view, initialProps);
  AppRegistry.registerComponent('App', () => () => viewElement);

  AppRegistry.runApplication('App', {
    initialProps,
    rootTag: document.getElementById(CONTAINER_ID),
  });
}

static async getInitialProps({ renderPage }) {
    AppRegistry.registerComponent("Main", () => Main);
    const { getStyleElement } = AppRegistry.getApplication("Main");
    const page = renderPage();
    const styles = [
      <style>,
      getStyleElement()
    ];
    return {
      ...page,
      styles: React.Children.toArray(styles)
    };
  }
</style>

);
  }
}

AppRegistry.registerComponent('test', () => test);