States are not updating in customBodyRender

[rishabhsharma1997]

const [catalogClass, setCatalogClass] = useState({});
customBodyRender: (_, tableMeta) => {
// updateValue("here");
const value = catalogClass[tableMeta.rowData[1]];
console.log("here", value, _, tableMeta);
return (
<>
<Select
labelId="=catalog-class-label"
id={catalog-class-select-${tableMeta.rowData[1]}}
// disabled={disabled}
value={value}
defaultValue={value}
onClick={e => {
e.stopPropagation();
e.preventDefault();
}}
onChange={e => handleChange(e, tableMeta)}
disableUnderline
MenuProps={{
anchorOrigin: {
vertical: "bottom",
horizontal: "left"
},
transformOrigin: {
vertical: "top",
horizontal: "left"
},
getContentAnchorEl: null,
MenuListProps: { disablePadding: true },
PaperProps: { square: true }
}}
>
{catalogClassesData &&
catalogClassesData.map(value => {
const formattedContenClass = formatToTitleCase(value);
return (

{formattedContenClass}

);
})}

</>
);
}
The state inside catalogClass is {} even the state change outside