SO Management: revert incorrect sorting on tags column (elastic#139999

)

* SO Management: revert incorrect sorting on `tags` column

* remove incorrect comment

(cherry picked from commit 5c9a11a)

src/plugins/saved_objects_management/public/management_section/objects_table/components/table.tsx

@@ -277,7 +277,7 @@ export class Table extends PureComponent<TableProps, TableState> {
           );
         },
       } as EuiTableFieldDataColumnType<SavedObjectWithMetadata<any>>,
-      ...(taggingApi ? [taggingApi.ui.getTableColumnDefinition()] : []),
+      ...(taggingApi ? [taggingApi.ui.getTableColumnDefinition({ serverPaging: true })] : []),
       ...columnRegistry.getAll().map((column) => {
         column.setColumnContext({ capabilities });
         column.registerOnFinishCallback(() => {

src/plugins/saved_objects_tagging_oss/public/api.ts

@@ -102,7 +102,9 @@ export interface SavedObjectsTaggingApiUi {
    * )
    * ```
    */
-  getTableColumnDefinition(): EuiTableFieldDataColumnType<SavedObject>;
+  getTableColumnDefinition(
+    options?: GetTableColumnDefinitionOptions
+  ): EuiTableFieldDataColumnType<SavedObject>;
 
   /**
    * Convert given tag name to a {@link SavedObjectsFindOptionsReference | reference }
@@ -251,6 +253,28 @@ export interface SavedObjectSaveModalTagSelectorComponentProps {
   onTagsSelected: (ids: string[]) => void;
 }
 
+/**
+ * Options for the {@link SavedObjectsTaggingApiUi.getTableColumnDefinition | getTableColumnDefinition api}
+ *
+ * @public
+ */
+export interface GetTableColumnDefinitionOptions {
+  /**
+   * By default, the `tags` column definition will be automatically sortable
+   * by tag name.
+   *
+   * However, when paging is performed on the server, we need to remove the sorting
+   * capability from the column to avoid unexpected behavior by triggering fetch request
+   * when sorting by column.
+   *
+   * Should be set to `true` when generating the definition for a table that performs
+   * server-side paging.
+   *
+   * Defaults to false.
+   */
+  serverPaging?: boolean;
+}
+
 /**
  * Options for the {@link SavedObjectsTaggingApiUi.getSearchBarFilter | getSearchBarFilter api}
  *

src/plugins/saved_objects_tagging_oss/public/index.ts

@@ -23,6 +23,7 @@ export type {
   ParseSearchQueryOptions,
   SavedObjectSaveModalTagSelectorComponentProps,
   SavedObjectTagDecoratorTypeGuard,
+  GetTableColumnDefinitionOptions,
 } from './api';
 
 export type { TagDecoratedSavedObject } from './decorator';

x-pack/plugins/saved_objects_tagging/public/ui_api/get_table_column_definition.test.ts

@@ -59,4 +59,10 @@ describe('getTableColumnDefinition', () => {
     // we know this returns a function even if the generic column signature allows other types
     expect((sortable as Function)(savedObject)).toEqual('Tag 1');
   });
+
+  it('returns a non-sortable definition when `serverPaging` is `true`', () => {
+    const { sortable } = getTableColumnDefinition({ serverPaging: true });
+
+    expect(sortable).toEqual(false);
+  });
 });

x-pack/plugins/saved_objects_tagging/public/ui_api/get_table_column_definition.tsx

@@ -11,20 +11,21 @@ import { SavedObject, SavedObjectReference } from '@kbn/core/public';
 import {
   SavedObjectsTaggingApiUi,
   SavedObjectsTaggingApiUiComponent,
+  GetTableColumnDefinitionOptions,
 } from '@kbn/saved-objects-tagging-oss-plugin/public';
 import { ITagsCache } from '../services';
 import { getTagsFromReferences, byNameTagSorter } from '../utils';
 
-export interface GetTableColumnDefinitionOptions {
+export interface BuildGetTableColumnDefinitionOptions {
   components: SavedObjectsTaggingApiUiComponent;
   cache: ITagsCache;
 }
 
 export const buildGetTableColumnDefinition = ({
   components,
   cache,
-}: GetTableColumnDefinitionOptions): SavedObjectsTaggingApiUi['getTableColumnDefinition'] => {
-  return () => {
+}: BuildGetTableColumnDefinitionOptions): SavedObjectsTaggingApiUi['getTableColumnDefinition'] => {
+  return ({ serverPaging = false }: GetTableColumnDefinitionOptions = {}) => {
     return {
       field: 'references',
       name: i18n.translate('xpack.savedObjectsTagging.uiApi.table.columnTagsName', {
@@ -33,11 +34,13 @@ export const buildGetTableColumnDefinition = ({
       description: i18n.translate('xpack.savedObjectsTagging.uiApi.table.columnTagsDescription', {
         defaultMessage: 'Tags associated with this saved object',
       }),
-      sortable: (object: SavedObject) => {
-        const { tags } = getTagsFromReferences(object.references, cache.getState());
-        tags.sort(byNameTagSorter);
-        return tags.length ? tags[0].name : undefined;
-      },
+      sortable: serverPaging
+        ? false
+        : (object: SavedObject) => {
+            const { tags } = getTagsFromReferences(object.references, cache.getState());
+            tags.sort(byNameTagSorter);
+            return tags.length ? tags[0].name : undefined;
+          },
       render: (references: SavedObjectReference[], object: SavedObject) => {
         return <components.TagList object={object} />;
       },