Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | 4x 4x | import React, { FC } from 'react';
import { useTranslation } from 'react-i18next';
import { Modal } from '../../Modal';
const styles = require('./Modal.module.css')
import { Loading } from 'ag-ems-ui-library';
import { ContactForm } from '../../Checkout';
import { CustomerAddress } from '../../../contexts';
export const AddressModal: FC<{
isOpen: boolean;
onClose: () => void;
address: CustomerAddress;
onSubmit?: (address: CustomerAddress) => void;
errorMessage?: string;
preloader?: boolean;
countries: any[];
}> = ({
isOpen = false,
onClose,
address,
onSubmit,
errorMessage,
preloader,
countries
}) => {
const { t } = useTranslation();
const handlers = {
...address?.id ? { onChange: onSubmit } : { onAdd: onSubmit }
};
return (
<Modal
isOpen={isOpen}
onClose={onClose}
header={<h2
className={styles.ModalHeader}>{address?.id ? t('checkout.editAddress') : t('checkout.addNewAddress')}</h2>}
size='wide'
>
<div className={styles.ModalContent}>
{preloader && <Loading color="#007c00" />}
<ContactForm
classes={styles.ModalForm}
address={address}
countries={countries}
{...handlers}
errorMessage={errorMessage}
/>
</div>
</Modal>
);
};
|