Bug fixes and retracting some formatting changes (#1141) (#1145)

* A couple of bug fixes and Look Good Feel Good changes * Revert yarn.lock changes * Bug fix in Indexes page and worked on comments on previous commit * Add yarn file * Removing feel good changes from prior commit * Fixed rerendering of pages on clicking change and create buttons * Adding MDS support in Shrink page in Indexes in ISM * Fixed a test file and removed couple of reduntant flag uses * Some more frivolous code from last commit * Some snap file changes * Resolved comments * Import issue in Templates * Description changes --------- Signed-off-by: Kshitij Tandon <[email protected]>
opensearch-project · Aug 23, 2024 · 487b960 · 487b960
1 parent 4d7b3db
commit 487b960
Show file tree

Hide file tree

Showing 28 changed files with 558 additions and 408 deletions.
diff --git a/public/pages/Aliases/components/IndexControls/IndexControls.tsx b/public/pages/Aliases/components/IndexControls/IndexControls.tsx
@@ -4,7 +4,7 @@
  */
 
 import React, { useEffect, useState } from "react";
-import { EuiCompressedComboBox, EuiCompressedFieldSearch, EuiFlexGroup, EuiFlexItem } from "@elastic/eui";
+import { EuiCompressedComboBox, EuiCompressedFieldSearch, EuiFlexGroup, EuiFlexItem, EuiSpacer } from "@elastic/eui";
 import { ALIAS_STATUS_OPTIONS, IndicesUpdateMode } from "../../../../utils/constants";
 import { getUISettings } from "../../../../services/Services";
 import AliasesActions from "../../containers/AliasActions";
@@ -42,35 +42,38 @@ export default function SearchControls(props: SearchControlsProps) {
   const useUpdatedUX = uiSettings.get("home:useNewHomePage");
 
   return useUpdatedUX ? (
-    <EuiFlexGroup style={{ padding: "0px 5px" }} alignItems="center">
-      <EuiFlexItem>
-        <EuiCompressedFieldSearch
-          fullWidth
-          placeholder="Search"
-          value={state.search}
-          onChange={(e) => onChange("search", e.target.value)}
-        />
-      </EuiFlexItem>
-      <EuiFlexItem style={{ flexBasis: "100px" }} grow={false}>
-        <FilterGroup
-          filterButtonProps={{
-            children: "Status",
-          }}
-          onChange={(val) => onChange("status", (val || []).map((item) => item).join(","))}
-          value={state.status ? state.status.split(",").map((label) => label) : []}
-          options={ALIAS_STATUS_OPTIONS}
-          useNewUX={useUpdatedUX}
-        />
-      </EuiFlexItem>
-      <EuiFlexItem grow={false}>
-        <AliasesActions
-          onUpdateAlias={props.onUpdateAlias}
-          selectedItems={props.value.selectedItems}
-          onDelete={props.onDelete}
-          history={props.history}
-        />
-      </EuiFlexItem>
-    </EuiFlexGroup>
+    <>
+      <EuiFlexGroup alignItems="center" gutterSize="s">
+        <EuiFlexItem>
+          <EuiCompressedFieldSearch
+            fullWidth
+            placeholder="Search"
+            value={state.search}
+            onChange={(e) => onChange("search", e.target.value)}
+          />
+        </EuiFlexItem>
+        <EuiFlexItem style={{ flexBasis: "100px" }} grow={false}>
+          <FilterGroup
+            filterButtonProps={{
+              children: "Status",
+            }}
+            onChange={(val) => onChange("status", (val || []).map((item) => item).join(","))}
+            value={state.status ? state.status.split(",").map((label) => label) : []}
+            options={ALIAS_STATUS_OPTIONS}
+            useNewUX={useUpdatedUX}
+          />
+        </EuiFlexItem>
+        <EuiFlexItem grow={false}>
+          <AliasesActions
+            onUpdateAlias={props.onUpdateAlias}
+            selectedItems={props.value.selectedItems}
+            onDelete={props.onDelete}
+            history={props.history}
+          />
+        </EuiFlexItem>
+      </EuiFlexGroup>
+      <EuiSpacer size="m" />
+    </>
   ) : (
     <EuiFlexGroup style={{ padding: "0px 5px" }} alignItems="center">
       <EuiFlexItem>

diff --git a/public/pages/ChangePolicy/components/ChangeManagedIndices/ChangeManagedIndices.tsx b/public/pages/ChangePolicy/components/ChangeManagedIndices/ChangeManagedIndices.tsx
@@ -17,7 +17,6 @@ interface ChangeManagedIndicesProps {
   onChangeManagedIndices: (selectedManagedIndices: { label: string; value?: ManagedIndexItem }[]) => void;
   onChangeStateFilters: (stateFilter: { label: string }[]) => void;
   managedIndicesError: string;
-  useUpdatedUX?: boolean;
 }
 
 interface ChangeManagedIndicesState {
@@ -72,7 +71,7 @@ export default class ChangeManagedIndices extends Component<ChangeManagedIndices
 
   render() {
     const { managedIndices, managedIndicesIsLoading, stateFilterSearchValue } = this.state;
-    const { selectedManagedIndices, selectedStateFilters, managedIndicesError, useUpdatedUX } = this.props;
+    const { selectedManagedIndices, selectedStateFilters, managedIndicesError } = this.props;
     const uniqueStates = selectedManagedIndices.reduce(
       (accu: Set<any>, selectedManagedIndex: { label: string; value?: ManagedIndexItem }) => {
         if (!selectedManagedIndex.value) return accu;
@@ -109,7 +108,6 @@ export default class ChangeManagedIndices extends Component<ChangeManagedIndices
               // @ts-ignore
               onChange={this.props.onChangeManagedIndices}
               onSearchChange={this.onManagedIndexSearchChange}
-              compressed={useUpdatedUX ? true : false}
             />
           </EuiCompressedFormRow>
 
@@ -122,7 +120,6 @@ export default class ChangeManagedIndices extends Component<ChangeManagedIndices
               // @ts-ignore
               onChange={this.props.onChangeStateFilters}
               onSearchChange={this.onStateFilterSearchChange}
-              compressed={useUpdatedUX ? true : false}
             />
           </EuiCompressedFormRow>
         </div>

diff --git a/...gePolicy/components/ChangeManagedIndices/__snapshots__/ChangeManagedIndices.test.tsx.snap b/...gePolicy/components/ChangeManagedIndices/__snapshots__/ChangeManagedIndices.test.tsx.snap
@@ -59,17 +59,17 @@ exports[`<ChangeManagedIndices /> spec renders the component 1`] = `
             aria-describedby="some_html_id-help-0"
             aria-expanded="false"
             aria-haspopup="listbox"
-            class="euiComboBox"
+            class="euiComboBox euiComboBox--compressed"
             role="combobox"
           >
             <div
-              class="euiFormControlLayout"
+              class="euiFormControlLayout euiFormControlLayout--compressed"
             >
               <div
                 class="euiFormControlLayout__childrenWrapper"
               >
                 <div
-                  class="euiComboBox__inputWrap euiComboBox__inputWrap-isClearable"
+                  class="euiComboBox__inputWrap euiComboBox__inputWrap--compressed euiComboBox__inputWrap-isClearable"
                   data-test-subj="comboBoxInput"
                   tabindex="-1"
                 >
@@ -134,17 +134,17 @@ exports[`<ChangeManagedIndices /> spec renders the component 1`] = `
             aria-describedby="some_html_id-help-0"
             aria-expanded="false"
             aria-haspopup="listbox"
-            class="euiComboBox euiComboBox-isDisabled"
+            class="euiComboBox euiComboBox--compressed euiComboBox-isDisabled"
             role="combobox"
           >
             <div
-              class="euiFormControlLayout"
+              class="euiFormControlLayout euiFormControlLayout--compressed"
             >
               <div
                 class="euiFormControlLayout__childrenWrapper"
               >
                 <div
-                  class="euiComboBox__inputWrap"
+                  class="euiComboBox__inputWrap euiComboBox__inputWrap--compressed"
                   data-test-subj="comboBoxInput"
                   tabindex="-1"
                 >

diff --git a/public/pages/ChangePolicy/components/NewPolicy/NewPolicy.tsx b/public/pages/ChangePolicy/components/NewPolicy/NewPolicy.tsx
@@ -33,7 +33,6 @@ interface NewPolicyProps {
   onChangePolicy: (selectedPolicies: PolicyOption[]) => void;
   onChangeStateRadio: (optionId: string) => void;
   onStateSelectChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
-  useUpdatedUX?: boolean;
 }
 
 interface NewPolicyState {
@@ -123,7 +122,6 @@ export default class NewPolicy extends React.Component<NewPolicyProps, NewPolicy
               // @ts-ignore
               onChange={this.props.onChangePolicy}
               onSearchChange={this.onPolicySearchChange}
-              compressed={useUpdatedUX ? true : false}
             />
           </EuiCompressedFormRow>
 
@@ -140,7 +138,6 @@ export default class NewPolicy extends React.Component<NewPolicyProps, NewPolicy
               value={stateSelected}
               onChange={this.props.onStateSelectChange}
               aria-label="Start state for new policy"
-              compressed={useUpdatedUX ? true : false}
             />
           </EuiCompressedFormRow>
         </div>

diff --git a/public/pages/ChangePolicy/components/NewPolicy/__snapshots__/NewPolicy.test.tsx.snap b/public/pages/ChangePolicy/components/NewPolicy/__snapshots__/NewPolicy.test.tsx.snap
@@ -80,17 +80,17 @@ exports[`<NewPolicy /> spec renders the component 1`] = `
           <div
             aria-expanded="false"
             aria-haspopup="listbox"
-            class="euiComboBox"
+            class="euiComboBox euiComboBox--compressed"
             role="combobox"
           >
             <div
-              class="euiFormControlLayout"
+              class="euiFormControlLayout euiFormControlLayout--compressed"
             >
               <div
                 class="euiFormControlLayout__childrenWrapper"
               >
                 <div
-                  class="euiComboBox__inputWrap euiComboBox__inputWrap--noWrap euiComboBox__inputWrap-isClearable"
+                  class="euiComboBox__inputWrap euiComboBox__inputWrap--compressed euiComboBox__inputWrap--noWrap euiComboBox__inputWrap-isClearable"
                   data-test-subj="comboBoxInput"
                   tabindex="-1"
                 >

diff --git a/public/pages/ChangePolicy/containers/ChangePolicy/ChangePolicy.tsx b/public/pages/ChangePolicy/containers/ChangePolicy/ChangePolicy.tsx
@@ -171,7 +171,6 @@ export class ChangePolicy extends Component<ChangePolicyProps, ChangePolicyState
             onChangeManagedIndices={this.onChangeManagedIndices}
             onChangeStateFilters={this.onChangeStateFilters}
             managedIndicesError={hasSubmitted ? managedIndicesError : ""}
-            useUpdatedUX={useUpdatedUX}
           />
 
           <EuiSpacer />
@@ -187,7 +186,6 @@ export class ChangePolicy extends Component<ChangePolicyProps, ChangePolicyState
             onChangeStateRadio={this.onChangeStateRadio}
             onStateSelectChange={this.onStateSelectChange}
             selectedPoliciesError={hasSubmitted ? selectedPoliciesError : ""}
-            useUpdatedUX={useUpdatedUX}
           />
 
           <EuiSpacer />

diff --git a/public/pages/ChangePolicy/containers/ChangePolicy/__snapshots__/ChangePolicy.test.tsx.snap b/public/pages/ChangePolicy/containers/ChangePolicy/__snapshots__/ChangePolicy.test.tsx.snap
@@ -70,17 +70,17 @@ exports[`<ChangePolicy /> spec renders the component 1`] = `
               aria-describedby="some_html_id-help-0"
               aria-expanded="false"
               aria-haspopup="listbox"
-              class="euiComboBox"
+              class="euiComboBox euiComboBox--compressed"
               role="combobox"
             >
               <div
-                class="euiFormControlLayout"
+                class="euiFormControlLayout euiFormControlLayout--compressed"
               >
                 <div
                   class="euiFormControlLayout__childrenWrapper"
                 >
                   <div
-                    class="euiComboBox__inputWrap euiComboBox__inputWrap-isClearable"
+                    class="euiComboBox__inputWrap euiComboBox__inputWrap--compressed euiComboBox__inputWrap-isClearable"
                     data-test-subj="comboBoxInput"
                     tabindex="-1"
                   >
@@ -145,17 +145,17 @@ exports[`<ChangePolicy /> spec renders the component 1`] = `
               aria-describedby="some_html_id-help-0"
               aria-expanded="false"
               aria-haspopup="listbox"
-              class="euiComboBox euiComboBox-isDisabled"
+              class="euiComboBox euiComboBox--compressed euiComboBox-isDisabled"
               role="combobox"
             >
               <div
-                class="euiFormControlLayout"
+                class="euiFormControlLayout euiFormControlLayout--compressed"
               >
                 <div
                   class="euiFormControlLayout__childrenWrapper"
                 >
                   <div
-                    class="euiComboBox__inputWrap"
+                    class="euiComboBox__inputWrap euiComboBox__inputWrap--compressed"
                     data-test-subj="comboBoxInput"
                     tabindex="-1"
                   >
@@ -291,17 +291,17 @@ exports[`<ChangePolicy /> spec renders the component 1`] = `
             <div
               aria-expanded="false"
               aria-haspopup="listbox"
-              class="euiComboBox"
+              class="euiComboBox euiComboBox--compressed"
               role="combobox"
             >
               <div
-                class="euiFormControlLayout"
+                class="euiFormControlLayout euiFormControlLayout--compressed"
               >
                 <div
                   class="euiFormControlLayout__childrenWrapper"
                 >
                   <div
-                    class="euiComboBox__inputWrap euiComboBox__inputWrap--noWrap euiComboBox__inputWrap-isClearable"
+                    class="euiComboBox__inputWrap euiComboBox__inputWrap--compressed euiComboBox__inputWrap--noWrap euiComboBox__inputWrap-isClearable"
                     data-test-subj="comboBoxInput"
                     tabindex="-1"
                   >

diff --git a/public/pages/ComposableTemplates/components/IndexControls/IndexControls.tsx b/public/pages/ComposableTemplates/components/IndexControls/IndexControls.tsx
@@ -13,7 +13,6 @@ export interface SearchControlsProps {
     search: string;
     selectedTypes: string[];
   };
-  useNewUX?: boolean;
   onSearchChange: (args: SearchControlsProps["value"]) => void;
 }
 
@@ -47,7 +46,6 @@ export default function SearchControls(props: SearchControlsProps) {
           }}
           onChange={(val) => onChange("selectedTypes", val || [])}
           value={state.selectedTypes}
-          useNewUx={props.useNewUX}
           options={[
             {
               label: IndicesUpdateMode.alias,

diff --git a/public/pages/ComposableTemplates/containers/ComposableTemplates/ComposableTemplates.tsx b/public/pages/ComposableTemplates/containers/ComposableTemplates/ComposableTemplates.tsx
@@ -436,7 +436,6 @@ class ComposableTemplates extends MDSEnabledComponent<ComposableTemplatesProps,
               search: this.state.search,
               selectedTypes: this.state.selectedTypes,
             }}
-            useNewUX={useNewUX}
             onSearchChange={this.onSearchChange}
           />
           <EuiHorizontalRule margin="xs" />
@@ -515,7 +514,6 @@ class ComposableTemplates extends MDSEnabledComponent<ComposableTemplatesProps,
               search: this.state.search,
               selectedTypes: this.state.selectedTypes,
             }}
-            useNewUX={useNewUX}
             onSearchChange={this.onSearchChange}
           />
           <EuiHorizontalRule margin="xs" />

diff --git a/public/pages/CreateTransform/containers/ReviewAndCreateStep/ReviewAndCreateStep.tsx b/public/pages/CreateTransform/containers/ReviewAndCreateStep/ReviewAndCreateStep.tsx
@@ -14,7 +14,6 @@ import JobNameAndIndices from "../../components/JobNameAndIndices";
 import ReviewDefinition from "../../components/ReviewDefinition";
 import ReviewSchedule from "../../components/ReviewSchedule";
 import { CoreServicesContext } from "../../../../components/core_services";
-import { getUISettings } from "../../../../services/Services";
 
 interface ReviewAndCreateStepProps extends RouteComponentProps {
   transformService: TransformService;