From dfad4ff84046bd4620c85f5593e50a9981995b26 Mon Sep 17 00:00:00 2001
From: ANTONA09 <akshay.antony@nyulangone.org>
Date: Tue, 13 Aug 2024 13:03:03 +0530
Subject: [PATCH] fix: #7037, Dropdown: Cannot change icon when expanding or
 collapsing options

---
 components/lib/dropdown/Dropdown.js     | 3 ++-
 components/lib/dropdown/DropdownBase.js | 1 +
 components/lib/dropdown/dropdown.d.ts   | 4 ++++
 3 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/components/lib/dropdown/Dropdown.js b/components/lib/dropdown/Dropdown.js
index ea4baf02cb..c9592c372a 100644
--- a/components/lib/dropdown/Dropdown.js
+++ b/components/lib/dropdown/Dropdown.js
@@ -3,6 +3,7 @@ import PrimeReact, { FilterService, PrimeReactContext, localeOption } from '../a
 import { useHandleStyle } from '../componentbase/ComponentBase';
 import { useMergeProps, useMountEffect, useOverlayListener, useUnmountEffect, useUpdateEffect } from '../hooks/Hooks';
 import { ChevronDownIcon } from '../icons/chevrondown';
+import { ChevronUpIcon } from '../icons/chevronup';
 import { SpinnerIcon } from '../icons/spinner';
 import { TimesIcon } from '../icons/times';
 import { OverlayService } from '../overlayservice/OverlayService';
@@ -1197,7 +1198,7 @@ export const Dropdown = React.memo(
                 },
                 ptm('dropdownIcon')
             );
-            const icon = props.dropdownIcon || <ChevronDownIcon {...dropdownIconProps} />;
+            const icon = !overlayVisibleState ? props.dropdownIcon || <ChevronDownIcon {...dropdownIconProps} /> : props.collapseIcon || <ChevronUpIcon {...dropdownIconProps} />;
             const dropdownIcon = IconUtils.getJSXIcon(icon, { ...dropdownIconProps }, { props });
 
             const ariaLabel = props.placeholder || props.ariaLabel;
diff --git a/components/lib/dropdown/DropdownBase.js b/components/lib/dropdown/DropdownBase.js
index da0b19a2b3..88ac1e1563 100644
--- a/components/lib/dropdown/DropdownBase.js
+++ b/components/lib/dropdown/DropdownBase.js
@@ -170,6 +170,7 @@ export const DropdownBase = ComponentBase.extend({
         dataKey: null,
         disabled: false,
         dropdownIcon: null,
+        collapseIcon: null,
         editable: false,
         emptyFilterMessage: null,
         highlightOnSelect: true,
diff --git a/components/lib/dropdown/dropdown.d.ts b/components/lib/dropdown/dropdown.d.ts
index 5c2fd1a2af..de11f4e693 100644
--- a/components/lib/dropdown/dropdown.d.ts
+++ b/components/lib/dropdown/dropdown.d.ts
@@ -281,6 +281,10 @@ export interface DropdownProps extends Omit<React.DetailedHTMLProps<React.InputH
      * Icon of the dropdown.
      */
     dropdownIcon?: IconType<DropdownProps> | undefined;
+    /**
+     * Icon of collapse action.
+     */
+    collapseIcon?: IconType<DropdownProps> | undefined;
     /**
      * When present, custom value instead of predefined options can be entered using the editable input field.
      * @defaultValue false