refactor(table): rename MatTableDataSource to ClientArrayTableDataSource

Renames the `MatTableDataSource` to `ClientArrayTableDataSource` to make it a bit clearer what it's supposed to be used for.

Fixes #14378.

src/lib/schematics/ng-update/data/class-names.ts

@@ -27,5 +27,16 @@ export const classNames: VersionChanges<ClassNameUpgradeData> = {
         }
       ]
     },
+  ],
+  [TargetVersion.V8]: [
+    {
+      pr: 'https://github.com/angular/material2/pull/15432',
+      changes: [
+        {
+          replace: 'MatTableDataSource',
+          replaceWith: 'ClientArrayTableDataSource'
+        }
+      ]
+    }
   ]
 };

src/lib/table/public-api.ts

@@ -6,8 +6,17 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import {ClientArrayTableDataSource} from './table-data-source';
+
 export * from './table-module';
 export * from './cell';
 export * from './table';
 export * from './row';
 export * from './table-data-source';
+
+/**
+ * @deprecated Use `ClientArrayTableDataSource` instead.
+ * @breaking-change 9.0.0
+ */
+// tslint:disable-next-line:variable-name
+export const MatTableDataSource = ClientArrayTableDataSource;

src/lib/table/table-data-source.ts

@@ -35,7 +35,7 @@ const MAX_SAFE_INTEGER = 9007199254740991;
  * properties are accessed. Also allows for filter customization by overriding filterTermAccessor,
  * which defines how row data is converted to a string for filter matching.
  */
