The thing is that I have some profiles with some lease that I want to duplicate, so I need in first time charge all profiles and then I need to select a lease to get its name and use it.
When I load the section I can do that I want, but when I try to change the profile, after having previously selected one, still remains the lease that belongs to the first profile.
here is my code:
const Form = ({ errors, onLeaseProfileSearch, organization, setFieldError, setFieldValue, values: lease }) => {
const handleFieldChange = fieldName => value => {
setFieldValue(fieldName, value);
setFieldError(fieldName, null);
};
const onLeaseSearch = nameCont => {
const response = LeaseRepository.index(LeaseProfilePresenter.id(lease.profile), {
q: { nameCont, profileIdEq: LeaseProfilePresenter.id(organization) },
s: ['name DESC'],
})
.then(extractResponseData)
.then(prop('leases'));
return response;
};
return (
<div className={classes.root}>
<Field error={errors.profile} title="Profile">
<AsyncSelect
cacheOptions
className={classes.select}
defaultOptions
getOptionLabel={LeaseProfilePresenter.displayName}
getOptionValue={LeaseProfilePresenter.id}
height={32}
loadOptions={onLeaseProfileSearch}
onChange={handleFieldChange('profile')}
searchable
theme="bright"
value={lease.profile}
/>
</Field>
{lease.profile && (
<Field error={errors.sourceLease} title="Lease to Duplicate">
<AsyncSelect
key={lease.profile}
className={classes.select}
defaultOptions
getOptionLabel={LeaseProfilePresenter.name}
getOptionValue={LeaseProfilePresenter.id}
height={32}
loadOptions={onLeaseSearch}
onChange={value => {
handleFieldChange('sourceLease')(value);
handleFieldChange('name')(`${value.name} Copy`);
}}
searchable
theme="bright"
value={lease.sourceLease}
/>
</Field>
)}
{lease.sourceLease && (
<Field error={errors.name} title="Lease Name">
<Input name="name" onChange={handleFieldChange('name')} value={lease.name} />
</Field>
)}
</div>
);
};
Form.propTypes = {
errors: PropTypes.shape().isRequired,
onLeaseProfileSearch: PropTypes.func.isRequired,
organization: OrganizationPresenter.shape().isRequired,
setFieldError: PropTypes.func.isRequired,
setFieldValue: PropTypes.func.isRequired,
values: LeasePresenter.shape().isRequired,
};
export default Form;