cleanup loading state issues

elastic · Feb 27, 2020 · cf73141 · cf73141
1 parent 71e13d4
commit cf73141
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 6 deletions.
diff --git a/x-pack/legacy/plugins/siem/public/components/markdown_editor/index.tsx b/x-pack/legacy/plugins/siem/public/components/markdown_editor/index.tsx
@@ -101,7 +101,7 @@ export const MarkdownEditor = React.memo<{
         ),
       },
     ],
-    [content, placeholder]
+    [content, isDisabled, placeholder]
   );
   return (
     <Container>

diff --git a/x-pack/legacy/plugins/siem/public/pages/case/components/case_view/index.tsx b/x-pack/legacy/plugins/siem/public/pages/case/components/case_view/index.tsx
@@ -49,6 +49,10 @@ const MyWrapper = styled(WrapperPage)`
   padding-bottom: 0;
 `;
 
+const MyEuiFlexGroup = styled(EuiFlexGroup)`
+  height: 100%;
+`;
+
 const BackgroundWrapper = styled.div`
   ${({ theme }) => css`
     background-color: ${theme.eui.euiColorEmptyShade};
@@ -239,11 +243,11 @@ export const CaseView = React.memo(({ caseId }: Props) => {
   }
   if (isLoading) {
     return (
-      <EuiFlexGroup justifyContent="center" alignItems="center">
+      <MyEuiFlexGroup justifyContent="center" alignItems="center">
         <EuiFlexItem grow={false}>
           <EuiLoadingSpinner size="xl" />
         </EuiFlexItem>
-      </EuiFlexGroup>
+      </MyEuiFlexGroup>
     );
   }
 

diff --git a/x-pack/legacy/plugins/siem/public/pages/case/components/create/index.tsx b/x-pack/legacy/plugins/siem/public/pages/case/components/create/index.tsx
@@ -39,6 +39,7 @@ const MySpinner = styled(EuiLoadingSpinner)`
   position: absolute;
   top: 50%;
   left: 50%;
+  z-index: 99;
 `;
 
 export const Create = React.memo(() => {
@@ -76,8 +77,8 @@ export const Create = React.memo(() => {
             'data-test-subj': 'caseTitle',
             euiFieldProps: {
               fullWidth: false,
+              disabled: isLoading,
             },
-            isDisabled: isLoading,
           }}
         />
         <Container>
@@ -89,8 +90,8 @@ export const Create = React.memo(() => {
               euiFieldProps: {
                 fullWidth: true,
                 placeholder: '',
+                isDisabled: isLoading,
               },
-              isDisabled: isLoading,
             }}
           />
         </Container>
@@ -100,8 +101,8 @@ export const Create = React.memo(() => {
             component={MarkdownEditorForm}
             componentProps={{
               idAria: 'caseDescription',
-              isDisabled: isLoading,
               dataTestSubj: 'caseDescription',
+              isDisabled: isLoading,
             }}
           />
         </ContainerBig>