From 51dec3209e5ee480b1c40e1cfd2e96f128a03862 Mon Sep 17 00:00:00 2001
From: Gustavo Santos <gefgu@hotmail.com>
Date: Thu, 22 Sep 2022 14:21:01 -0300
Subject: [PATCH 1/5] feat(context selector): replaced input group with search
 input

---
 .../ContextSelector/ContextSelector.tsx       | 38 +++++--------------
 1 file changed, 10 insertions(+), 28 deletions(-)

diff --git a/packages/react-core/src/components/ContextSelector/ContextSelector.tsx b/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
index 8789969b137..4dd319daf5f 100644
--- a/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
+++ b/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
@@ -1,17 +1,13 @@
 import * as React from 'react';
 import styles from '@patternfly/react-styles/css/components/ContextSelector/context-selector';
 import { css } from '@patternfly/react-styles';
-import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
 import { ContextSelectorToggle } from './ContextSelectorToggle';
 import { ContextSelectorMenuList } from './ContextSelectorMenuList';
 import { ContextSelectorContext } from './contextSelectorConstants';
-import { Button, ButtonVariant } from '../Button';
-import { TextInput } from '../TextInput';
-import { InputGroup } from '../InputGroup';
-import { KeyTypes } from '../../helpers/constants';
 import { FocusTrap, getUniqueId } from '../../helpers';
 import { Popper } from '../../helpers/Popper/Popper';
 import { getOUIAProps, OUIAProps, getDefaultOUIAId } from '../../helpers';
