Use Branch

Install

With npm

npm i use-branch

Or with yarn

yarn add use-branch

Usage

Add use-branch/babel to your .babelrc:

// .babelrc
{
  "plugins": ["use-branch/babel"]
}

import useBranch from 'use-branch';

const Foo = () => {
  const [token] = useToken();
  useBranch(token, () => <div>Loading...</div>);

  return <div>Token: {token}</div>;
};

use-branch/babel

Input:

const Foo = () => {
  const [token] = useToken();
  useBranch(token, () => <div>Loading...</div>);

  return <div>Token: {token}</div>;
};

Output:

const Foo = () => {
  const [token] = useToken();

  const Left = () => <div>Token: {token}</div>;
  const Right = () => <div>Loading...</div>;

  if (token) {
    return React.CreateElement(Left, null);
  } else {
    return React.CreateElement(Right, null);
  }
};