diff --git a/pkg/new-ui/v1beta1/frontend/COMMIT b/pkg/new-ui/v1beta1/frontend/COMMIT index 619abce0b27..32af1f8b103 100644 --- a/pkg/new-ui/v1beta1/frontend/COMMIT +++ b/pkg/new-ui/v1beta1/frontend/COMMIT @@ -1 +1 @@ -2b4cc42e \ No newline at end of file +b931a7f8 \ No newline at end of file diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.html b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.html index c180312c45d..2dc23321bfe 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.html +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.html @@ -11,7 +11,9 @@
- +
diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.spec.ts index 6cef9817957..ee603eaacb6 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.spec.ts @@ -8,7 +8,6 @@ import { CommonModule } from '@angular/common'; import { MatButtonModule } from '@angular/material/button'; import { MatIconModule } from '@angular/material/icon'; import { MatTabsModule } from '@angular/material/tabs'; -import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; import { ConfirmDialogService, NamespaceService, @@ -63,7 +62,6 @@ describe('ExperimentDetailsComponent', () => { PanelModule, ExperimentOverviewModule, ExperimentDetailsTabModule, - MatProgressSpinnerModule, ExperimentYamlModule, TitleActionsToolbarModule, TrialsGraphEchartsModule, diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.html b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.html index c7989d57dd6..88baf33ffc0 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.html +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.html @@ -8,7 +8,7 @@
-
+
+
+ + Trial is not completed yet. + +
+
@@ -56,7 +62,9 @@
- +
diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.spec.ts index d6f7d44ea07..541e02e8f89 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.spec.ts @@ -2,14 +2,17 @@ import { HttpClientModule } from '@angular/common/http'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { ReactiveFormsModule } from '@angular/forms'; import { MatSnackBarModule } from '@angular/material/snack-bar'; -import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; import { TrialDetailsComponent } from './trial-details.component'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { KWABackendService } from 'src/app/services/backend.service'; import { of } from 'rxjs'; import { ActivatedRoute, Router } from '@angular/router'; -import { NamespaceService, TitleActionsToolbarModule } from 'kubeflow'; +import { + LoadingSpinnerModule, + NamespaceService, + TitleActionsToolbarModule, +} from 'kubeflow'; let KWABackendServiceStub: Partial; let NamespaceServiceStub: Partial; @@ -43,9 +46,9 @@ describe('TrialDetailsComponent', () => { HttpClientModule, ReactiveFormsModule, MatSnackBarModule, - MatProgressSpinnerModule, BrowserAnimationsModule, TitleActionsToolbarModule, + LoadingSpinnerModule, ], declarations: [TrialDetailsComponent], providers: [ diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.ts index eeeda733210..827f99befc5 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-details/trial-details.component.ts @@ -27,6 +27,7 @@ export class TrialDetailsComponent implements OnInit, OnDestroy { dataLoaded: boolean; trialDetails: TrialK8s; experimentName: string; + showTrialGraph: boolean = false; // chart's options view = [700, 500]; @@ -122,9 +123,12 @@ export class TrialDetailsComponent implements OnInit, OnDestroy { .getTrialInfo(this.trialName, this.namespace) .subscribe((response: TrialK8s) => { this.trialDetails = response; - const status = this.trialStatus(response); + if (status && status === StatusEnum.SUCCEEDED) { + this.showTrialGraph = true; + } + if ( status && !(status === StatusEnum.FAILED || status === StatusEnum.SUCCEEDED) @@ -183,6 +187,11 @@ export class TrialDetailsComponent implements OnInit, OnDestroy { .getTrialInfo(this.trialName, this.namespace) .subscribe(response => { this.trialDetails = response; + const status = this.trialStatus(response); + + if (status && status === StatusEnum.SUCCEEDED) { + this.showTrialGraph = true; + } }); }), ); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.component.spec.ts index ff5fc85b182..15c29ac627e 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.component.spec.ts @@ -4,7 +4,6 @@ import { MatTableModule } from '@angular/material/table'; import { MatIconModule } from '@angular/material/icon'; import { MatDialogModule } from '@angular/material/dialog'; import { NgxChartsModule } from '@swimlane/ngx-charts'; -import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; import { RouterTestingModule } from '@angular/router/testing'; import { MatTooltipModule } from '@angular/material/tooltip'; import { MatButtonModule } from '@angular/material/button'; @@ -12,10 +11,16 @@ import { TrialsTableComponent } from './trials-table.component'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { SimpleChange } from '@angular/core'; -import { PropertyValue, StatusValue, ComponentValue } from 'kubeflow'; +import { + PropertyValue, + StatusValue, + ComponentValue, + KubeflowModule, +} from 'kubeflow'; import { parseStatus } from '../../experiments/utils'; import lowerCase from 'lodash-es/lowerCase'; import { KfpRunComponent } from './kfp-run/kfp-run.component'; +import { MatIconTestingModule } from '@angular/material/icon/testing'; describe('TrialsTableComponent', () => { let component: TrialsTableComponent; @@ -27,7 +32,6 @@ describe('TrialsTableComponent', () => { imports: [ CommonModule, MatTableModule, - MatProgressSpinnerModule, MatDialogModule, MatIconModule, NgxChartsModule, @@ -35,6 +39,8 @@ describe('TrialsTableComponent', () => { MatButtonModule, RouterTestingModule, BrowserAnimationsModule, + KubeflowModule, + MatIconTestingModule, ], declarations: [TrialsTableComponent], }).compileComponents(); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.module.ts index 2f5cc4479e4..3a7ae8147e6 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.module.ts @@ -4,7 +4,6 @@ import { MatTableModule } from '@angular/material/table'; import { MatIconModule } from '@angular/material/icon'; import { MatDialogModule } from '@angular/material/dialog'; import { NgxChartsModule } from '@swimlane/ngx-charts'; -import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; import { TrialsTableComponent } from './trials-table.component'; import { MatTooltipModule } from '@angular/material/tooltip'; @@ -18,7 +17,6 @@ import { TrialDetailsModule } from './trial-details/trial-details.module'; imports: [ CommonModule, MatTableModule, - MatProgressSpinnerModule, MatDialogModule, MatIconModule, NgxChartsModule,