fix(dedicated-servers): fix column visibility when filtering

ref: #MANAGER-18957

Signed-off-by: Nicolas Pierre-charles <[email protected]>

Author: Nicolas Pierre-charles

packages/manager/apps/dedicated-servers/src/pages/listing/server/index.tsx

@@ -16,18 +16,19 @@ import { urls } from '@/routes/routes.constant';
 import { ErrorComponent } from '@/components/errorComponent';
 
 export default function ServerListing() {
-  const columns = useColumns();
-  const [visibleColumns] = useState([
-    'name',
+  const [columnVisibility, setColumnVisibility] = useState([
+    'iam.displayName',
     'ip',
-    'model',
+    'commercialRange',
     'region',
-    'status',
-    'actions',
+    'state',
     'tags',
+    'actions',
   ]);
+  const columns = useColumns();
+
   const { sorting, setSorting } = useDataGrid({
-    id: 'displayName',
+    id: 'iam_displayName',
     desc: false,
   });
   const {
@@ -58,7 +59,7 @@ export default function ServerListing() {
         return (s1.iam?.displayName).localeCompare(s2.iam?.displayName);
       }
       if (key && Object.keys(s1).includes(key as string)) {
-        return (s1[key].toString() || '').localeCompare(s2[key].toString());
+        return (s1[key]?.toString() || '').localeCompare(s2[key]?.toString());
       }
       return 0;
     });
@@ -93,7 +94,8 @@ export default function ServerListing() {
                   onSortChange={setSorting}
                   isLoading={isLoading}
                   filters={filters}
-                  columnVisibility={visibleColumns}
+                  columnVisibility={columnVisibility}
+                  setColumnVisibility={setColumnVisibility}
                   search={search}
                   className="server-data-grid"
                   topbar={<OrderMenu />}