From 914736b2bb2c9a5ef3265c32287f234fded83422 Mon Sep 17 00:00:00 2001
From: JeevaRamanathan <jeevaramanathan.m@infosys.com>
Date: Sat, 25 May 2024 15:53:43 +0530
Subject: [PATCH] fixed autocomplete poppercomponent overlapping sidebar

Signed-off-by: JeevaRamanathan <jeevaramanathan.m@infosys.com>
---
 .../EntityAutocompletePicker/EntityAutocompletePicker.tsx      | 3 +++
 .../src/components/EntityOwnerPicker/EntityOwnerPicker.tsx     | 3 +++
 .../EntityProcessingStatusPicker.tsx                           | 3 +++
 .../TemplateCategoryPicker/TemplateCategoryPicker.tsx          | 3 +++
 4 files changed, 12 insertions(+)

diff --git a/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.tsx b/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.tsx
index d3c76a183d..8df0c367f6 100644
--- a/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.tsx
+++ b/plugins/catalog-react/src/components/EntityAutocompletePicker/EntityAutocompletePicker.tsx
@@ -152,6 +152,9 @@ export function EntityAutocompletePicker<
       <Typography className={classes.label} variant="button" component="label">
         {label}
         <Autocomplete<string, true>
+          PopperComponent={popperProps => (
+            <div {...popperProps}>{popperProps.children}</div>
+          )}
           multiple
           disableCloseOnSelect
           options={availableOptions}
diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx
index 88ff3945d1..f6f1746744 100644
--- a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx
+++ b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx
@@ -178,6 +178,9 @@ export const EntityOwnerPicker = (props?: EntityOwnerPickerProps) => {
       <Typography className={classes.label} variant="button" component="label">
         Owner
         <Autocomplete
+          PopperComponent={popperProps => (
+            <div {...popperProps}>{popperProps.children}</div>
+          )}
           multiple
           disableCloseOnSelect
           loading={loading}
diff --git a/plugins/catalog-react/src/components/EntityProcessingStatusPicker/EntityProcessingStatusPicker.tsx b/plugins/catalog-react/src/components/EntityProcessingStatusPicker/EntityProcessingStatusPicker.tsx
index f7de5d72b1..692cf213ab 100644
--- a/plugins/catalog-react/src/components/EntityProcessingStatusPicker/EntityProcessingStatusPicker.tsx
+++ b/plugins/catalog-react/src/components/EntityProcessingStatusPicker/EntityProcessingStatusPicker.tsx
@@ -73,6 +73,9 @@ export const EntityProcessingStatusPicker = () => {
       <Typography className={classes.label} variant="button" component="label">
         Processing Status
         <Autocomplete<string, true>
+          PopperComponent={popperProps => (
+            <div {...popperProps}>{popperProps.children}</div>
+          )}
           multiple
           disableCloseOnSelect
           options={availableAdvancedItems}
diff --git a/plugins/scaffolder-react/src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.tsx b/plugins/scaffolder-react/src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.tsx
index 24f8a21109..5247e86c53 100644
--- a/plugins/scaffolder-react/src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.tsx
+++ b/plugins/scaffolder-react/src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.tsx
@@ -78,6 +78,9 @@ export const TemplateCategoryPicker = () => {
         Categories
       </Typography>
       <Autocomplete<string, true>
+        PopperComponent={popperProps => (
+          <div {...popperProps}>{popperProps.children}</div>
+        )}
         multiple
         id="categories-picker"
         options={availableTypes}