SelectArrayInput component required validation not working

[santhosh1190]

What you were expecting:

1. I have two fields name called 'Name', 'City'. Here both fields are mandatory.
2. Name is String & City is Array where I could choose multiple value.
3. Name field used the 'TextInput' & City field used the 'SelectArrayInput' to choose multiple value.
4. If I lose mouse focus on either field with nothing entered in fields, it should display error message like 'This field is required'.

What happened instead:

1. When I lose focus from 'Name' field, it's displays error message.
2. But I lose focus from 'City' fields without choose any value, It does not display any error message.

Related code:

const validateUserCreation = (values) => {
    const errors = {};
    if (!values.firstName) {
        errors.firstName = ['The firstName is required'];
    }
    if (!values.cities) {
        errors.cities= ['The city is required'];
    }
    return errors
};

export const UserCreate = (props) => (
    <Create {...props}>
        <SimpleForm validate={validateUserCreation}>
            <TextInput label="First Name" source="firstName" />
            <SelectArrayInput label="City" source="cities" choices={[
    { id: 'us', name: 'US' },
    { id: 'canada', name: 'Canada' }
]} />
        </SimpleForm>
    </Create>
);

Environment

• admin-on-rest - 1.3.3 version