+import { SearchInput } from '../SearchInput';
 
 export interface ContextSelectorProps extends OUIAProps {
   /** content rendered inside the Context Selector */
@@ -104,12 +100,6 @@ export class ContextSelector extends React.Component<ContextSelectorProps, { oui
   parentRef: React.RefObject<HTMLDivElement> = React.createRef();
   popperRef: React.RefObject<HTMLDivElement> = React.createRef();
 
-  onEnterPressed = (event: any) => {
-    if (event.key === KeyTypes.Enter) {
-      this.props.onSearchButtonClick();
-    }
-  };
-
   render() {
     const {
       children,
@@ -150,23 +140,15 @@ export class ContextSelector extends React.Component<ContextSelectorProps, { oui
             focusTrapOptions={{ clickOutsideDeactivates: true, tabbableOptions: { displayCheck: 'none' } }}
           >
             <div className={css(styles.contextSelectorMenuSearch)}>
-              <InputGroup>
-                <TextInput
-                  value={searchInputValue}
-                  type="search"
-                  placeholder={searchInputPlaceholder}
-                  onChange={onSearchInputChange}
-                  onKeyPress={this.onEnterPressed}
-                  aria-label={searchButtonAriaLabel}
-                />
-                <Button
-                  variant={ButtonVariant.control}
-                  aria-label={searchButtonAriaLabel}
-                  onClick={onSearchButtonClick}
-                >
-                  <SearchIcon aria-hidden="true" />
-                </Button>
-              </InputGroup>
+              <SearchInput
+                aria-label={searchButtonAriaLabel}
+                placeholder={searchInputPlaceholder}
+                onChange={onSearchInputChange}
+                onSearch={(value, event, _) => {
+                  onSearchButtonClick(event);
+                }}
+                value={searchInputValue}
+              />
             </div>
             <ContextSelectorContext.Provider value={{ onSelect }}>
               <ContextSelectorMenuList isOpen={isOpen}>{children}</ContextSelectorMenuList>

From 90208771df34070691962405ca8b7873509f76ce Mon Sep 17 00:00:00 2001
From: Gustavo Santos <gefgu@hotmail.com>
Date: Thu, 6 Oct 2022 21:39:53 -0300
Subject: [PATCH 2/5] chore(context selector): update snapshots

---
 .../ContextSelector.test.tsx.snap             | 120 +++++++++++++-----
 1 file changed, 86 insertions(+), 34 deletions(-)

diff --git a/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap b/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
index 37c450cc7f2..1c096638870 100644
--- a/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
+++ b/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
@@ -87,25 +87,51 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
           <div
             class="pf-c-input-group"
           >
-            <input
-              aria-invalid="false"
-              aria-label="Search menu items"
-              class="pf-c-form-control"
-              data-ouia-component-id="OUIA-Generated-TextInputBase-1"
-              data-ouia-component-type="PF4/TextInput"
-              data-ouia-safe="true"
-              placeholder="Search"
-              type="search"
-              value=""
-            />
+            <div
+              class="pf-c-text-input-group"
+            >
+              <div
+                class="pf-c-text-input-group__main pf-m-icon"
+              >
+                <span
+                  class="pf-c-text-input-group__text"
+                >
+                  <span
+                    class="pf-c-text-input-group__icon"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      style="vertical-align: -0.125em;"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                    >
+                      <path
+                        d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
+                      />
+                    </svg>
+                  </span>
+                  <input
+                    aria-label="Search menu items"
+                    class="pf-c-text-input-group__text-input"
+                    placeholder="Search"
+                    type="text"
+                    value=""
+                  />
+                </span>
+              </div>
+            </div>
             <button
-              aria-disabled="false"
-              aria-label="Search menu items"
-              class="pf-c-button pf-m-control"
+              aria-disabled="true"
+              aria-label="Search"
+              class="pf-c-button pf-m-control pf-m-disabled"
               data-ouia-component-id="OUIA-Generated-Button-control-1"
               data-ouia-component-type="PF4/Button"
               data-ouia-safe="true"
-              type="button"
+              disabled=""
+              type="submit"
             >
               <svg
                 aria-hidden="true"
@@ -113,11 +139,11 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
                 height="1em"
                 role="img"
                 style="vertical-align: -0.125em;"
-                viewBox="0 0 512 512"
+                viewBox="0 0 448 512"
                 width="1em"
               >
                 <path
-                  d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
+                  d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"
                 />
               </svg>
             </button>
@@ -231,25 +257,51 @@ exports[`ContextSelector Renders in strict mode 1`] = `
           <div
             class="pf-c-input-group"
           >
-            <input
-              aria-invalid="false"
-              aria-label="Search menu items"
-              class="pf-c-form-control"
-              data-ouia-component-id="OUIA-Generated-TextInputBase-3"
-              data-ouia-component-type="PF4/TextInput"
-              data-ouia-safe="true"
-              placeholder="Search"
-              type="search"
-              value=""
-            />
+            <div
+              class="pf-c-text-input-group"
+            >
+              <div
+                class="pf-c-text-input-group__main pf-m-icon"
+              >
+                <span
+                  class="pf-c-text-input-group__text"
+                >
+                  <span
+                    class="pf-c-text-input-group__icon"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      style="vertical-align: -0.125em;"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                    >
+                      <path
+                        d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
+                      />
+                    </svg>
+                  </span>
+                  <input
+                    aria-label="Search menu items"
+                    class="pf-c-text-input-group__text-input"
+                    placeholder="Search"
+                    type="text"
+                    value=""
+                  />
+                </span>
+              </div>
+            </div>
             <button
-              aria-disabled="false"
-              aria-label="Search menu items"
-              class="pf-c-button pf-m-control"
+              aria-disabled="true"
+              aria-label="Search"
+              class="pf-c-button pf-m-control pf-m-disabled"
               data-ouia-component-id="OUIA-Generated-Button-control-3"
               data-ouia-component-type="PF4/Button"
               data-ouia-safe="true"
-              type="button"
+              disabled=""
+              type="submit"
             >
               <svg
                 aria-hidden="true"
@@ -257,11 +309,11 @@ exports[`ContextSelector Renders in strict mode 1`] = `
                 height="1em"
                 role="img"
                 style="vertical-align: -0.125em;"
-                viewBox="0 0 512 512"
+                viewBox="0 0 448 512"
                 width="1em"
               >
                 <path
-                  d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
+                  d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"
                 />
               </svg>
             </button>

From d9f6ba2c6ed1a82bbcd92e2fd53ad8a61afb26d6 Mon Sep 17 00:00:00 2001
From: Gustavo Santos <53129852+gefgu@users.noreply.github.com>
Date: Mon, 17 Oct 2022 21:14:42 -0300
Subject: [PATCH 3/5] chore: update label

Co-authored-by: Eric Olkowski <70952936+thatblindgeye@users.noreply.github.com>
---
 .../src/components/ContextSelector/ContextSelector.tsx          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-core/src/components/ContextSelector/ContextSelector.tsx b/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
index 4dd319daf5f..a84fb4063d8 100644
--- a/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
+++ b/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
@@ -141,7 +141,7 @@ export class ContextSelector extends React.Component<ContextSelectorProps, { oui
           >
             <div className={css(styles.contextSelectorMenuSearch)}>
               <SearchInput
-                aria-label={searchButtonAriaLabel}
+                submitSearchButtonLabel={searchButtonAriaLabel}
                 placeholder={searchInputPlaceholder}
                 onChange={onSearchInputChange}
                 onSearch={(value, event, _) => {

From f4e415eef5924ce049d6d8bd5ebcedaf917c0eb7 Mon Sep 17 00:00:00 2001
From: Eric Olkowski <thatblindgeye@gmail.com>
Date: Fri, 2 Dec 2022 12:20:24 -0500
Subject: [PATCH 4/5] Updated per comments

---
 .../src/components/ContextSelector/ContextSelector.tsx    | 1 +
 .../__tests__/__snapshots__/ContextSelector.test.tsx.snap | 8 ++++----
 .../react-core/src/components/SearchInput/SearchInput.tsx | 2 +-
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/packages/react-core/src/components/ContextSelector/ContextSelector.tsx b/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
index a84fb4063d8..834b9097399 100644
--- a/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
+++ b/packages/react-core/src/components/ContextSelector/ContextSelector.tsx
@@ -141,6 +141,7 @@ export class ContextSelector extends React.Component<ContextSelectorProps, { oui
           >
             <div className={css(styles.contextSelectorMenuSearch)}>
               <SearchInput
+                type="search"
                 submitSearchButtonLabel={searchButtonAriaLabel}
                 placeholder={searchInputPlaceholder}
                 onChange={onSearchInputChange}
diff --git a/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap b/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
index 1c096638870..a13ca8124e5 100644
--- a/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
+++ b/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
@@ -114,7 +114,7 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
                     </svg>
                   </span>
                   <input
-                    aria-label="Search menu items"
+                    aria-label="Search input"
                     class="pf-c-text-input-group__text-input"
                     placeholder="Search"
                     type="text"
@@ -125,7 +125,7 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
             </div>
             <button
               aria-disabled="true"
-              aria-label="Search"
+              aria-label="Search menu items"
               class="pf-c-button pf-m-control pf-m-disabled"
               data-ouia-component-id="OUIA-Generated-Button-control-1"
               data-ouia-component-type="PF4/Button"
@@ -284,7 +284,7 @@ exports[`ContextSelector Renders in strict mode 1`] = `
                     </svg>
                   </span>
                   <input
-                    aria-label="Search menu items"
+                    aria-label="Search input"
                     class="pf-c-text-input-group__text-input"
                     placeholder="Search"
                     type="text"
@@ -295,7 +295,7 @@ exports[`ContextSelector Renders in strict mode 1`] = `
             </div>
             <button
               aria-disabled="true"
-              aria-label="Search"
+              aria-label="Search menu items"
               class="pf-c-button pf-m-control pf-m-disabled"
               data-ouia-component-id="OUIA-Generated-Button-control-3"
               data-ouia-component-type="PF4/Button"
diff --git a/packages/react-core/src/components/SearchInput/SearchInput.tsx b/packages/react-core/src/components/SearchInput/SearchInput.tsx
index ede8bd987c3..20c99dcb383 100644
--- a/packages/react-core/src/components/SearchInput/SearchInput.tsx
+++ b/packages/react-core/src/components/SearchInput/SearchInput.tsx
@@ -361,7 +361,7 @@ const SearchInputBase: React.FunctionComponent<SearchInputProps> = ({
           variant={ButtonVariant.control}
           aria-label={submitSearchButtonLabel}
           onClick={onSearchHandler}
-          isDisabled={isDisabled || !searchValue}
+          isDisabled={isDisabled}
         >
           <ArrowRightIcon />
         </Button>

From 0053d877b1a0e3260675a7923cdac3a94ed7a441 Mon Sep 17 00:00:00 2001
From: Eric Olkowski <thatblindgeye@gmail.com>
Date: Fri, 2 Dec 2022 12:42:45 -0500
Subject: [PATCH 5/5] Updated snapshots

---
 .../__snapshots__/ContextSelector.test.tsx.snap    | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap b/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
index a13ca8124e5..d45c8360fd8 100644
--- a/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
+++ b/packages/react-core/src/components/ContextSelector/__tests__/__snapshots__/ContextSelector.test.tsx.snap
@@ -117,20 +117,19 @@ exports[`ContextSelector Renders ContextSelector open 1`] = `
                     aria-label="Search input"
                     class="pf-c-text-input-group__text-input"
                     placeholder="Search"
-                    type="text"
+                    type="search"
                     value=""
                   />
                 </span>
               </div>
             </div>
             <button
-              aria-disabled="true"
+              aria-disabled="false"
               aria-label="Search menu items"
-              class="pf-c-button pf-m-control pf-m-disabled"
+              class="pf-c-button pf-m-control"
               data-ouia-component-id="OUIA-Generated-Button-control-1"
               data-ouia-component-type="PF4/Button"
               data-ouia-safe="true"
-              disabled=""
               type="submit"
             >
               <svg
@@ -287,20 +286,19 @@ exports[`ContextSelector Renders in strict mode 1`] = `
                     aria-label="Search input"
                     class="pf-c-text-input-group__text-input"
                     placeholder="Search"
-                    type="text"
+                    type="search"
                     value=""
                   />
                 </span>
               </div>
             </div>
             <button
-              aria-disabled="true"
+              aria-disabled="false"
               aria-label="Search menu items"
-              class="pf-c-button pf-m-control pf-m-disabled"
+              class="pf-c-button pf-m-control"
               data-ouia-component-id="OUIA-Generated-Button-control-3"
               data-ouia-component-type="PF4/Button"
               data-ouia-safe="true"
-              disabled=""
               type="submit"
             >
               <svg