fix: simplify logic for hiding/showing all columns within show/hide menu

The functionality to show/hide all columns within the ShowHideColumnsMenu was implemented with a custom function which filters all columns and toggles the visibility of each column. This calls the `onColumnVisibilityChange` callback multiple times.

In my opinion this can be refactored to use the tables `toggleAllColumnsVisible` API, which results in only one call of `onColumnVisibilityChange` and makes the code easier to understand.

Fixes: #1277

packages/material-react-table/src/components/menus/MRT_ShowHideColumnsMenu.tsx

@@ -27,7 +27,6 @@ export const MRT_ShowHideColumnsMenu = <TData extends MRT_RowData>({
 }: MRT_ShowHideColumnsMenuProps<TData>) => {
   const {
     getAllColumns,
-    getAllLeafColumns,
     getCenterLeafColumns,
     getIsAllColumnsVisible,
     getIsSomeColumnsPinned,
@@ -45,12 +44,6 @@ export const MRT_ShowHideColumnsMenu = <TData extends MRT_RowData>({
   } = table;
   const { columnOrder, columnPinning, density } = getState();
 
-  const handleToggleAllColumns = (value?: boolean) => {
-    getAllLeafColumns()
-      .filter((col) => col.columnDef.enableHiding !== false)
-      .forEach((col) => col.toggleVisibility(value));
-  };
-
   const allColumns = useMemo(() => {
     const columns = getAllColumns();
     if (
@@ -108,7 +101,7 @@ export const MRT_ShowHideColumnsMenu = <TData extends MRT_RowData>({
         {enableHiding && (
           <Button
             disabled={!getIsSomeColumnsVisible()}
-            onClick={() => handleToggleAllColumns(false)}
+            onClick={() => table.toggleAllColumnsVisible(false)}
           >
             {localization.hideAll}
           </Button>
@@ -135,7 +128,7 @@ export const MRT_ShowHideColumnsMenu = <TData extends MRT_RowData>({
         {enableHiding && (
           <Button
             disabled={getIsAllColumnsVisible()}
-            onClick={() => handleToggleAllColumns(true)}
+            onClick={() => table.toggleAllColumnsVisible(true)}
           >
             {localization.showAll}
           </Button>