Issue with fetching value options in MUI DataGrid's valueOptions function

Question

I'm encountering an issue while trying to fetch value options for a singleSelect column in the MUI DataGrid. Even though I'm seeing the network response passing back the expected data (an array of string), the valueOptions function is not populating the value options as expected in the DataGrid. Instead the grid errors out with a

useGridLoggerFactory.js:26 MUI: GridErrorHandler - An unexpected error occurred. Error: valueOptions is not a function or its return value is not iterable.  TypeError: valueOptions is not a function or its return value is not iterable
    at renderSingleSelectOptions (GridFilterInputSingleSelect.js:17:1)
    at GridFilterInputSingleSelect 

Here's my column configuration:

{
  field: 'info.status',
  headerName: 'Status',
  flex: 1,
  valueGetter: (params) => {
    return params?.row?.info?.statusLabel;
  },
  type: 'singleSelect',
  valueOptions: async () => {
    const valueOptions = await doFetch(getURL(config.api['fetchStatusOptionsURL']), context);
    return valueOptions || [];
  },
}

What I've tried:

1. The doFetch function is correctly defined and working as expected, I can see my array being returned in the Network tab and see no issues in my server
2. The DataGrid configuration seems correct, and there are no apparent conflicts or missing parameters.

Questions:

• What could be causing the issue in this scenario?
• Are there any common pitfalls to look out for when using the valueOptions function in MUI DataGrid?
• Is there something I might be overlooking that's preventing the value options from populating correctly?
• Are there any specific DataGrid lifecycle considerations that might impact the behavior of the valueOptions function?

Any insights or guidance would be greatly appreciated. Thank you in advance!