Fixing a few bugs in old UI

Signed-off-by: Kshitij Tandon <tandonks@amazon.com>
opensearch-project · Aug 19, 2024 · 1e6df0b · 1e6df0b
1 parent b7606e0
commit 1e6df0b
Show file tree

Hide file tree

Showing 14 changed files with 421 additions and 428 deletions.
diff --git a/public/pages/ChangePolicy/containers/ChangePolicy/ChangePolicy.tsx b/public/pages/ChangePolicy/containers/ChangePolicy/ChangePolicy.tsx
@@ -159,66 +159,67 @@ export class ChangePolicy extends Component<ChangePolicyProps, ChangePolicyState
       hasSubmitted,
     } = this.state;
 
-    const Title = !useUpdatedUX
-      ? () => {
-          return (
-            <EuiFlexItem>
-              <EuiTitle size="l">
-                <h1>Change Policy</h1>
-              </EuiTitle>
-              <EuiSpacer />
+    const Common = () => {
+      return (
+        <>
+          <ChangeManagedIndices
+            key={`changeManagedIndices-${this.props.dataSourceId}`} // force re-mount on dataSourceId change
+            {...this.props}
+            managedIndexService={managedIndexService}
+            selectedManagedIndices={selectedManagedIndices}
+            selectedStateFilters={selectedStateFilters}
+            onChangeManagedIndices={this.onChangeManagedIndices}
+            onChangeStateFilters={this.onChangeStateFilters}
+            managedIndicesError={hasSubmitted ? managedIndicesError : ""}
+            useUpdatedUX={useUpdatedUX}
+          />
+
+          <EuiSpacer />
+
+          <NewPolicy
+            key={`newPolicy-${this.props.dataSourceId}`} // force re-mount on dataSourceId change
+            {...this.props}
+            indexService={indexService}
+            selectedPolicies={selectedPolicies}
+            stateRadioIdSelected={stateRadioIdSelected}
+            stateSelected={stateSelected}
+            onChangePolicy={this.onChangeSelectedPolicy}
+            onChangeStateRadio={this.onChangeStateRadio}
+            onStateSelectChange={this.onStateSelectChange}
+            selectedPoliciesError={hasSubmitted ? selectedPoliciesError : ""}
+            useUpdatedUX={useUpdatedUX}
+          />
+
+          <EuiSpacer />
+
+          <EuiFlexGroup alignItems="center" justifyContent="flexEnd">
+            <EuiFlexItem grow={false}>
+              <EuiButtonEmpty size={useUpdatedUX ? "s" : undefined} onClick={this.onCancel} data-test-subj="changePolicyCancelButton">
+                Cancel
+              </EuiButtonEmpty>
             </EuiFlexItem>
-          );
-        }
-      : () => {};
-
-    return (
-      <div style={{ padding: "0px 0px" }}>
-        {Title()}
-
-        <ChangeManagedIndices
-          key={`changeManagedIndices-${this.props.dataSourceId}`} // force re-mount on dataSourceId change
-          {...this.props}
-          managedIndexService={managedIndexService}
-          selectedManagedIndices={selectedManagedIndices}
-          selectedStateFilters={selectedStateFilters}
-          onChangeManagedIndices={this.onChangeManagedIndices}
-          onChangeStateFilters={this.onChangeStateFilters}
-          managedIndicesError={hasSubmitted ? managedIndicesError : ""}
-          useUpdatedUX={useUpdatedUX}
-        />
-
-        <EuiSpacer />
+            <EuiFlexItem grow={false}>
+              <EuiButton size={useUpdatedUX ? "s" : undefined} fill onClick={this.onSubmit} data-test-subj="changePolicyChangeButton">
+                Change
+              </EuiButton>
+            </EuiFlexItem>
+          </EuiFlexGroup>
+        </>
+      );
+    };
 
-        <NewPolicy
-          key={`newPolicy-${this.props.dataSourceId}`} // force re-mount on dataSourceId change
-          {...this.props}
-          indexService={indexService}
-          selectedPolicies={selectedPolicies}
-          stateRadioIdSelected={stateRadioIdSelected}
-          stateSelected={stateSelected}
-          onChangePolicy={this.onChangeSelectedPolicy}
-          onChangeStateRadio={this.onChangeStateRadio}
-          onStateSelectChange={this.onStateSelectChange}
-          selectedPoliciesError={hasSubmitted ? selectedPoliciesError : ""}
-          useUpdatedUX={useUpdatedUX}
-        />
+    return !useUpdatedUX ? (
+      <div style={{ padding: "0px 25px" }}>
+        <EuiTitle size="l">
+          <h1>Change policy</h1>
+        </EuiTitle>
 
         <EuiSpacer />
 
-        <EuiFlexGroup alignItems="center" justifyContent="flexEnd">
-          <EuiFlexItem grow={false}>
-            <EuiButtonEmpty size={useUpdatedUX ? "s" : undefined} onClick={this.onCancel} data-test-subj="changePolicyCancelButton">
-              Cancel
-            </EuiButtonEmpty>
-          </EuiFlexItem>
-          <EuiFlexItem grow={false}>
-            <EuiButton size={useUpdatedUX ? "s" : undefined} fill onClick={this.onSubmit} data-test-subj="changePolicyChangeButton">
-              Change
-            </EuiButton>
-          </EuiFlexItem>
-        </EuiFlexGroup>
+        {Common()}
       </div>
+    ) : (
+      <div style={{ padding: "0px 0px" }}>{Common()}</div>
     );
   }
 }

diff --git a/public/pages/ChangePolicy/containers/ChangePolicy/__snapshots__/ChangePolicy.test.tsx.snap b/public/pages/ChangePolicy/containers/ChangePolicy/__snapshots__/ChangePolicy.test.tsx.snap
@@ -2,20 +2,16 @@
 
 exports[`<ChangePolicy /> spec renders the component 1`] = `
 <div
-  style="padding: 0px 0px;"
+  style="padding: 0px 25px;"
 >
-  <div
-    class="euiFlexItem"
+  <h1
+    class="euiTitle euiTitle--large"
   >
-    <h1
-      class="euiTitle euiTitle--large"
-    >
-      Change Policy
-    </h1>
-    <div
-      class="euiSpacer euiSpacer--l"
-    />
-  </div>
+    Change policy
+  </h1>
+  <div
+    class="euiSpacer euiSpacer--l"
+  />
   <div
     class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow"
     style="padding-left: 0px; padding-right: 0px;"

diff --git a/...exTemplate/containers/CreateIndexTemplate/__snapshots__/CreateIndexTemplate.test.tsx.snap b/...exTemplate/containers/CreateIndexTemplate/__snapshots__/CreateIndexTemplate.test.tsx.snap
@@ -52,9 +52,6 @@ exports[`<CreateIndexTemplate /> spec render template pages 1`] = `
           </span>
         </button>
       </div>
-      <div
-        class="euiSpacer euiSpacer--l"
-      />
     </div>
     <div
       class="euiSpacer euiSpacer--l"

diff --git a/public/pages/CreateIndexTemplate/containers/TemplateDetail/TemplateDetail.tsx b/public/pages/CreateIndexTemplate/containers/TemplateDetail/TemplateDetail.tsx
@@ -333,7 +333,6 @@ const TemplateDetail = (props: TemplateDetailProps, ref: Ref<FieldInstance>) =>
                   }}
                 />
               </EuiFlexItem>
-              <EuiSpacer />
             </>
           ) : null}
         </EuiFlexGroup>