Merge pull request #287 from devtron-labs/feat/filter-select-error

feat: hide footer on filter select error

Author: arunjaindev

.github/CODEOWNERS

@@ -0,0 +1 @@
+* vivek@devtron.ai @vikramdevtron

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.2.26",
+    "version": "0.2.27",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -28,7 +28,7 @@ const Tooltip = ({
             arrow={false}
             placement="top"
             {...rest}
-            className={`default-tt ${wordBreak ? 'dc__word-break-all' : ''} dc__mxw-200 ${rest.className}`}
+            className={`default-tt ${wordBreak ? 'dc__word-break-all' : ''} dc__mxw-200-imp ${rest.className}`}
         >
             {cloneElement(child, { ...child.props, ref: refCallback })}
         </TippyJS>

src/Common/Tooltip/Tooltip.tsx

@@ -208,6 +208,7 @@ const SelectPicker = <OptionValue, IsMulti extends boolean>({
     shouldMenuAlignRight = false,
     fullWidth = false,
     customSelectedOptionsCount = null,
+    renderMenuListFooter,
     ...props
 }: SelectPickerProps<OptionValue, IsMulti>) => {
     const { inputId, required, isDisabled, controlShouldRenderValue = true, value, options } = props
@@ -397,6 +398,7 @@ const SelectPicker = <OptionValue, IsMulti extends boolean>({
                                 isValidNewOption={isValidNewOption}
                                 createOptionPosition="first"
                                 onCreateOption={handleCreateOption}
+                                renderMenuListFooter={!optionListError && renderMenuListFooter}
                             />
                         ) : (
                             <ReactSelect
@@ -414,6 +416,7 @@ const SelectPicker = <OptionValue, IsMulti extends boolean>({
                                     ValueContainer: renderValueContainer,
                                     NoOptionsMessage: renderNoOptionsMessage,
                                 }}
+                                renderMenuListFooter={!optionListError && renderMenuListFooter}
                             />
                         )}
                     </div>

src/Shared/Components/SelectPicker/SelectPicker.component.tsx

@@ -247,7 +247,13 @@ export interface FilterSelectPickerProps
         >,
         Pick<
             SelectPickerProps<number | string, true>,
-            'selectRef' | 'inputId' | 'menuPosition' | 'autoFocus' | 'shouldMenuAlignRight'
+            | 'selectRef'
+            | 'inputId'
+            | 'menuPosition'
+            | 'autoFocus'
+            | 'shouldMenuAlignRight'
+            | 'optionListError'
+            | 'reloadOptionList'
         > {
     appliedFilterOptions: SelectPickerOptionType[]
     handleApplyFilter: (filtersToApply: SelectPickerOptionType<number | string>[]) => void