-export class MatTableDataSource<T> extends DataSource<T> {
+export class ClientArrayTableDataSource<T> extends DataSource<T> {
   /** Stream that emits when a new data array is set on the data source. */
   private readonly _data: BehaviorSubject<T[]>;
 

src/lib/table/table.spec.ts

@@ -14,7 +14,7 @@ import {MatPaginator, MatPaginatorModule} from '../paginator/index';
 import {MatSort, MatSortHeader, MatSortModule} from '../sort/index';
 import {MatTableModule} from './index';
 import {MatTable} from './table';
-import {MatTableDataSource} from './table-data-source';
+import {ClientArrayTableDataSource} from './table-data-source';
 
 
 describe('MatTable', () => {
@@ -99,7 +99,7 @@ describe('MatTable', () => {
     ]);
   });
 
-  it('should render with MatTableDataSource and sort', () => {
+  it('should render with ClientArrayTableDataSource and sort', () => {
     let fixture = TestBed.createComponent(MatTableWithSortApp);
     fixture.detectChanges();
 
@@ -113,7 +113,7 @@ describe('MatTable', () => {
     ]);
   });
 
-  it('should render with MatTableDataSource and pagination', () => {
+  it('should render with ClientArrayTableDataSource and pagination', () => {
     let fixture = TestBed.createComponent(MatTableWithPaginatorApp);
     fixture.detectChanges();
 
@@ -145,10 +145,10 @@ describe('MatTable', () => {
     }).not.toThrow();
   }));
 
-  describe('with MatTableDataSource and sort/pagination/filter', () => {
+  describe('with ClientArrayTableDataSource and sort/pagination/filter', () => {
     let tableElement: HTMLElement;
     let fixture: ComponentFixture<ArrayDataSourceMatTableApp>;
-    let dataSource: MatTableDataSource<TestData>;
+    let dataSource: ClientArrayTableDataSource<TestData>;
     let component: ArrayDataSourceMatTableApp;
 
     beforeEach(fakeAsync(() => {
@@ -679,7 +679,7 @@ class MatTableWithWhenRowApp {
 })
 class ArrayDataSourceMatTableApp implements AfterViewInit {
   underlyingDataSource = new FakeDataSource();
-  dataSource = new MatTableDataSource<TestData>();
+  dataSource = new ClientArrayTableDataSource<TestData>();
   columnsToRender = ['column_a', 'column_b', 'column_c'];
 
   @ViewChild(MatTable) table: MatTable<TestData>;
@@ -732,7 +732,7 @@ class ArrayDataSourceMatTableApp implements AfterViewInit {
 })
 class MatTableWithSortApp implements OnInit {
   underlyingDataSource = new FakeDataSource();
-  dataSource = new MatTableDataSource<TestData>();
+  dataSource = new ClientArrayTableDataSource<TestData>();
   columnsToRender = ['column_a', 'column_b', 'column_c'];
 
   @ViewChild(MatTable) table: MatTable<TestData>;
@@ -783,7 +783,7 @@ class MatTableWithSortApp implements OnInit {
 })
 class MatTableWithPaginatorApp implements OnInit {
   underlyingDataSource = new FakeDataSource();
-  dataSource = new MatTableDataSource<TestData>();
+  dataSource = new ClientArrayTableDataSource<TestData>();
   columnsToRender = ['column_a', 'column_b', 'column_c'];
 
   @ViewChild(MatTable) table: MatTable<TestData>;

src/material-examples/table-filtering/table-filtering-example.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {MatTableDataSource} from '@angular/material';
+import {ClientArrayTableDataSource} from '@angular/material';
 
 export interface PeriodicElement {
   name: string;
@@ -31,7 +31,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
 })
 export class TableFilteringExample {
   displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
-  dataSource = new MatTableDataSource(ELEMENT_DATA);
+  dataSource = new ClientArrayTableDataSource(ELEMENT_DATA);
 
   applyFilter(filterValue: string) {
     this.dataSource.filter = filterValue.trim().toLowerCase();

src/material-examples/table-overview/table-overview-example.ts

@@ -1,5 +1,5 @@
 import {Component, OnInit, ViewChild} from '@angular/core';
-import {MatPaginator, MatSort, MatTableDataSource} from '@angular/material';
+import {MatPaginator, MatSort, ClientArrayTableDataSource} from '@angular/material';
 
 export interface UserData {
   id: string;
@@ -25,7 +25,7 @@ const NAMES: string[] = ['Maia', 'Asher', 'Olivia', 'Atticus', 'Amelia', 'Jack',
 })
 export class TableOverviewExample implements OnInit {
   displayedColumns: string[] = ['id', 'name', 'progress', 'color'];
-  dataSource: MatTableDataSource<UserData>;
+  dataSource: ClientArrayTableDataSource<UserData>;
 
   @ViewChild(MatPaginator) paginator: MatPaginator;
   @ViewChild(MatSort) sort: MatSort;
@@ -35,7 +35,7 @@ export class TableOverviewExample implements OnInit {
     const users = Array.from({length: 100}, (_, k) => createNewUser(k + 1));
 
     // Assign the data to the data source for the table to render
-    this.dataSource = new MatTableDataSource(users);
+    this.dataSource = new ClientArrayTableDataSource(users);
   }
 
   ngOnInit() {

src/material-examples/table-pagination/table-pagination-example.ts

@@ -1,5 +1,5 @@
 import {Component, OnInit, ViewChild} from '@angular/core';
-import {MatPaginator, MatTableDataSource} from '@angular/material';
+import {MatPaginator, ClientArrayTableDataSource} from '@angular/material';
 
 /**
  * @title Table with pagination
@@ -11,7 +11,7 @@ import {MatPaginator, MatTableDataSource} from '@angular/material';
 })
 export class TablePaginationExample implements OnInit {
   displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
-  dataSource = new MatTableDataSource<PeriodicElement>(ELEMENT_DATA);
+  dataSource = new ClientArrayTableDataSource<PeriodicElement>(ELEMENT_DATA);
 
   @ViewChild(MatPaginator) paginator: MatPaginator;
 

src/material-examples/table-selection/table-selection-example.ts

@@ -1,6 +1,6 @@
 import {SelectionModel} from '@angular/cdk/collections';
 import {Component} from '@angular/core';
-import {MatTableDataSource} from '@angular/material';
+import {ClientArrayTableDataSource} from '@angular/material';
 
 export interface PeriodicElement {
   name: string;
@@ -32,7 +32,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
 })
 export class TableSelectionExample {
   displayedColumns: string[] = ['select', 'position', 'name', 'weight', 'symbol'];
-  dataSource = new MatTableDataSource<PeriodicElement>(ELEMENT_DATA);
+  dataSource = new ClientArrayTableDataSource<PeriodicElement>(ELEMENT_DATA);
   selection = new SelectionModel<PeriodicElement>(true, []);
 
   /** Whether the number of selected elements matches the total number of rows. */

src/material-examples/table-simple-column/table-simple-column-example.ts

@@ -5,7 +5,7 @@ import {
     MatSort,
     MatSortHeader,
     MatTable,
-    MatTableDataSource
+    ClientArrayTableDataSource
 } from '@angular/material';
 
 export interface PeriodicElement {
@@ -38,7 +38,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
 })
 export class TableSimpleColumnExample implements OnInit {
   displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
-  dataSource = new MatTableDataSource<PeriodicElement>(ELEMENT_DATA);
+  dataSource = new ClientArrayTableDataSource<PeriodicElement>(ELEMENT_DATA);
   getWeight = (data: PeriodicElement) => '~' + data.weight;
 
   @ViewChild('sort') sort: MatSort;

src/material-examples/table-sorting/table-sorting-example.ts

@@ -1,5 +1,5 @@
 import {Component, OnInit, ViewChild} from '@angular/core';
-import {MatSort, MatTableDataSource} from '@angular/material';
+import {MatSort, ClientArrayTableDataSource} from '@angular/material';
 
 export interface PeriodicElement {
   name: string;
@@ -31,7 +31,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
 })
 export class TableSortingExample implements OnInit {
   displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
-  dataSource = new MatTableDataSource(ELEMENT_DATA);
+  dataSource = new ClientArrayTableDataSource(ELEMENT_DATA);
 
   @ViewChild(MatSort) sort: MatSort;
 

src/material-examples/table-wrapped/table-wrapped-example.ts

@@ -13,7 +13,7 @@ import {
   MatRowDef,
   MatSort,
   MatTable,
-  MatTableDataSource
+  ClientArrayTableDataSource
 } from '@angular/material';
 import {DataSource} from '@angular/cdk/collections';
 
@@ -47,7 +47,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
 })
 export class TableWrappedExample implements OnInit {
   displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
-  dataSource = new MatTableDataSource<PeriodicElement>(ELEMENT_DATA);
+  dataSource = new ClientArrayTableDataSource<PeriodicElement>(ELEMENT_DATA);
 
   @ViewChild('sort') sort: MatSort;
 

tools/public_api_guard/lib/table.d.ts

@@ -1,3 +1,23 @@
+export declare class ClientArrayTableDataSource<T> extends DataSource<T> {
+    _renderChangesSubscription: Subscription;
+    data: T[];
+    filter: string;
+    filterPredicate: ((data: T, filter: string) => boolean);
+    filteredData: T[];
+    paginator: MatPaginator | null;
+    sort: MatSort | null;
+    sortData: ((data: T[], sort: MatSort) => T[]);
+    sortingDataAccessor: ((data: T, sortHeaderId: string) => string | number);
+    constructor(initialData?: T[]);
+    _filterData(data: T[]): T[];
+    _orderData(data: T[]): T[];
+    _pageData(data: T[]): T[];
+    _updateChangeSubscription(): void;
+    _updatePaginator(filteredDataLength: number): void;
+    connect(): BehaviorSubject<T[]>;
+    disconnect(): void;
+}
+
 export declare class MatCell extends CdkCell {
     constructor(columnDef: CdkColumnDef, elementRef: ElementRef<HTMLElement>);
 }
@@ -47,25 +67,7 @@ export declare class MatTable<T> extends CdkTable<T> {
     protected stickyCssClass: string;
 }
 
-export declare class MatTableDataSource<T> extends DataSource<T> {
-    _renderChangesSubscription: Subscription;
-    data: T[];
-    filter: string;
-    filterPredicate: ((data: T, filter: string) => boolean);
-    filteredData: T[];
-    paginator: MatPaginator | null;
-    sort: MatSort | null;
-    sortData: ((data: T[], sort: MatSort) => T[]);
-    sortingDataAccessor: ((data: T, sortHeaderId: string) => string | number);
-    constructor(initialData?: T[]);
-    _filterData(data: T[]): T[];
-    _orderData(data: T[]): T[];
-    _pageData(data: T[]): T[];
-    _updateChangeSubscription(): void;
-    _updatePaginator(filteredDataLength: number): void;
-    connect(): BehaviorSubject<T[]>;
-    disconnect(): void;
-}
+export declare const MatTableDataSource: typeof ClientArrayTableDataSource;
 
 export declare class MatTableModule {
 }