use reflow to migrate from flow to typescript

scm-ui/ui-components/src/modals/ConfirmAlert.tsx

@@ -1,17 +1,16 @@
-// @flow
-import * as React from "react";
-import ReactDOM from "react-dom";
-import Modal from "./Modal";
+import * as React from 'react';
+import ReactDOM from 'react-dom';
+import Modal from './Modal';
 
 type Button = {
-  label: string,
-  onClick: () => void | null
+  label: string;
+  onClick: () => void | null;
 };
 
 type Props = {
-  title: string,
-  message: string,
-  buttons: Button[]
+  title: string;
+  message: string;
+  buttons: Button[];
 };
 
 class ConfirmAlert extends React.Component<Props> {
@@ -23,7 +22,7 @@ class ConfirmAlert extends React.Component<Props> {
   };
 
   close = () => {
-    ReactDOM.unmountComponentAtNode(document.getElementById("modalRoot"));
+    ReactDOM.unmountComponentAtNode(document.getElementById('modalRoot'));
   };
 
   render() {
@@ -60,7 +59,7 @@ class ConfirmAlert extends React.Component<Props> {
 }
 
 export function confirmAlert(properties: Props) {
-  const root = document.getElementById("modalRoot");
+  const root = document.getElementById('modalRoot');
   if (root) {
     ReactDOM.render(<ConfirmAlert {...properties} />, root);
   }

scm-ui/ui-components/src/modals/Modal.tsx

@@ -1,20 +1,19 @@
-// @flow
-import * as React from "react";
-import classNames from "classnames";
+import * as React from 'react';
+import classNames from 'classnames';
 
 type Props = {
-  title: string,
-  closeFunction: () => void,
-  body: any,
-  footer?: any,
-  active: boolean,
-  className?: string,
-  headColor: string
+  title: string;
+  closeFunction: () => void;
+  body: any;
+  footer?: any;
+  active: boolean;
+  className?: string;
+  headColor: string;
 };
 
 class Modal extends React.Component<Props> {
   static defaultProps = {
-    headColor: "light"
+    headColor: 'light',
   };
 
   render() {
@@ -25,10 +24,10 @@ class Modal extends React.Component<Props> {
       footer,
       active,
       className,
-      headColor
+      headColor,
     } = this.props;
 
-    const isActive = active ? "is-active" : null;
+    const isActive = active ? 'is-active' : null;
 
     let showFooter = null;
     if (footer) {
@@ -36,13 +35,13 @@ class Modal extends React.Component<Props> {
     }
 
     return (
-      <div className={classNames("modal", className, isActive)}>
+      <div className={classNames('modal', className, isActive)}>
         <div className="modal-background" />
         <div className="modal-card">
           <header
             className={classNames(
-              "modal-card-head",
-              `has-background-${headColor}`
+              'modal-card-head',
+              `has-background-${headColor}`,
             )}
           >
             <p className="modal-card-title is-marginless">{title}</p>

scm-ui/ui-components/src/modals/index.js

@@ -1,5 +0,0 @@
-// @create-index
-
-export { default as ConfirmAlert, confirmAlert } from "./ConfirmAlert.js";
-export { default as Modal } from "./Modal.js";
-

scm-ui/ui-components/src/modals/index.ts

@@ -0,0 +1,4 @@
+// @create-index
+
+export { default as ConfirmAlert, confirmAlert } from './ConfirmAlert';
+export { default as Modal } from './Modal';