React Utilities

compose.ts

const compose = (...middlewares) => Component =>
  middlewares.reduce((acc, curr) => curr(acc), Component);

show.ts

type DeferredProperties = {
  resolve(arg?: any);
  reject(err?: any);
};
const defer = (): DeferredProperties & Promise<any> => {
  let resolve, reject;
  const deferred: any = new Promise((yes, no) => {
    resolve = yes;
    reject = no;
  });
  deferred.reject = reject;
  deferred.resolve = resolve;
  return deferred;
};

async function show(
  containerElementFactory: (resolve, reject) => React.ReactElement<any>
) {
  const deferred = defer();
  const { resolve, reject } = deferred;

  const target = document.createElement("div");
  document.body.appendChild(target);

  ReactDOM.render(containerElementFactory(resolve, reject), target);

  const result = await deferred;

  ReactDOM.unmountComponentAtNode(target);
  document.body.removeChild(target);

  return result;
}

withProps.tsx

export const withProps = propsToPass => Component => props => (
  <Component {...propsToPass} {...props} />
);