diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/config.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/config.ts index 9f218103672..2dbb3686b89 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/config.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/config.ts @@ -19,8 +19,6 @@ import { import { ExperimentOptimalTrialComponent } from './optimal-trial/experiment-optimal-trial.component'; export const experimentsTableConfig: TableConfig = { - title: 'Experiments', - newButtonText: 'NEW EXPERIMENT', columns: [ { matHeaderCellDef: 'Status', diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.html b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.html index 6d78c73a212..c91eae9e7e3 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.html +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.html @@ -1,11 +1,18 @@ - +
+ + + - +
+ + +
+
diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.ts index 62f30c5256f..b75d9d10f51 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.ts @@ -18,6 +18,7 @@ import { TemplateValue, ActionEvent, DashboardState, + ToolbarButton, } from 'kubeflow'; import { KWABackendService } from 'src/app/services/backend.service'; @@ -42,6 +43,17 @@ export class ExperimentsComponent implements OnInit, OnDestroy { private subs = new Subscription(); private poller: ExponentialBackoff; + buttons: ToolbarButton[] = [ + new ToolbarButton({ + text: `New Experiment`, + icon: 'add', + stroked: true, + fn: () => { + this.router.navigate(['/new']); + }, + }), + ]; + constructor( private backend: KWABackendService, private confirmDialog: ConfirmDialogService, @@ -73,9 +85,6 @@ export class ExperimentsComponent implements OnInit, OnDestroy { reactToAction(a: ActionEvent) { const exp = a.data as Experiment; switch (a.action) { - case 'newResourceButton': // TODO: could also use enums here - this.router.navigate(['/new']); - break; case 'name:link': this.router.navigate([`/experiment/${exp.name}`]); break; diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.module.ts index 81271db3d85..8c0ee5fac24 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.module.ts @@ -1,28 +1,12 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; -import { MatCardModule } from '@angular/material/card'; -import { - NamespaceSelectModule, - ResourceTableModule, - ConfirmDialogModule, -} from 'kubeflow'; - +import { KubeflowModule } from 'kubeflow'; import { ExperimentsComponent } from './experiments.component'; import { ExperimentOptimalTrialModule } from './optimal-trial/experiment-optimal-trial.module'; @NgModule({ declarations: [ExperimentsComponent], - imports: [ - CommonModule, - NamespaceSelectModule, - ResourceTableModule, - - ConfirmDialogModule, - ExperimentOptimalTrialModule, - MatCardModule, - ConfirmDialogModule, - MatCardModule, - ], + imports: [CommonModule, ExperimentOptimalTrialModule, KubeflowModule], exports: [ExperimentsComponent], }) export class ExperimentsModule {}