airbnb/ts-migrate

Typecript 4.3 issue

pd8 opened this issue · 1 comments

pd8 commented

When using Typescript 4.3 and trying to run the migrate command on the following file:

I haven't had time to investigate the exact cause of this, but FYI, the codemod does work when I downgrade typescript to 4.2, so a workaround exists... assuming no 4.2+ features are being used.

ts-migrate-4-3-error

Test file ConfirmationModal.tsx

import React from "react";
import pt from "prop-types";

const Modal = () => <div>Fake Modal</div>;
const CONFIRMATION_MODAL_SUCCESS = "CONFIRMATION_MODAL_SUCCESS";
const CONFIRMATION_MODAL_ERROR = "CONFIRMATION_MODAL_ERROR";

const ConfirmationModal = (props) => {
  const {
    loading,
    result,
    title,
    successTitle,
    errorTitle,
    bodyDescription,
    bodyItems,
    bodyOnConfirmDescription,
    successBody,
    errorBody,
    cancelText,
    confirmText,
    onConfirm,
    onCancel,
    secondaryText,
    secondaryAction,
  } = props;

  let modalTitle;
  let modalBody;

  switch (result) {
    case CONFIRMATION_MODAL_SUCCESS:
      modalTitle = successTitle || title;
      modalBody = <div>{successBody}</div>;
      break;
    case CONFIRMATION_MODAL_ERROR:
      modalTitle = errorTitle || title;
      modalBody = <div>{errorBody}</div>;
      break;
    default:
      modalTitle = title;
      modalBody = (
        <div>
          <p>{bodyDescription}</p>
          {bodyItems.map((item, index) => (
            <p key={index}>
              <p inline bold>
                {item.boldText}
              </p>{" "}
              {item.text}
            </p>
          ))}
          <p>{bodyOnConfirmDescription}</p>
        </div>
      );
  }
  return (
    <Modal
      isOpen
      isLoading={loading}
      modalTitle={modalTitle}
      cancelText={cancelText || "Cancel"}
      secondaryText={secondaryText}
      submitText={confirmText || "Confirm"}
      onSubmit={onConfirm}
      onCancel={onCancel}
      onSecondaryAction={secondaryAction}
      isSubmitable={result !== CONFIRMATION_MODAL_ERROR}
      hasSecondaryAction={
        !!secondaryAction && result === CONFIRMATION_MODAL_SUCCESS
      }
    >
      {modalBody}
    </Modal>
  );
};

ConfirmationModal.propTypes = {
  title: pt.string.isRequired,
  successTitle: pt.string,
  errorTitle: pt.string,
  bodyDescription: pt.string,
  bodyItems: pt.arrayOf(
    pt.shape({ boldText: pt.string, text: pt.string.isRequired })
  ),
  bodyOnConfirmDescription: pt.string,
  successBody: pt.string.isRequired,
  errorBody: pt.string.isRequired,
  cancelText: pt.string,
  confirmText: pt.string,
  onCancel: pt.func,
  onConfirm: pt.func,
  secondaryAction: pt.func,
  secondaryText: pt.string,
};

export default ConfirmationModal;

Rudeg commented

Should be fixed with the latest version.