From f278dff371373712aae753402cfcdfc32b1067df Mon Sep 17 00:00:00 2001
From: Yasser Elsayed <yasser.ebrahim@gmail.com>
Date: Tue, 6 Nov 2018 21:36:06 -0800
Subject: [PATCH] hard code CREATED_AT as initial sort key

---
 frontend/src/pages/ExperimentList.tsx       | 6 ++----
 frontend/src/pages/PipelineSelector.tsx     | 8 +++-----
 frontend/src/pages/RecurringRunsManager.tsx | 8 +++-----
 3 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/frontend/src/pages/ExperimentList.tsx b/frontend/src/pages/ExperimentList.tsx
index 58ecb9cf8fd..c6f5968ecf2 100644
--- a/frontend/src/pages/ExperimentList.tsx
+++ b/frontend/src/pages/ExperimentList.tsx
@@ -41,7 +41,6 @@ interface ExperimentListState {
   displayExperiments: DisplayExperiment[];
   selectedRunIds: string[];
   selectedTab: number;
-  sortBy: string;
 }
 
 class ExperimentList extends Page<{}, ExperimentListState> {
@@ -54,7 +53,6 @@ class ExperimentList extends Page<{}, ExperimentListState> {
       displayExperiments: [],
       selectedRunIds: [],
       selectedTab: 0,
-      sortBy: ExperimentSortKeys.CREATED_AT,
     };
   }
 
@@ -122,7 +120,7 @@ class ExperimentList extends Page<{}, ExperimentListState> {
     return (
       <div className={classes(commonCss.page, padding(20, 'lr'))}>
         <CustomTable columns={columns} rows={rows} ref={this._tableRef}
-          disableSelection={true} initialSortColumn={this.state.sortBy}
+          disableSelection={true} initialSortColumn={ExperimentSortKeys.CREATED_AT}
           reload={this._reload.bind(this)} toggleExpansion={this._toggleRowExpand.bind(this)}
           getExpandComponent={this._getExpandedExperimentComponent.bind(this)}
           emptyMessage='No experiments found. Click "Create experiment" to start.' />
@@ -172,7 +170,7 @@ class ExperimentList extends Page<{}, ExperimentListState> {
       }
     }));
 
-    this.setState({ displayExperiments, sortBy: request.sortBy! });
+    this.setState({ displayExperiments });
     return response.next_page_token || '';
   }
 
diff --git a/frontend/src/pages/PipelineSelector.tsx b/frontend/src/pages/PipelineSelector.tsx
index 35d29aed1be..fbac36e6662 100644
--- a/frontend/src/pages/PipelineSelector.tsx
+++ b/frontend/src/pages/PipelineSelector.tsx
@@ -31,7 +31,6 @@ interface PipelineSelectorProps extends RouteComponentProps {
 interface PipelineSelectorState {
   pipelines: ApiPipeline[];
   selectedIds: string[];
-  sortBy: string;
   toolbarActions: ToolbarActionConfig[];
 }
 
@@ -44,13 +43,12 @@ class PipelineSelector extends React.Component<PipelineSelectorProps, PipelineSe
     this.state = {
       pipelines: [],
       selectedIds: [],
-      sortBy: PipelineSortKeys.CREATED_AT,
       toolbarActions: [],
     };
   }
 
   public render() {
-    const { pipelines, selectedIds, sortBy, toolbarActions } = this.state;
+    const { pipelines, selectedIds, toolbarActions } = this.state;
 
     const columns: Column[] = [
       { label: 'Pipeline name', flex: 1, sortKey: PipelineSortKeys.NAME },
@@ -75,7 +73,7 @@ class PipelineSelector extends React.Component<PipelineSelectorProps, PipelineSe
         <Toolbar actions={toolbarActions} breadcrumbs={[{ displayName: 'Choose a pipeline', href: '' }]} />
         <CustomTable columns={columns} rows={rows} selectedIds={selectedIds} useRadioButtons={true}
           updateSelection={ids => { this._pipelineSelectionChanged(ids); this.setState({ selectedIds: ids }); }}
-          initialSortColumn={sortBy} ref={this._tableRef}
+          initialSortColumn={PipelineSortKeys.CREATED_AT} ref={this._tableRef}
           reload={this._loadPipelines.bind(this)} emptyMessage={'No pipelines found. Upload a pipeline and then try again.'} />
       </React.Fragment>
     );
@@ -113,7 +111,7 @@ class PipelineSelector extends React.Component<PipelineSelectorProps, PipelineSe
       logger.error('Could not get list of pipelines', errorMessage);
     }
 
-    this.setState({ pipelines, sortBy: request.sortBy! });
+    this.setState({ pipelines });
     return nextPageToken;
   }
 }
diff --git a/frontend/src/pages/RecurringRunsManager.tsx b/frontend/src/pages/RecurringRunsManager.tsx
index 91c930e8c9c..b68433b1e51 100644
--- a/frontend/src/pages/RecurringRunsManager.tsx
+++ b/frontend/src/pages/RecurringRunsManager.tsx
@@ -37,7 +37,6 @@ interface RecurringRunListState {
   busyIds: Set<string>;
   runs: ApiJob[];
   selectedIds: string[];
-  sortBy: string;
   toolbarActions: ToolbarActionConfig[];
 }
 
@@ -51,13 +50,12 @@ class RecurringRunsManager extends React.Component<RecurringRunListProps, Recurr
       busyIds: new Set(),
       runs: [],
       selectedIds: [],
-      sortBy: JobSortKeys.CREATED_AT,
       toolbarActions: [],
     };
   }
 
   public render() {
-    const { runs, selectedIds, sortBy, toolbarActions } = this.state;
+    const { runs, selectedIds, toolbarActions } = this.state;
 
     const columns: Column[] = [
       {
@@ -85,7 +83,7 @@ class RecurringRunsManager extends React.Component<RecurringRunListProps, Recurr
     return (<React.Fragment>
       <Toolbar actions={toolbarActions} breadcrumbs={[{ displayName: 'Recurring runs', href: '' }]} />
       <CustomTable columns={columns} rows={rows} ref={this._tableRef} selectedIds={selectedIds}
-        updateSelection={ids => this.setState({ selectedIds: ids })} initialSortColumn={sortBy}
+        updateSelection={ids => this.setState({ selectedIds: ids })} initialSortColumn={JobSortKeys.CREATED_AT}
         reload={this._loadRuns.bind(this)} emptyMessage={'No recurring runs found in this experiment.'}
         disableSelection={true} />
     </React.Fragment>);
@@ -120,7 +118,7 @@ class RecurringRunsManager extends React.Component<RecurringRunListProps, Recurr
       logger.error('Could not get list of recurring runs', errorMessage);
     }
 
-    this.setState({ runs, sortBy: request.sortBy! });
+    this.setState({ runs });
     return nextPageToken;
   }