feat: show linear progress bar when deployment upload

so1s · Nov 16, 2022 · 22255fa · 22255fa
1 parent 0eb5603
commit 22255fa
Showing 1 changed file with 5 additions and 0 deletions.
diff --git a/src/pages/deployments/create-update-base.tsx b/src/pages/deployments/create-update-base.tsx
@@ -10,6 +10,7 @@ import {
     FormControlLabel,
     Radio,
     Slider,
+    LinearProgress,
 } from '@mui/material';
 import { pipe } from 'fp-ts/lib/function';
 import { useAtom } from 'jotai';
@@ -57,6 +58,7 @@ const CreateUpdateDeploymentBase: React.FC<ICreateUpdateBaseParams> = ({
     const standardValueRef = useRef<HTMLInputElement>(null);
     const [replicaRange, setReplicaRange] = useState<number[]>([1, 4]);
     const [radioValue, setRadioValue] = useState<ScalingToggleMode>('REPLICAS');
+    const [isUploading, setIsUploading] = useState(false);
 
     const handleChangeModel = (
         event: SelectChangeEvent<number>,
@@ -133,6 +135,8 @@ const CreateUpdateDeploymentBase: React.FC<ICreateUpdateBaseParams> = ({
             maxReplicas: replicaRange[1],
         };
 
+        setIsUploading(true);
+
         const data = await createDeploymentOrPut(
             {
                 name: itemsWithValues['Deployment Name'] as string,
@@ -405,6 +409,7 @@ const CreateUpdateDeploymentBase: React.FC<ICreateUpdateBaseParams> = ({
                     />
                 )}
             </div>
+            {isUploading && <LinearProgress color="primary" />}
         </ActionCard>
     );
 };