twentyhq/twenty
1
1
Fork 0
mirror of https://github.com/twentyhq/twenty.git synced 2024-12-24 20:42:05 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix: zero showing in record cell and page (#7384)

Browse Source 
This PR fixes zero being displayed as empty in record cell and show page
in currency field #6802
I checked graphql resquests and the data is stored in the correct form
(0 or null). The problem only lies in the front end and how the field is
null checked.

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
This commit is contained in:
Ngan Phan 2024-10-03 02:41:50 -07:00 committed by GitHub
parent b8e406c13a
commit da69317837
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/CurrencyFieldInput.tsx
View File

@ -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,
});
};

5
packages/twenty-front/src/modules/object-record/record-field/utils/computeDraftValueFromFieldValue.ts
View File

@ -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<FieldValue> = {
fieldDefinition: Pick<FieldDefinition<FieldMetadata>, 'type'>;
@ -32,7 +33,9 @@ export const computeDraftValueFromFieldValue = <FieldValue>({
}
return {
amount: fieldValue?.amountMicros ? fieldValue.amountMicros / 1000000 : '',
amount: isUndefinedOrNull(fieldValue?.amountMicros)
? ''
: (fieldValue.amountMicros / 1000000).toString(),
currencyCode: fieldValue?.currencyCode ?? '',
} as unknown as FieldInputDraftValue<FieldValue>;
}

7
packages/twenty-front/src/modules/ui/field/display/components/CurrencyDisplay.tsx
View File

@ -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 <StyledEllipsisDisplay>{0}</StyledEllipsisDisplay>;
@ -46,7 +49,7 @@ export const CurrencyDisplay = ({ currencyValue }: CurrencyDisplayProps) => {
/>{' '}
</>
)}
{amountToDisplay !== 0 ? formatAmount(amountToDisplay) : ''}
{amountToDisplay !== null ? formatAmount(amountToDisplay) : ''}
</StyledEllipsisDisplay>
);
};

5
packages/twenty-front/src/modules/ui/field/input/components/CurrencyInput.tsx
View File

@ -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"