Hide property doesn't seem to work on Data Grid columns

[DataTraveler1]

Steps to Reproduce

When the Hide property is specified for a column in a Data Grid, it doesn't seem to be honored. It seems that Hide is acting like Hideable.

This issue was internally reported 🍮

The below code will demonstrate the issue.

New-UDDashboard -Title 'Issue1713' -Content {
    New-UDDataGrid -id 'datagrid_id' -LoadRows {
        $Data = @(
            @{ Name = 'Larry'; Number = 1; Widget = 'A'}
            @{ Name = 'Moe'; Number = 2; Widget = 'B'}
            @{ Name = 'Jack'; Number = 3; Widget = 'C'}
        )
        @{
            rows = $Data 
            rowCount = $Data.Length
        } 
    } -Columns @(
        @{ field = "name"}
        @{ field = "number"}
        @{ field = "widget"; hide = $true}
    ) -AutoHeight
}

Expected behavior

A column with the Hide property specified as true should be hidden

Actual behavior

A column with the Hide property specified as true can be hidden with 1 click

Environment data

PSU 3.5.2

Visuals

below figure shows that the Hide property seems to function as Hideable

[adamdriscoll]

Looks like that property is deprecated so we should implement the new way of doing it.

https://mui.com/x/react-data-grid/column-visibility/#column-hide-property-deprecated

This is the new way to do it.

https://mui.com/x/react-data-grid/column-visibility/#controlled-visible-columns