alihan/odo
1
0
Fork 0
mirror of https://github.com/redhat-developer/odo.git synced 2025-10-19 03:06:19 +03:00
Code Issues Packages Projects Releases Wiki Activity

Alert user when Devfile is synced (#6996)

Browse Source 
* Alert user when Devfile is synced

* Update UI static files

* Fix UI e2e test
This commit is contained in:
Philippe Martin
2023-07-21 13:39:46 +02:00
committed by GitHub
parent 9605c92ede
commit fdafabe617
10 changed files with 87 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
pkg/apiserver-impl/ui/index.html generated
View File

@@ -11,6 +11,6 @@
<body class="mat-typography">
<div id="loading">Loading, please wait...</div>
<app-root></app-root>
<script src="runtime.1289ea0acffcdc5e.js" type="module"></script><script src="polyfills.8b3b37cedaf377c3.js" type="module"></script><script src="main.64f53365507b1341.js" type="module"></script>
<script src="runtime.1289ea0acffcdc5e.js" type="module"></script><script src="polyfills.8b3b37cedaf377c3.js" type="module"></script><script src="main.a562f09a5f00f55f.js" type="module"></script>
</body></html>

1
pkg/apiserver-impl/ui/main.64f53365507b1341.js generated
View File

File diff suppressed because one or more lines are too long

1
pkg/apiserver-impl/ui/main.a562f09a5f00f55f.js generated Normal file
View File

File diff suppressed because one or more lines are too long

1
ui/cypress/support/commands.ts
View File

@@ -72,6 +72,7 @@ Cypress.Commands.add('clearDevfile', () => {
Cypress.Commands.add('writeDevfileFile', (content: string) => {
cy.intercept('PUT', '/api/v1/devstate/devfile').as('writeDevfileFile.applyDevState');
cy.writeFile('devfile.yaml', content)
cy.get('button[data-cy="confirm-yes"]').first().click();
cy.wait(['@writeDevfileFile.applyDevState']);
});

27
ui/src/app/app.component.ts
View File

@@ -10,6 +10,8 @@ import {DevfileContent} from "./api-gen";
import { TelemetryResponse } from './api-gen';
import { MatTabChangeEvent } from '@angular/material/tabs';
import { TelemetryService } from './services/telemetry.service';
import { MatSnackBar, MatSnackBarRef } from '@angular/material/snack-bar';
import { ConfirmComponent } from './components/confirm/confirm.component';
@Component({
selector: 'app-root',
@@ -32,6 +34,7 @@ export class AppComponent implements OnInit {
protected mermaidContent: string = "";
protected devfileYaml: string = "";
protected errorMessage: string = "";
private snackBarRef: MatSnackBarRef<ConfirmComponent> | null = null;
constructor(
protected sanitizer: DomSanitizer,
@@ -41,7 +44,8 @@ export class AppComponent implements OnInit {
private mermaid: MermaidService,
private state: StateService,
private sse: SseService,
private telemetry: TelemetryService
private telemetry: TelemetryService,
private snackbar: MatSnackBar
) {
this.matIconRegistry.addSvgIcon(
`github`,
@@ -84,10 +88,25 @@ export class AppComponent implements OnInit {
});
this.sse.subscribeTo(['DevfileUpdated']).subscribe(event => {
let newDevfile: DevfileContent = JSON.parse(event.data)
if (newDevfile.content != undefined) {
this.propagateChange(newDevfile.content, false);
if (this.snackBarRef != null) {
this.snackBarRef.afterDismissed().subscribe(() => {});
this.snackBarRef.dismiss();
}
this.snackBarRef = this.snackbar.openFromComponent(ConfirmComponent, { data: {
message: "The Devfile has changed on disk. Do you want to update it here?",
noLabel: "Cancel",
yesLabel: "Update"
}});
this.snackBarRef.onAction().subscribe(() => {
let newDevfile: DevfileContent = JSON.parse(event.data);
if (newDevfile.content != undefined) {
this.propagateChange(newDevfile.content, false);
}
this.snackBarRef = null;
});
this.snackBarRef.afterDismissed().subscribe(() => {
this.snackBarRef = null;
});
});
this.odoApi.telemetry().subscribe({

4
ui/src/app/app.module.ts
View File

@@ -18,6 +18,7 @@ import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatTabsModule } from '@angular/material/tabs';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
@@ -43,6 +44,7 @@ import { CommandsListComponent } from './lists/commands-list/commands-list.compo
import { MultiCommandComponent } from './controls/multi-command/multi-command.component';
import { EventsComponent } from './tabs/events/events.component';
import { ChipsEventsComponent } from './controls/chips-events/chips-events.component';
import { ConfirmComponent } from './components/confirm/confirm.component';
@NgModule({
declarations: [
@@ -65,6 +67,7 @@ import { ChipsEventsComponent } from './controls/chips-events/chips-events.compo
MultiCommandComponent,
EventsComponent,
ChipsEventsComponent,
ConfirmComponent,
],
imports: [
BrowserModule,
@@ -86,6 +89,7 @@ import { ChipsEventsComponent } from './controls/chips-events/chips-events.compo
MatInputModule,
MatMenuModule,
MatSelectModule,
MatSnackBarModule,
MatTabsModule,
MatToolbarModule,
MatTooltipModule,

0
ui/src/app/components/confirm/confirm.component.css Normal file
View File

3
ui/src/app/components/confirm/confirm.component.html Normal file
View File

@@ -0,0 +1,3 @@
<p>{{message}}</p>
<button data-cy="confirm-no" mat-raised-button (click)="doNo()">{{noLabel}} </button>
<button data-cy="confirm-yes" mat-raised-button (click)="doYes()">{{yesLabel}}</button>

23
ui/src/app/components/confirm/confirm.component.spec.ts Normal file
View File

@@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ConfirmComponent } from './confirm.component';
describe('ConfirmComponent', () => {
let component: ConfirmComponent;
let fixture: ComponentFixture<ConfirmComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ConfirmComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(ConfirmComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

31
ui/src/app/components/confirm/confirm.component.ts Normal file
View File

@@ -0,0 +1,31 @@
import { Component, Inject } from '@angular/core';
import { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';
@Component({
selector: 'app-confirm',
templateUrl: './confirm.component.html',
styleUrls: ['./confirm.component.css']
})
export class ConfirmComponent {
protected noLabel: string;
protected yesLabel: string;
protected message: string;
constructor(
private snackbarRef: MatSnackBarRef<ConfirmComponent>,
@Inject(MAT_SNACK_BAR_DATA) data: any,
) {
this.message = data.message;
this.noLabel = data.noLabel;
this.yesLabel = data.yesLabel;
}
doNo() {
this.snackbarRef.dismiss();
}
doYes() {
this.snackbarRef.dismissWithAction();
}
}