react-awesome-query-builder empty select when click outside select - reactjs

Question

I use asyncFetch and I select value from SelectWiget , after any click outside make empty value this select.
I use next config for fields
products: {
type: '!struct',
label: 'Products',
subfields: {
title: {
type: 'select',
label: 'Name',
fieldSettings: {
asyncFetch: async (search, offset) => {
const toSearch = _.isEmpty(search) ? 'null' : search;
const prodApi = (await axios.get(`http://localhost:8002/api/products/1/${toSearch}?offset=${offset}`, { headers: authHeader() }));
const productsValues = prodApi.data.data.map(
product => ({
title: product.title,
value: product.id
})
)
return {
values: productsValues,
hasMore: true,
}
},
useAsyncSearch: true,
useLoadMore: true,
forceAsyncSearch: false,
allowCustomValues: false
}
},
Another error is when i select some value the asyncFetch is call again.
Is this a bug in that package or i have missing some configuration ?
the package what i use is react-awesome-query-builder

Answer 1

the value from result of function async need to be string, so function is like :
asyncFetch: async (search, offset) => {
const toSearch = _.isEmpty(search) ? 'null' : search;
const prodApi = (await axios.get(`http://localhost:8002/api/products/1/${toSearch}?offset=${offset}`, { headers: authHeader() }));
const productsValues = prodApi.data.data.map(
product => ({
title: product.title,
value: product.id.toString(),
})
)
return {
values: productsValues,
hasMore: true,
}
}