Add loading spinner to preview modal

frontend/my/src/ModalPreview.js

@@ -2,7 +2,13 @@ import React from "react"
 import { Modal } from "antd"
 import * as cs from "./constants"
 
+import { Spin } from "antd"
+
 class ModalPreview extends React.PureComponent {
+    state = {
+        loading: true
+    }
+
     makeForm(body) {
         let form = document.createElement("form")
         form.method = cs.MethodPost
@@ -27,7 +33,8 @@ class ModalPreview extends React.PureComponent {
                 onCancel={ this.props.onCancel }
                 onOk={ this.props.onCancel }>
                 <div className="preview-iframe-container">
-                    <iframe title={ this.props.title ? this.props.title : "Preview" }
+                    <Spin spinning={ this.state.loading }>
+                        <iframe onLoad={() => { this.setState({ loading: false }) }} title={ this.props.title ? this.props.title : "Preview" }
                             name="preview-iframe"
                             id="preview-iframe"
                             className="preview-iframe"
@@ -43,7 +50,7 @@ class ModalPreview extends React.PureComponent {
                             }}
                             src={ this.props.previewURL ? this.props.previewURL : "about:blank" }>
                         </iframe>
- 
+                    </Spin>
                 </div>
             </Modal>