Generate PropTypes from Typescript definitions

[MAILPOET-2658]

.babelrc

@@ -5,6 +5,7 @@
     "@babel/preset-env"
   ],
   "plugins": [
+    "babel-plugin-typescript-to-proptypes",
     "@babel/plugin-proposal-class-properties",
     [
       "@babel/plugin-transform-runtime", {

assets/js/src/notices/notice.tsx

@@ -1,24 +1,19 @@
-import React, { FC } from 'react';
+import React, { FC, ReactNode } from 'react';
 import ReactDOM from 'react-dom';
-import PropTypes, { InferProps } from 'prop-types';
 import MailPoet from 'mailpoet';
 
-const propTypes = {
-  type: PropTypes.oneOf(['success', 'info', 'warning', 'error']).isRequired,
-  scroll: PropTypes.bool,
-  closable: PropTypes.bool,
-  renderInPlace: PropTypes.bool,
-  onDisplay: PropTypes.func,
-  onClose: PropTypes.func,
-  timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf([false])]),
-  children: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.element,
-    PropTypes.arrayOf(PropTypes.element),
-  ]).isRequired
+type Props = {
+  type: 'success' | 'info' | 'warning' | 'error';
+  scroll: boolean;
+  closable: boolean;
+  renderInPlace: boolean;
+  onDisplay?: () => void;
+  onClose?: () => void;
+  timeout: number | false;
+  children: ReactNode;
 };
 
-const Notice: FC<InferProps<typeof propTypes>> = ({
+const Notice: FC<Props> = ({
   onClose,
   onDisplay,
   renderInPlace,
@@ -76,7 +71,6 @@ const Notice: FC<InferProps<typeof propTypes>> = ({
     document.getElementById('mailpoet_notices')
   );
 };
-Notice.propTypes = propTypes;
 Notice.defaultProps = {
   timeout: 10000,
   scroll: false,

package-lock.json

@@ -6006,6 +6006,25 @@
         "@babel/helper-plugin-utils": "^7.0.0"
       }
     },
+    "babel-plugin-typescript-to-proptypes": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-typescript-to-proptypes/-/babel-plugin-typescript-to-proptypes-1.2.1.tgz",
+      "integrity": "sha512-D44MNR2bEORkudJdntPoi13EaKfzXlDSCg8XZ6YMBrKxSAFFPTcOrYiPizKU+tdkojdM7bbgL6QAghsyO9R3Xg==",
+      "dev": true,
+      "requires": {
+        "@babel/helper-module-imports": "^7.8.3",
+        "@babel/helper-plugin-utils": "^7.8.3",
+        "@babel/plugin-syntax-typescript": "^7.8.3"
+      },
+      "dependencies": {
+        "@babel/helper-plugin-utils": {
+          "version": "7.8.3",
+          "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.8.3.tgz",
+          "integrity": "sha512-j+fq49Xds2smCUNYmEHF9kGNkhbet6yVIBp4e6oeQpH1RUs/Ir06xUKzDjDkGcaaokPiTNs2JBWHjaE4csUkZQ==",
+          "dev": true
+        }
+      }
+    },
     "babel-register": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-register/-/babel-register-6.26.0.tgz",

package.json

@@ -92,6 +92,7 @@
     "babel-eslint": "^10.0.1",
     "babel-loader": "^8.0.4",
     "babel-plugin-transform-commonjs": "^1.1.4",
+    "babel-plugin-typescript-to-proptypes": "^1.2.1",
     "chai": "^4.2.0",
     "chai-jq": "0.0.9",
     "clean-webpack-plugin": "^1.0.0",