[Discover] Allow sorting only for visible columns (#172077)

- Closes https://github.com/elastic/kibana/issues/172023

## Summary

As
[eui](8eb7277ffd/src/components/datagrid/controls/column_sorting.tsx (L44-L57))
triggers `onSort` for `EuiDataGrid` when `sort` array includes fields
which are not present in `columns` array, it changes the app state. This
results in "unsaved changes" badge although user can't know why.

This PR makes sure that state is not modified when unknown sorting
fields are persisted inside a saved search and user opens such search.

To reproduce the mentioned issue:
- Add columns to the table and define their sorting
- Save the search
- Reopen the search and remove one of the columns which had custom
sorting
- Save the search
- Now open Discover again and reopen the search.

With this PR, "unsaved changes" badge would not appear. 

### Checklist

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

packages/kbn-unified-data-table/src/components/data_table.test.tsx

@@ -300,6 +300,54 @@ describe('UnifiedDataTable', () => {
         }
       `);
     });
+
+    it('should apply sorting', async () => {
+      const component = await getComponent({
+        ...getProps(),
+        sort: [['message', 'desc']],
+        columns: ['message'],
+      });
+
+      expect(component.find(EuiDataGrid).prop('sorting')).toMatchInlineSnapshot(`
+        Object {
+          "columns": Array [
+            Object {
+              "direction": "desc",
+              "id": "message",
+            },
+          ],
+          "onSort": [Function],
+        }
+      `);
+    });
+
+    it('should not apply unknown sorting', async () => {
+      const component = await getComponent({
+        ...getProps(),
+        sort: [
+          ['bytes', 'desc'],
+          ['unknown', 'asc'],
+          ['message', 'desc'],
+        ],
+        columns: ['bytes', 'message'],
+      });
+
+      expect(component.find(EuiDataGrid).prop('sorting')).toMatchInlineSnapshot(`
+        Object {
+          "columns": Array [
+            Object {
+              "direction": "desc",
+              "id": "bytes",
+            },
+            Object {
+              "direction": "desc",
+              "id": "message",
+            },
+          ],
+          "onSort": [Function],
+        }
+      `);
+    });
   });
 
   describe('display settings', () => {

packages/kbn-unified-data-table/src/components/data_table.tsx

@@ -538,25 +538,6 @@ export const UnifiedDataTable = ({
     );
   }, [currentPageSize, setPagination]);
 
-  /**
-   * Sorting
-   */
-  const sortingColumns = useMemo(() => sort.map(([id, direction]) => ({ id, direction })), [sort]);
-
-  const [inmemorySortingColumns, setInmemorySortingColumns] = useState([]);
-  const onTableSort = useCallback(
-    (sortingColumnsData) => {
-      if (isSortEnabled) {
-        if (isPlainRecord) {
-          setInmemorySortingColumns(sortingColumnsData);
-        } else if (onSort) {
-          onSort(sortingColumnsData.map(({ id, direction }: SortObj) => [id, direction]));
-        }
-      }
-    },
-    [onSort, isSortEnabled, isPlainRecord, setInmemorySortingColumns]
-  );
-
   const shouldShowFieldHandler = useMemo(() => {
     const dataViewFields = dataView.fields.getAll().map((fld) => fld.name);
     return getShouldShowFieldHandler(dataViewFields, dataView, showMultiFields);
@@ -720,6 +701,32 @@ export const UnifiedDataTable = ({
     }),
     [visibleColumns, hideTimeColumn, onSetColumns]
   );
+
+  /**
+   * Sorting
+   */
+  const sortingColumns = useMemo(
+    () =>
+      sort
+        .map(([id, direction]) => ({ id, direction }))
+        .filter(({ id }) => visibleColumns.includes(id)),
+    [sort, visibleColumns]
+  );
+
+  const [inmemorySortingColumns, setInmemorySortingColumns] = useState([]);
+  const onTableSort = useCallback(
+    (sortingColumnsData) => {
+      if (isSortEnabled) {
+        if (isPlainRecord) {
+          setInmemorySortingColumns(sortingColumnsData);
+        } else if (onSort) {
+          onSort(sortingColumnsData.map(({ id, direction }: SortObj) => [id, direction]));
+        }
+      }
+    },
+    [onSort, isSortEnabled, isPlainRecord, setInmemorySortingColumns]
+  );
+
   const sorting = useMemo(() => {
     if (isSortEnabled) {
       return {