I have a problem that after fetching my categories and business entity my autocomplete don't match value preview for Material Autocomplete. I am using react hook forms and in Autoselect I am trying to save only id instead of the whole object. How can I customize isOptionEqualToValue to show preview that my id ("ect345-8") equals to one of the option {id: "ect345-8", title: "main"}
<Controller
control={control}
name="category_id"
render={({ field: { ref, onChange } }: any) => (
<Autocomplete
options={categories}
isOptionEqualToValue={(option: any, value: any) =>
option.id === value.id
}
onChange={(_, data: any) => onChange(data.id)}
getOptionLabel={(option) => `${option.title}`}
renderInput={(params) => (
<TextField
{...params}
placeholder="Choose category"
inputRef={ref}
variant="outlined"
name="category_id"
/>
)}
/>
)}
/>