import * as React from 'react';
import { Spinner } from 'react-bootstrap';
import { isPolyfillPhaseDone } from 'util/localization';

export default function WrapReactIntl<P>(Component: React.ComponentType<P>) {
  return (props: P) => {
    if (!isPolyfillPhaseDone()) {
      return (
        <Spinner
          as="span"
          size="sm"
          animation="border"
          role="status"
          variant="secondary"
        />
      );
    }

    return (
      // eslint-disable-next-line react/jsx-props-no-spreading
      <Component {...props} />
    );
  };
}