Added CurrencyFieldInput design (#4254)

* #4123 CurrencyFieldInput design is ready

* resolved comment and currency code

* resolved design comment

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Jeet Desai
2024-03-09 02:00:45 +05:30
committed by GitHub
parent 0c17decfb9
commit 40a3b7d849
7 changed files with 348 additions and 6 deletions

View File

@ -1,5 +1,5 @@
import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
import { TextInput } from '@/ui/field/input/components/TextInput';
import { CurrencyInput } from '@/ui/field/input/components/CurrencyInput';
import { FieldInputOverlay } from '../../../../../ui/field/input/components/FieldInputOverlay';
import { useCurrencyField } from '../../hooks/useCurrencyField';
@ -79,10 +79,18 @@ export const CurrencyFieldInput = ({
});
};
const handleSelect = (newValue: string) => {
setDraftValue({
amount: draftValue?.amount ?? '',
currencyCode: newValue as CurrencyCode,
});
};
return (
<FieldInputOverlay>
<TextInput
<CurrencyInput
value={draftValue?.amount?.toString() ?? ''}
currencyCode={draftValue?.currencyCode ?? CurrencyCode.USD}
autoFocus
placeholder="Currency"
onClickOutside={handleClickOutside}
@ -90,8 +98,9 @@ export const CurrencyFieldInput = ({
onEscape={handleEscape}
onShiftTab={handleShiftTab}
onTab={handleTab}
hotkeyScope={hotkeyScope}
onChange={handleChange}
onSelect={handleSelect}
hotkeyScope={hotkeyScope}
/>
</FieldInputOverlay>
);

View File

@ -1,4 +1,3 @@
import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
import { FieldDefinition } from '@/object-record/record-field/types/FieldDefinition';
import { FieldInputDraftValue } from '@/object-record/record-field/types/FieldInputDraftValue';
import { FieldMetadata } from '@/object-record/record-field/types/FieldMetadata';
@ -31,7 +30,7 @@ export const computeDraftValueFromFieldValue = <FieldValue>({
return {
amount: fieldValue?.amountMicros ? fieldValue.amountMicros / 1000000 : '',
currenyCode: CurrencyCode.USD,
currencyCode: fieldValue?.currencyCode ?? '',
} as unknown as FieldInputDraftValue<FieldValue>;
}
if (isFieldRelation(fieldDefinition)) {