diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/CurrencyFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/CurrencyFieldInput.tsx index 811c96987..89a4e054e 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/CurrencyFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/CurrencyFieldInput.tsx @@ -7,6 +7,7 @@ import { CurrencyInput } from '@/ui/field/input/components/CurrencyInput'; import { FieldInputOverlay } from '../../../../../ui/field/input/components/FieldInputOverlay'; import { useCurrencyField } from '../../hooks/useCurrencyField'; +import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull'; import { FieldInputEvent } from './DateTimeFieldInput'; type CurrencyFieldInputProps = { @@ -108,7 +109,7 @@ export const CurrencyFieldInput = ({ const handleSelect = (newValue: string) => { setDraftValue({ - amount: draftValue?.amount ?? '', + amount: isUndefinedOrNull(draftValue?.amount) ? '' : draftValue?.amount, currencyCode: newValue as CurrencyCode, }); }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/utils/computeDraftValueFromFieldValue.ts b/packages/twenty-front/src/modules/object-record/record-field/utils/computeDraftValueFromFieldValue.ts index 725ca65cc..298ef3c9a 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/utils/computeDraftValueFromFieldValue.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/utils/computeDraftValueFromFieldValue.ts @@ -9,6 +9,7 @@ import { isFieldRelation } from '@/object-record/record-field/types/guards/isFie import { computeEmptyDraftValue } from '@/object-record/record-field/utils/computeEmptyDraftValue'; import { isFieldValueEmpty } from '@/object-record/record-field/utils/isFieldValueEmpty'; import { isDefined } from '~/utils/isDefined'; +import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull'; type computeDraftValueFromFieldValueParams = { fieldDefinition: Pick, 'type'>; @@ -32,7 +33,9 @@ export const computeDraftValueFromFieldValue = ({ } return { - amount: fieldValue?.amountMicros ? fieldValue.amountMicros / 1000000 : '', + amount: isUndefinedOrNull(fieldValue?.amountMicros) + ? '' + : (fieldValue.amountMicros / 1000000).toString(), currencyCode: fieldValue?.currencyCode ?? '', } as unknown as FieldInputDraftValue; } diff --git a/packages/twenty-front/src/modules/ui/field/display/components/CurrencyDisplay.tsx b/packages/twenty-front/src/modules/ui/field/display/components/CurrencyDisplay.tsx index 55f641ca4..3fbb5960f 100644 --- a/packages/twenty-front/src/modules/ui/field/display/components/CurrencyDisplay.tsx +++ b/packages/twenty-front/src/modules/ui/field/display/components/CurrencyDisplay.tsx @@ -29,7 +29,10 @@ export const CurrencyDisplay = ({ currencyValue }: CurrencyDisplayProps) => { ? SETTINGS_FIELD_CURRENCY_CODES[currencyValue?.currencyCode]?.Icon : null; - const amountToDisplay = (currencyValue?.amountMicros ?? 0) / 1000000; + const amountToDisplay = + currencyValue?.amountMicros != null + ? currencyValue?.amountMicros / 1000000 + : null; if (!shouldDisplayCurrency) { return {0}; @@ -46,7 +49,7 @@ export const CurrencyDisplay = ({ currencyValue }: CurrencyDisplayProps) => { />{' '} )} - {amountToDisplay !== 0 ? formatAmount(amountToDisplay) : ''} + {amountToDisplay !== null ? formatAmount(amountToDisplay) : ''} ); }; diff --git a/packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx index ced18f9c5..a25fe10ca 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx @@ -1,7 +1,7 @@ -import { useEffect, useMemo, useRef, useState } from 'react'; -import { IMaskInput, IMaskInputProps } from 'react-imask'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; +import { useEffect, useMemo, useRef, useState } from 'react'; +import { IMaskInput, IMaskInputProps } from 'react-imask'; import { IconComponent, TEXT_INPUT_STYLE } from 'twenty-ui'; import { useRegisterInputEvents } from '@/object-record/record-field/meta-types/input/hooks/useRegisterInputEvents'; @@ -138,7 +138,6 @@ export const CurrencyInput = ({ mask={Number} thousandsSeparator={','} radix="." - unmask="typed" onAccept={(value: string) => handleChange(value)} inputRef={wrapperRef} autoComplete="off"