From ed4902ee116e4a77ce9255348ac2c07f22555d81 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 19:09:04 +0100
Subject: [PATCH 01/12] add combobox role

---
 .../record-table-cell/components/RecordTableCellEditMode.tsx     | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx
index ecb2a8e283a6..a27340434a22 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx
@@ -39,6 +39,7 @@ export const RecordTableCellEditMode = ({
     <StyledEditableCellEditModeContainer
       ref={refs.setReference}
       data-testid="editable-cell-edit-mode-container"
+      role="combobox"
     >
       <OverlayContainer ref={refs.setFloating} style={floatingStyles}>
         {children}

From a52210f555ee1aea0504bdf4b2b631ac68091be0 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 19:34:54 +0100
Subject: [PATCH 02/12] malke dropdown options accessible

---
 .../src/navigation/menu-item/components/MenuItemSelect.tsx       | 1 +
 .../src/navigation/menu-item/components/MenuItemSelectAvatar.tsx | 1 +
 2 files changed, 2 insertions(+)

diff --git a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx
index a90fe43890d4..4b9748816a6f 100644
--- a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx
@@ -67,6 +67,7 @@ export const MenuItemSelect = ({
       selected={selected}
       disabled={disabled}
       hovered={hovered}
+      role="option"
     >
       <MenuItemLeftContent LeftIcon={LeftIcon} text={text} />
       {selected && <IconCheck size={theme.icon.size.md} />}
diff --git a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
index 4df9e280084b..8aceeeadec87 100644
--- a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
@@ -40,6 +40,7 @@ export const MenuItemSelectAvatar = ({
       disabled={disabled}
       hovered={hovered}
       data-testid={testId}
+      role="option"
     >
       <StyledMenuItemLeftContent>
         {avatar}

From dfe1a8f919110c5bcab6668e384a36ef54089b65 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 19:51:54 +0100
Subject: [PATCH 03/12] make dropdown accessible

---
 .../components/CurrencyPickerDropdownButton.tsx     | 13 +++++++------
 .../components/CurrencyPickerDropdownSelect.tsx     |  4 +++-
 .../ui/layout/dropdown/components/Dropdown.tsx      |  2 ++
 .../layout/dropdown/components/DropdownContent.tsx  |  2 ++
 4 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
index f46e546be312..2a723503f4c7 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
@@ -8,7 +8,6 @@ import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 
 import { CurrencyPickerHotkeyScope } from '../types/CurrencyPickerHotkeyScope';
 
-import { CurrencyPickerDropdownSelect } from './CurrencyPickerDropdownSelect';
 
 const StyledDropdownButtonContainer = styled.div`
   align-items: center;
@@ -84,11 +83,13 @@ export const CurrencyPickerDropdownButton = ({
         </StyledDropdownButtonContainer>
       }
       dropdownComponents={
-        <CurrencyPickerDropdownSelect
-          currencies={currencies}
-          selectedCurrency={currency}
-          onChange={handleChange}
-        />
+        <></>
+        // <CurrencyPickerDropdownSelect
+        //   id="currency-picker-dropdown-options"
+        //   currencies={currencies}
+        //   selectedCurrency={currency}
+        //   onChange={handleChange}
+        // />
       }
       dropdownPlacement="bottom-start"
       dropdownOffset={{ x: 0, y: 4 }}
diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownSelect.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownSelect.tsx
index 18891ea4b40b..a3d6866ff829 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownSelect.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownSelect.tsx
@@ -12,10 +12,12 @@ export const CurrencyPickerDropdownSelect = ({
   currencies,
   selectedCurrency,
   onChange,
+  id
 }: {
   currencies: Currency[];
   selectedCurrency?: Currency;
   onChange: (currency: Currency) => void;
+  id?:string
 }) => {
   const [searchFilter, setSearchFilter] = useState<string>('');
 
@@ -32,7 +34,7 @@ export const CurrencyPickerDropdownSelect = ({
   );
 
   return (
-    <DropdownMenu>
+    <DropdownMenu id={id}>
       <DropdownMenuSearchInput
         value={searchFilter}
         onChange={(event) => setSearchFilter(event.target.value)}
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
index f3bf97d0d63c..82540abde566 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
@@ -113,12 +113,14 @@ export const Dropdown = ({
             <div
               ref={refs.setReference}
               onClick={handleClickableComponentClick}
+              aria-controls={dropdownId}
             >
               {clickableComponent}
             </div>
           )}
           {isDropdownOpen && (
             <DropdownContent
+              id={"currency-picker-options"}
               className={className}
               floatingStyles={floatingStyles}
               dropdownMenuWidth={dropdownMenuWidth}
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
index 3c2d2ea0ae0a..0bfe5aad369b 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
@@ -125,6 +125,7 @@ export const DropdownContent = ({
         >
           <OverlayContainer>
             <DropdownMenu
+              id={dropdownId}
               className={className}
               width={dropdownMenuWidth ?? dropdownWidth}
               data-select-disable
@@ -141,6 +142,7 @@ export const DropdownContent = ({
           >
             <OverlayContainer>
               <DropdownMenu
+                id={dropdownId}
                 className={className}
                 width={dropdownMenuWidth ?? dropdownWidth}
                 data-select-disable

From 84ab8ce699d6c791e6b660bad689dd2e246db35c Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 19:53:16 +0100
Subject: [PATCH 04/12] fix

---
 .../components/CurrencyPickerDropdownButton.tsx     | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
index 2a723503f4c7..5f0caa888163 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
@@ -6,6 +6,7 @@ import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 
+import { CurrencyPickerDropdownSelect } from '@/ui/input/components/internal/currency/components/CurrencyPickerDropdownSelect';
 import { CurrencyPickerHotkeyScope } from '../types/CurrencyPickerHotkeyScope';
 
 
@@ -83,13 +84,11 @@ export const CurrencyPickerDropdownButton = ({
         </StyledDropdownButtonContainer>
       }
       dropdownComponents={
-        <></>
-        // <CurrencyPickerDropdownSelect
-        //   id="currency-picker-dropdown-options"
-        //   currencies={currencies}
-        //   selectedCurrency={currency}
-        //   onChange={handleChange}
-        // />
+        <CurrencyPickerDropdownSelect
+          currencies={currencies}
+          selectedCurrency={currency}
+          onChange={handleChange}
+        />
       }
       dropdownPlacement="bottom-start"
       dropdownOffset={{ x: 0, y: 4 }}

From a24ac64e9838654c8ff2f9a741725431c5b731f5 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 20:00:11 +0100
Subject: [PATCH 05/12] cleanup

---
 .../record-table-cell/components/RecordTableCellEditMode.tsx    | 1 -
 .../currency/components/CurrencyPickerDropdownButton.tsx        | 2 +-
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx
index a27340434a22..ecb2a8e283a6 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx
@@ -39,7 +39,6 @@ export const RecordTableCellEditMode = ({
     <StyledEditableCellEditModeContainer
       ref={refs.setReference}
       data-testid="editable-cell-edit-mode-container"
-      role="combobox"
     >
       <OverlayContainer ref={refs.setFloating} style={floatingStyles}>
         {children}
diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
index 5f0caa888163..4161b61816bb 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
@@ -73,7 +73,7 @@ export const CurrencyPickerDropdownButton = ({
 
   return (
     <Dropdown
-      dropdownId="currency-picker-dropdown-id"
+      dropdownId="currency-picker-dropdown"
       dropdownHotkeyScope={{ scope: CurrencyPickerHotkeyScope.CurrencyPicker }}
       clickableComponent={
         <StyledDropdownButtonContainer>

From 7958af613f03d43b6c57aee82bdca5ed9aaaf8b0 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 20:01:29 +0100
Subject: [PATCH 06/12] fix

---
 .../src/modules/ui/layout/dropdown/components/Dropdown.tsx       | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
index 82540abde566..f96e880e1d04 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
@@ -120,7 +120,6 @@ export const Dropdown = ({
           )}
           {isDropdownOpen && (
             <DropdownContent
-              id={"currency-picker-options"}
               className={className}
               floatingStyles={floatingStyles}
               dropdownMenuWidth={dropdownMenuWidth}

From 29cee72f5a78108e164151c505413c6854f602f6 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 20:05:23 +0100
Subject: [PATCH 07/12] cleanup

---
 .../src/modules/ui/layout/dropdown/components/Dropdown.tsx      | 1 +
 .../layout/dropdown/components/DropdownMenuItemsContainer.tsx   | 2 ++
 .../navigation/menu-item/components/MenuItemSelectAvatar.tsx    | 2 ++
 3 files changed, 5 insertions(+)

diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
index f96e880e1d04..3434446f3817 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
@@ -114,6 +114,7 @@ export const Dropdown = ({
               ref={refs.setReference}
               onClick={handleClickableComponentClick}
               aria-controls={dropdownId}
+              aria-expanded={isDropdownOpen}
             >
               {clickableComponent}
             </div>
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
index 679fe4e2f4f5..159d003c202c 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
@@ -51,6 +51,7 @@ export const DropdownMenuItemsContainer = ({
     <StyledDropdownMenuItemsExternalContainer
       hasMaxHeight={hasMaxHeight}
       className={className}
+      role="listbox"
     >
       {hasMaxHeight ? (
         <StyledScrollWrapper
@@ -75,6 +76,7 @@ export const DropdownMenuItemsContainer = ({
       <StyledDropdownMenuItemsExternalContainer
         hasMaxHeight={hasMaxHeight}
         className={className}
+        role="listbox"
       >
         <StyledDropdownMenuItemsInternalContainer>
           {children}
diff --git a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
index 8aceeeadec87..cbc748e1f99f 100644
--- a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelectAvatar.tsx
@@ -41,6 +41,8 @@ export const MenuItemSelectAvatar = ({
       hovered={hovered}
       data-testid={testId}
       role="option"
+      aria-selected={selected}
+      aria-disabled={disabled}
     >
       <StyledMenuItemLeftContent>
         {avatar}

From 55d039a60e87dfcf423b6e5790be4556868976d2 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 20:06:43 +0100
Subject: [PATCH 08/12] fix

---
 .../src/navigation/menu-item/components/MenuItemSelect.tsx       | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx
index 4b9748816a6f..4d8db31cb885 100644
--- a/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx
+++ b/packages/twenty-ui/src/navigation/menu-item/components/MenuItemSelect.tsx
@@ -68,6 +68,7 @@ export const MenuItemSelect = ({
       disabled={disabled}
       hovered={hovered}
       role="option"
+      aria-selected={selected}
     >
       <MenuItemLeftContent LeftIcon={LeftIcon} text={text} />
       {selected && <IconCheck size={theme.icon.size.md} />}

From 691acf429f040f42ed151ec9808e8e46333eb05a Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 20:15:16 +0100
Subject: [PATCH 09/12] new attempt at the dropdown level

---
 .../src/modules/ui/layout/dropdown/components/Dropdown.tsx   | 3 ++-
 .../ui/layout/dropdown/components/DropdownContent.tsx        | 5 ++++-
 .../dropdown/components/DropdownMenuItemsContainer.tsx       | 5 +++--
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
index 3434446f3817..88c5d52fe3a1 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
@@ -113,8 +113,9 @@ export const Dropdown = ({
             <div
               ref={refs.setReference}
               onClick={handleClickableComponentClick}
-              aria-controls={dropdownId}
+              aria-controls={`${dropdownId}-"options"`}
               aria-expanded={isDropdownOpen}
+              role="combobox"
             >
               {clickableComponent}
             </div>
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
index 0bfe5aad369b..d8d5ee6bc931 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
@@ -122,10 +122,11 @@ export const DropdownContent = ({
         <StyledDropdownContentContainer
           ref={floatingUiRefs.setFloating}
           style={dropdownMenuStyles}
+          role="listbox"
+          id={`${dropdownId}-"options"`}
         >
           <OverlayContainer>
             <DropdownMenu
-              id={dropdownId}
               className={className}
               width={dropdownMenuWidth ?? dropdownWidth}
               data-select-disable
@@ -139,6 +140,8 @@ export const DropdownContent = ({
           <StyledDropdownContentContainer
             ref={floatingUiRefs.setFloating}
             style={dropdownMenuStyles}
+            role="listbox"
+            id={`${dropdownId}-"options"`}
           >
             <OverlayContainer>
               <DropdownMenu
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
index 159d003c202c..a4161716c2c9 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
@@ -51,7 +51,8 @@ export const DropdownMenuItemsContainer = ({
     <StyledDropdownMenuItemsExternalContainer
       hasMaxHeight={hasMaxHeight}
       className={className}
-      role="listbox"
+      // role="listbox"
+
     >
       {hasMaxHeight ? (
         <StyledScrollWrapper
@@ -76,7 +77,7 @@ export const DropdownMenuItemsContainer = ({
       <StyledDropdownMenuItemsExternalContainer
         hasMaxHeight={hasMaxHeight}
         className={className}
-        role="listbox"
+        // role="listbox"
       >
         <StyledDropdownMenuItemsInternalContainer>
           {children}

From c4e68023fc7db272863e87d285830ad6b2136936 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Wed, 18 Dec 2024 21:25:49 +0100
Subject: [PATCH 10/12] listbox

---
 .../components/SingleRecordSelectMenuItems.tsx               | 2 +-
 .../currency/components/CurrencyPickerDropdownButton.tsx     | 2 +-
 .../src/modules/ui/layout/dropdown/components/Dropdown.tsx   | 2 +-
 .../ui/layout/dropdown/components/DropdownContent.tsx        | 2 +-
 .../dropdown/components/DropdownMenuItemsContainer.tsx       | 5 ++---
 5 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleRecordSelectMenuItems.tsx b/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleRecordSelectMenuItems.tsx
index c657ba9a96f9..18280e771eb6 100644
--- a/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleRecordSelectMenuItems.tsx
+++ b/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleRecordSelectMenuItems.tsx
@@ -117,7 +117,7 @@ export const SingleRecordSelectMenuItems = ({
           resetSelectedItem();
         }}
       >
-        <DropdownMenuItemsContainer hasMaxHeight>
+        <DropdownMenuItemsContainer hasMaxHeight >
           {loading && !isFiltered ? (
             <DropdownMenuSkeletonItem />
           ) : recordsInDropdown.length === 0 &&
diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
index 4161b61816bb..64e4270fdfea 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
@@ -73,7 +73,7 @@ export const CurrencyPickerDropdownButton = ({
 
   return (
     <Dropdown
-      dropdownId="currency-picker-dropdown"
+      dropdownId={"currency-picker-dropdown-id"}
       dropdownHotkeyScope={{ scope: CurrencyPickerHotkeyScope.CurrencyPicker }}
       clickableComponent={
         <StyledDropdownButtonContainer>
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
index 88c5d52fe3a1..f9b6e2697333 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
@@ -113,7 +113,7 @@ export const Dropdown = ({
             <div
               ref={refs.setReference}
               onClick={handleClickableComponentClick}
-              aria-controls={`${dropdownId}-"options"`}
+              aria-controls={`${dropdownId}-options`}
               aria-expanded={isDropdownOpen}
               role="combobox"
             >
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
index d8d5ee6bc931..436512568b31 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
@@ -141,7 +141,7 @@ export const DropdownContent = ({
             ref={floatingUiRefs.setFloating}
             style={dropdownMenuStyles}
             role="listbox"
-            id={`${dropdownId}-"options"`}
+            id={`${dropdownId}-options`}
           >
             <OverlayContainer>
               <DropdownMenu
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
index a4161716c2c9..159d003c202c 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
@@ -51,8 +51,7 @@ export const DropdownMenuItemsContainer = ({
     <StyledDropdownMenuItemsExternalContainer
       hasMaxHeight={hasMaxHeight}
       className={className}
-      // role="listbox"
-
+      role="listbox"
     >
       {hasMaxHeight ? (
         <StyledScrollWrapper
@@ -77,7 +76,7 @@ export const DropdownMenuItemsContainer = ({
       <StyledDropdownMenuItemsExternalContainer
         hasMaxHeight={hasMaxHeight}
         className={className}
-        // role="listbox"
+        role="listbox"
       >
         <StyledDropdownMenuItemsInternalContainer>
           {children}

From b4dcaaa41ae0e71f7b668bfd5cbf315803be51dc Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Thu, 19 Dec 2024 10:09:03 +0100
Subject: [PATCH 11/12] cleanup

---
 .../components/SingleRecordSelectMenuItems.tsx                | 2 +-
 .../currency/components/CurrencyPickerDropdownButton.tsx      | 4 ++--
 .../modules/ui/layout/dropdown/components/DropdownContent.tsx | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleRecordSelectMenuItems.tsx b/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleRecordSelectMenuItems.tsx
index 18280e771eb6..c657ba9a96f9 100644
--- a/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleRecordSelectMenuItems.tsx
+++ b/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleRecordSelectMenuItems.tsx
@@ -117,7 +117,7 @@ export const SingleRecordSelectMenuItems = ({
           resetSelectedItem();
         }}
       >
-        <DropdownMenuItemsContainer hasMaxHeight >
+        <DropdownMenuItemsContainer hasMaxHeight>
           {loading && !isFiltered ? (
             <DropdownMenuSkeletonItem />
           ) : recordsInDropdown.length === 0 &&
diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
index 64e4270fdfea..f46e546be312 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
@@ -6,9 +6,9 @@ import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 
-import { CurrencyPickerDropdownSelect } from '@/ui/input/components/internal/currency/components/CurrencyPickerDropdownSelect';
 import { CurrencyPickerHotkeyScope } from '../types/CurrencyPickerHotkeyScope';
 
+import { CurrencyPickerDropdownSelect } from './CurrencyPickerDropdownSelect';
 
 const StyledDropdownButtonContainer = styled.div`
   align-items: center;
@@ -73,7 +73,7 @@ export const CurrencyPickerDropdownButton = ({
 
   return (
     <Dropdown
-      dropdownId={"currency-picker-dropdown-id"}
+      dropdownId="currency-picker-dropdown-id"
       dropdownHotkeyScope={{ scope: CurrencyPickerHotkeyScope.CurrencyPicker }}
       clickableComponent={
         <StyledDropdownButtonContainer>
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
index 436512568b31..acbae17556e2 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownContent.tsx
@@ -123,7 +123,7 @@ export const DropdownContent = ({
           ref={floatingUiRefs.setFloating}
           style={dropdownMenuStyles}
           role="listbox"
-          id={`${dropdownId}-"options"`}
+          id={`${dropdownId}-options`}
         >
           <OverlayContainer>
             <DropdownMenu

From c66a3dababe1e57c46c50d7d3200066e595d56a2 Mon Sep 17 00:00:00 2001
From: Your Name <malo.marrec@gmail.com>
Date: Thu, 19 Dec 2024 10:10:05 +0100
Subject: [PATCH 12/12] feedback

---
 .../src/modules/ui/layout/dropdown/components/Dropdown.tsx     | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
index f9b6e2697333..36e386f4691e 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
@@ -115,7 +115,8 @@ export const Dropdown = ({
               onClick={handleClickableComponentClick}
               aria-controls={`${dropdownId}-options`}
               aria-expanded={isDropdownOpen}
-              role="combobox"
+              aria-haspopup={true}
+              role="button"
             >
               {clickableComponent}
             </div>