From f13eb5053bf80f821e0b6d4d77b0b3e3b5ec28bb Mon Sep 17 00:00:00 2001 From: PoAn Yang Date: Sun, 1 Oct 2023 19:36:22 +0800 Subject: [PATCH] [YUNIKORN-1923] update apps columns * remove partition and queue columns * add pending resource column Signed-off-by: PoAn Yang --- json-db.json | 40 +++++++++ .../apps-view/apps-view.component.html | 82 ++++++------------- .../apps-view/apps-view.component.spec.ts | 38 +++++++-- .../apps-view/apps-view.component.ts | 7 +- src/app/models/app-info.model.ts | 3 +- .../services/scheduler/scheduler.service.ts | 3 +- src/app/testing/mocks.ts | 2 + 7 files changed, 109 insertions(+), 66 deletions(-) diff --git a/json-db.json b/json-db.json index 8f3ed379..a9463fd9 100644 --- a/json-db.json +++ b/json-db.json @@ -512,6 +512,46 @@ "hasReserved": false, "reservations": [], "maxRequestPriority": -2147483648 + }, + { + "applicationID": "application-sleep-0006", + "usedResource": { + "memory": 0, + "pods": 0, + "vcore": 0 + }, + "maxUsedResource": { + "memory": 150000000, + "pods": 3, + "vcore": 30 + }, + "pendingResource": { + "memory": 150000000, + "pods": 3, + "vcore": 30 + }, + "partition": "default", + "queueName": "root.default", + "submissionTime": 1683692669425545686, + "finishedTime": null, + "requests": [], + "allocations": [], + "applicationState": "Accepted", + "user": "nobody", + "groups": [ + "nobody" + ], + "rejectedMessage": "", + "stateLog": [ + { + "time": 1683692671425545686, + "applicationState": "Accepted" + } + ], + "placeholderData": [], + "hasReserved": false, + "reservations": [], + "maxRequestPriority": -2147483648 } ], "appHistory": [ diff --git a/src/app/components/apps-view/apps-view.component.html b/src/app/components/apps-view/apps-view.component.html index 6635cd9c..3b66dfb0 100644 --- a/src/app/components/apps-view/apps-view.component.html +++ b/src/app/components/apps-view/apps-view.component.html @@ -21,10 +21,7 @@
- + {{ part.name }} @@ -44,20 +41,9 @@
- - @@ -84,7 +70,8 @@ - + @@ -138,25 +125,16 @@ - + - + - +
@@ -172,16 +150,16 @@

Allocations

-
    - -
  • - {{resource}} -
    • -
  • - {{resource}} -
    • -     -
+
    + +
  • + {{resource}} +
    • +
  • + {{resource}} +
    • +     +
@@ -205,18 +183,12 @@

Allocations

- + - +
diff --git a/src/app/components/apps-view/apps-view.component.spec.ts b/src/app/components/apps-view/apps-view.component.spec.ts index 582b6c2b..3bc1d22e 100644 --- a/src/app/components/apps-view/apps-view.component.spec.ts +++ b/src/app/components/apps-view/apps-view.component.spec.ts @@ -16,12 +16,13 @@ * limitations under the License. */ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { DebugElement } from '@angular/core'; +import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { RouterTestingModule } from '@angular/router/testing'; import { HAMMER_LOADER } from '@angular/platform-browser'; import { NgxSpinnerService } from 'ngx-spinner'; -import { configureTestSuite } from 'ng-bullet'; import { FormsModule } from '@angular/forms'; import { MatTableModule } from '@angular/material/table'; import { MatPaginatorModule } from '@angular/material/paginator'; @@ -30,8 +31,11 @@ import { MatSortModule } from '@angular/material/sort'; import { MatInputModule } from '@angular/material/input'; import { MatTooltipModule } from '@angular/material/tooltip'; import { MatSelectModule } from '@angular/material/select'; +import { of } from 'rxjs'; import { AppsViewComponent } from './apps-view.component'; +import { AppInfo } from '@app/models/app-info.model'; +import { AllocationInfo } from '@app/models/alloc-info.model'; import { SchedulerService } from '@app/services/scheduler/scheduler.service'; import { MockSchedulerService, MockNgxSpinnerService } from '@app/testing/mocks'; @@ -39,7 +43,7 @@ describe('AppsViewComponent', () => { let component: AppsViewComponent; let fixture: ComponentFixture; - configureTestSuite(() => { + beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ declarations: [AppsViewComponent], imports: [ @@ -59,8 +63,8 @@ describe('AppsViewComponent', () => { { provide: NgxSpinnerService, useValue: MockNgxSpinnerService }, { provide: HAMMER_LOADER, useValue: () => new Promise(() => {}) }, ], - }); - }); + }).compileComponents(); + })); beforeEach(() => { fixture = TestBed.createComponent(AppsViewComponent); @@ -71,4 +75,28 @@ describe('AppsViewComponent', () => { it('should create the component', () => { expect(component).toBeTruthy(); }); + + it('should have usedResource and pendingResource column', () => { + let service: SchedulerService; + service = TestBed.inject(SchedulerService); + let appInfo = new AppInfo( + 'app1', + "Memory: 500.0 KB, CPU: 10, pods: 1", + "Memory: 0.0 bytes, CPU: 0, pods: n/a", + '', + 1, + 2, + [], + 2, + 'RUNNING', + [] + ); + spyOn(service, 'fetchAppList').and.returnValue(of([appInfo])); + component.fetchAppListForPartitionAndQueue("default", "root"); + component.toggle(); + fixture.detectChanges(); + const debugEl: DebugElement = fixture.debugElement; + expect(debugEl.query(By.css('mat-cell.mat-column-usedResource')).nativeElement.innerText).toContain('Memory: 500.0 KB\nCPU: 10\npods: 1'); + expect(debugEl.query(By.css('mat-cell.mat-column-pendingResource')).nativeElement.innerText).toContain('Memory: 0.0 bytes\nCPU: 0\npods: n/a'); + }); }); diff --git a/src/app/components/apps-view/apps-view.component.ts b/src/app/components/apps-view/apps-view.component.ts index fa94c356..78d7d143 100644 --- a/src/app/components/apps-view/apps-view.component.ts +++ b/src/app/components/apps-view/apps-view.component.ts @@ -79,7 +79,6 @@ export class AppsViewComponent implements OnInit { this.appColumnDef = [ { colId: 'applicationId', colName: 'Application ID' }, - { colId: 'queueName', colName: 'Queue Name' }, { colId: 'applicationState', colName: 'Application State' }, { colId: 'lastStateChangeTime', @@ -91,7 +90,11 @@ export class AppsViewComponent implements OnInit { colName: 'Used Resource', colFormatter: CommonUtil.resourceColumnFormatter, }, - { colId: 'partition', colName: 'Partition' }, + { + colId: 'pendingResource', + colName: 'Pending Resource', + colFormatter: CommonUtil.resourceColumnFormatter, + }, { colId: 'submissionTime', colName: 'Submission Time', diff --git a/src/app/models/app-info.model.ts b/src/app/models/app-info.model.ts index 9f47e9b1..3e3c1a07 100644 --- a/src/app/models/app-info.model.ts +++ b/src/app/models/app-info.model.ts @@ -26,9 +26,8 @@ export class AppInfo { constructor( public applicationId: string, public usedResource: string, + public pendingResource: string, public maxUsedResource: string, - public partition: string, - public queueName: string, public submissionTime: number, public finishedTime: null | number, public stateLog: Array, diff --git a/src/app/services/scheduler/scheduler.service.ts b/src/app/services/scheduler/scheduler.service.ts index 22174e09..251b5e2e 100644 --- a/src/app/services/scheduler/scheduler.service.ts +++ b/src/app/services/scheduler/scheduler.service.ts @@ -91,9 +91,8 @@ export class SchedulerService { const appInfo = new AppInfo( app['applicationID'], this.formatResource(app['usedResource'] as SchedulerResourceInfo), + this.formatResource(app['pendingResource'] as SchedulerResourceInfo), this.formatResource(app['maxUsedResource'] as SchedulerResourceInfo), - app['partition'], - app['queueName'], app['submissionTime'], app['lastStateChangeTime'], app['stateLog'], diff --git a/src/app/testing/mocks.ts b/src/app/testing/mocks.ts index 880a1be1..45efbd43 100644 --- a/src/app/testing/mocks.ts +++ b/src/app/testing/mocks.ts @@ -17,6 +17,8 @@ */ import { of } from 'rxjs'; +import { AppInfo } from '@app/models/app-info.model'; +import { CommonUtil } from '@app/utils/common.util'; export const noopFn = () => {};