From 77ee016d6fb370a69f2ef18b076ea91c347c9e6e Mon Sep 17 00:00:00 2001 From: Weiko Date: Fri, 21 Mar 2025 13:56:03 +0100 Subject: [PATCH] Fix currency update (#11088) ## Context Currency picker was not working properly, clicking a value was triggering the clickOutsideListener of the parent and was closing the select without saving. We are now toggling the click outside listener based on the state of the currency picker dropdown This also means the UX changed a bit, now choosing a value or clicking outside only closes the select (allowing you to choose the amount as well) and only enter OR clicking outside will save --- .../currency/components/CurrencyPickerDropdownButton.tsx | 8 ++++++++ 1 file changed, 8 insertions(+) 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 feaa9d417..4bbf2766d 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,6 +8,8 @@ import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import { CurrencyPickerHotkeyScope } from '../types/CurrencyPickerHotkeyScope'; +import { TableHotkeyScope } from '@/object-record/record-table/types/TableHotkeyScope'; +import { useClickOutsideListener } from '@/ui/utilities/pointer-event/hooks/useClickOutsideListener'; import { CurrencyPickerDropdownSelect } from './CurrencyPickerDropdownSelect'; const StyledDropdownButtonContainer = styled.div` @@ -67,6 +69,10 @@ export const CurrencyPickerDropdownButton = ({ closeDropdown(); }; + const { toggleClickOutsideListener } = useClickOutsideListener( + TableHotkeyScope.CellEditMode, + ); + const currency = currencies.find(({ value }) => value === valueCode); const currencyCode = currency?.value ?? CurrencyCode.USD; @@ -92,6 +98,8 @@ export const CurrencyPickerDropdownButton = ({ } dropdownPlacement="bottom-start" dropdownOffset={{ x: 0, y: 4 }} + onOpen={() => toggleClickOutsideListener(false)} + onClose={() => toggleClickOutsideListener(true)} /> ); };