add loading

src/loading.jsx

@@ -0,0 +1,22 @@
+import Spinner from 'react-bootstrap/Spinner';
+import styled from "styled-components";
+
+const Box = styled.div`
+    width: 100vw;
+    height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position:fixed;
+    background: rgba(0,0,0,0.3);
+    left: 0;
+    top: 0;
+    z-index: 99;
+    backdrop-filter: blur(3px);
+`
+
+export default function Loading() {
+    return <Box>
+        <Spinner animation="border" role="status" variant="primary" size="lg" />
+    </Box>
+}

src/views/Home.jsx

@@ -11,6 +11,7 @@ import styled from "styled-components";
 
 import {Card,Button } from "react-bootstrap";
 import {nftStorageUploader} from "../utils/nftStorageUploader.js";
+import Loading from "../loading.jsx";
 
 const { TextArea } = Input;
 
@@ -277,6 +278,10 @@ export default function Home({cluster}) {
 
     return (
         <FlexBox>
+            {
+                loading &&       <Loading />
+            }
+
             <Steps
                 current={step}
                 status={step >= 0 ? stepStatus[step] : "process"}