How can I make the materialUI drawer scroll to bottom after a refresh? in React

I have a Material UI Drawer with lots of checkboxes and radio buttons for an advanced search page. Each and every checkbox or radio click mutates the API get request for a “on-the-fly” results without the need to click a submit button. My problem is that every time this happens, because there is a refresh happening, the drawer resets back top the top.

I have all of my radio buttons at at the bottom so if I could at least force those click events for the radio buttons to scroll my drawer to the bottom, that would make it look like it preserved the scroll position.

function scrollToBottom() {
    let height = document.getElementById('customAdvancedDrawer').clientHeight;
    
    const drawerEl = document.getElementById('customAdvancedDrawer').getScrollElement();
      
    drawerEl.scrollTop = height; //Is there such a thing as .scrollBottom?
}

I tried the function above but it doesn’t work and I’m getting an error Cannot read properties of undefined (reading 'getScrollElement'). I’m assuming that the drawer is not mounted when this fires?

I’m calling the function in the onChange event

<CustomRadioGroup 
    className="preventJumpToTop"
    radiodata={selectors.regions} 
    radiovalues={state.region} 
    defaultValue={state.region} 
    handleOnRadioChange={(value) =>  {
       setState({ ...state, region: value }); 
       scrollToBottom()
    }} 
    radiolabel="Region" />