Merge pull request #962 from dlabrecq/select-fix

Refactor select component wrapper
RedHatInsights · Jan 24, 2024 · 5be707d · 5be707d
2 parents 9d8cc3c + f24208a
commit 5be707d
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 24 deletions.
diff --git a/src/routes/components/perspective/Perspective.tsx b/src/routes/components/perspective/Perspective.tsx
@@ -62,29 +62,11 @@ const Perspective: React.FC<PerspectiveProps> = ({
           id={id}
           isDisabled={isDisabled}
           onSelect={onSelect}
+          options={selectOptions}
           selection={selection}
-          selectOptions={selectOptions}
         />
       </>
     );
-    // <Select
-    //   id={id}
-    //   isDisabled={isDisabled}
-    //   isOpen={isSelectOpen}
-    //   onSelect={(_evt, value) => handleOnSelect(value)}
-    //   onToggle={(_evt, isExpanded) => handleOnToggle(isExpanded)}
-    //   selections={selection}
-    //   variant={SelectVariant.single}
-    // >
-    //   {selectOptions.map((option, index) => (
-    //     <SelectOption
-    //       key={`${id}-${index}-${option.value}`}
-    //       description={option.description}
-    //       value={option}
-    //       isDisabled={option.isDisabled}
-    //     />
-    //   ))}
-    // </Select>
   };
 
   return (

diff --git a/src/routes/components/selectWrapper/selectWrapper.test.tsx b/src/routes/components/selectWrapper/selectWrapper.test.tsx
@@ -14,10 +14,10 @@ test('primary selector', async () => {
   ];
   render(
     <SelectWrapper
-      onSelect={(_evt, select) => handleOnSelect(select.value)}
+      onSelect={(_evt, selection) => handleOnSelect(selection.value)}
+      options={selectOptions}
       placeholder={'Resources'}
       selection={selectOptions[0]}
-      selectOptions={selectOptions}
     />
   );
   expect(screen.queryAllByText('CPU').length).toBe(1);

diff --git a/src/routes/components/selectWrapper/selectWrapper.tsx b/src/routes/components/selectWrapper/selectWrapper.tsx
@@ -18,9 +18,9 @@ interface SelectWrapperOwnProps {
   isDisabled?: boolean;
   onSelect?: (event, value: SelectWrapperOption) => void;
   placeholder?: string;
+  options?: SelectWrapperOption[];
   position?: 'right' | 'left' | 'center' | 'start' | 'end';
   selection?: string | SelectWrapperOption;
-  selectOptions?: SelectWrapperOption[];
   toggleIcon?: React.ReactNode;
 }
 
@@ -32,10 +32,10 @@ const SelectWrapper: React.FC<SelectWrapperProps> = ({
   id,
   isDisabled,
   onSelect = () => {},
+  options,
   placeholder = null,
   position,
   selection,
-  selectOptions,
   toggleIcon,
 }) => {
   const [isOpen, setIsOpen] = useState(false);
@@ -98,7 +98,7 @@ const SelectWrapper: React.FC<SelectWrapperProps> = ({
         toggle={toggle}
       >
         <SelectList aria-label={ariaLabel}>
-          {selectOptions.map((option, index) => getSelectOption(option, index))}
+          {options?.map((option, index) => getSelectOption(option, index))}
         </SelectList>
       </Select>
     </div>