From f933baf8ba90db25be98450e6b6fc6a4a239b33d Mon Sep 17 00:00:00 2001 From: dafik Date: Wed, 22 Nov 2023 00:31:28 +0100 Subject: [PATCH] editor save refactor --- .../component/edit/edit.component.html | 5 +- .../component/edit/edit.component.ts | 265 ++++++++++-------- .../config-editor/config-editor.module.ts | 8 +- config/editor/src/app/version.ts | 2 +- .../environments/environment.development.ts | 2 +- 5 files changed, 159 insertions(+), 123 deletions(-) diff --git a/config/editor/src/app/modules/config-editor/component/edit/edit.component.html b/config/editor/src/app/modules/config-editor/component/edit/edit.component.html index cd83900..8c77828 100644 --- a/config/editor/src/app/modules/config-editor/component/edit/edit.component.html +++ b/config/editor/src/app/modules/config-editor/component/edit/edit.component.html @@ -2,8 +2,9 @@ - - + + diff --git a/config/editor/src/app/modules/config-editor/component/edit/edit.component.ts b/config/editor/src/app/modules/config-editor/component/edit/edit.component.ts index d360b66..c088c0d 100644 --- a/config/editor/src/app/modules/config-editor/component/edit/edit.component.ts +++ b/config/editor/src/app/modules/config-editor/component/edit/edit.component.ts @@ -11,159 +11,190 @@ import {LogLevel} from "../../../../definition/enums/LogLevel"; import {saveAs} from "file-saver-es"; import {environment} from "../../../../../environments/environment"; import {UrlHelper} from "../../../../shared/url-helper"; +import {MatDialog} from "@angular/material/dialog"; +import {SaveCommand, SaveDialogComponent} from "../save-dialog/save-dialog.component"; +import {catchError, map, Observable, of, switchMap} from "rxjs"; @Component({ - selector: 'app-edit', - templateUrl: './edit.component.html', - styleUrls: ['./edit.component.scss'] + selector: 'app-edit', + templateUrl: './edit.component.html', + styleUrls: ['./edit.component.scss'] }) export class EditComponent implements OnInit { - @ViewChild(MatAccordion) accordion: MatAccordion = {} as MatAccordion - - public appConfig: AppConfig; - - constructor(private route: ActivatedRoute, - private router: Router, - private es: ExtensionsService, - private httpClient: HttpClient, - private yamlPipe: YamlPipe, - private jsonPipe: JsonDPipe, - readonly snackBar: MatSnackBar - ) { - if (es.getConfig()) { - this.appConfig = es.getConfig() - } else { - this.appConfig = new AppConfig(); - } - } - - getConfig() { - return this.es.getConfig(); - } - - ngOnInit() { - this.route.queryParams - .subscribe((params) => { - if (isConfig(params)) { - if (this.es.getConfig() == null) { - this.es.getCurrentConfig().subscribe(value => { - this.es.setConfig(value); - this.appConfig = value; - }) - } - - } else if (isCreator(params)) { - this.appConfig.extensionBoards = { - vendor: params.v, - inputBoard: params.i, - outputBoard: params.o - } - this.es.setConfig(this.appConfig); - } else if (isSaved(params)) { - this.es.loadConfig(params.uuid) - } - let config = this.es.getConfig(); - if (config) { - this.appConfig = config + @ViewChild(MatAccordion) accordion: MatAccordion = {} as MatAccordion + + public appConfig: AppConfig; + + constructor(private route: ActivatedRoute, + private router: Router, + private es: ExtensionsService, + private httpClient: HttpClient, + private yamlPipe: YamlPipe, + private jsonPipe: JsonDPipe, + readonly snackBar: MatSnackBar, + public dialog: MatDialog + ) { + if (es.getConfig()) { + this.appConfig = es.getConfig() + } else { + this.appConfig = new AppConfig(); } - }); - } - - uploadToCache() { - if (environment.webOnly!) { - this.webOnly(); - return } - const jsonConfig = this.jsonPipe.transform(this.es.getConfig()) + getConfig() { + return this.es.getConfig(); + } - let fileBits: BlobPart[] = [jsonConfig] - let fileName: string = "cache"; + ngOnInit() { + this.route.queryParams + .subscribe((params) => { + if (isConfig(params)) { + if (this.es.getConfig() == null) { + this.es.getCurrentConfig().subscribe(value => { + this.es.setConfig(value); + this.appConfig = value; + }) + } + + } else if (isCreator(params)) { + this.appConfig.extensionBoards = { + vendor: params.v, + inputBoard: params.i, + outputBoard: params.o + } + this.es.setConfig(this.appConfig); + } else if (isSaved(params)) { + this.es.loadConfig(params.uuid) + } + let config = this.es.getConfig(); + if (config) { + this.appConfig = config + } + }); + } - const fileToUpload = new File(fileBits, fileName); + save() { + const dialogRef = this.dialog.open(SaveDialogComponent); + dialogRef.afterClosed().pipe( + switchMap(result => { + let booleanObservable: Observable; + if (result?.target == "cache") { + booleanObservable = this.uploadToCache(); + } else { + booleanObservable = this.uploadToArgument() + } + return booleanObservable.pipe(map(() => result)) + }), + switchMap((result) => { + let booleanObservable: Observable; + if (result && result.reload) { + booleanObservable = this.httpClient + .get(UrlHelper.getApiUrl() + "reload") + .pipe( + map(() => true), + catchError(() => of(false)) + ); + } else { + booleanObservable = of(true) + } + return booleanObservable.pipe(map(() => result)) + })) + .subscribe({ + next: result => { + if (result && result.showLogs) { + this.router.navigate(["/logs"]) + } + }, + error: err => { + this.snackBar.open(err.error) + } + }); + } - const endpoint = UrlHelper.getApiUrl() + 'write/cache'; - const formData: FormData = new FormData(); - formData.append('cache', fileToUpload, fileToUpload.name); - return this.httpClient - .post(endpoint, formData) - .subscribe({ - next: value => { - this.router.navigate(["/settings"]) - }, - error: err => { - this.snackBar.open(err.error) + uploadToCache() { + if (environment.webOnly!) { + this.webOnly(); + return of(true) } - }); - } - uploadToArgument() { - if (environment.webOnly!) { - this.webOnly(); - return - } + const jsonConfig = this.jsonPipe.transform(this.es.getConfig()) - const jsonConfig = this.jsonPipe.transform(this.es.getConfig()) + let fileBits: BlobPart[] = [jsonConfig] + let fileName: string = "cache"; - let fileBits: BlobPart[] = [jsonConfig] - let fileName: string = "cache"; + const fileToUpload = new File(fileBits, fileName); - const fileToUpload = new File(fileBits, fileName); + const endpoint = UrlHelper.getApiUrl() + 'write/cache'; + const formData: FormData = new FormData(); + formData.append('cache', fileToUpload, fileToUpload.name); + return this.httpClient + .post(endpoint, formData, {observe: "response"}) + .pipe(map(() => true), catchError(() => of(false))) + + } - const endpoint = UrlHelper.getApiUrl() + 'write/config'; - const formData: FormData = new FormData(); - formData.append('cache', fileToUpload, fileToUpload.name); - return this.httpClient - .post(endpoint, formData) - .subscribe({ - next: value => { - this.router.navigate(["/settings"]) - }, - error: err => { - this.snackBar.open(err.error) + uploadToArgument() { + if (environment.webOnly!) { + this.webOnly(); + return of(true); } - }); - } - addLog($event: boolean) { - this.appConfig.logger = { - logs: new Map(), - default: LogLevel.INFO, + const jsonConfig = this.jsonPipe.transform(this.es.getConfig()) + + let fileBits: BlobPart[] = [jsonConfig] + let fileName: string = "config"; + + const fileToUpload = new File(fileBits, fileName); + + const endpoint = UrlHelper.getApiUrl() + 'write/config'; + const formData: FormData = new FormData(); + formData.append('config', fileToUpload, fileToUpload.name); + return this.httpClient + .post(endpoint, formData) + .pipe( + map(() => true), + catchError(() => of(false))) + } + + addLog($event: boolean) { + this.appConfig.logger = { + logs: new Map(), + default: LogLevel.INFO, + } } - } - downloadYaml() { - const data = this.yamlPipe.transform(this.getConfig()); - const theFile = new Blob([data], {type: "text/yaml"}); - saveAs(theFile, "config.yaml") - } + downloadYaml() { + const data = this.yamlPipe.transform(this.getConfig()); + const theFile = new Blob([data], {type: "text/yaml"}); + saveAs(theFile, "config.yaml") + } - webOnly() { - this.snackBar.open("Log viewer unavailable in webOnly preview", "Ok, i understand", {panelClass: 'error'}) - } + webOnly() { + this.snackBar.open("Log viewer unavailable in webOnly preview", "Ok, i understand", {panelClass: 'error'}) + } } interface EditorParamsCreator { - v: string; - i: string; - o: string; + v: string; + i: string; + o: string; } interface EditorParamsConfig { - config: "current" + config: "current" } interface EditorParamsSaved { - uuid: string; + uuid: string; } const isCreator = function (object: any): object is EditorParamsCreator { - return 'v' in object; + return 'v' in object; } const isConfig = function (object: any): object is EditorParamsConfig { - return 'config' in object; + return 'config' in object; } const isSaved = function (object: any): object is EditorParamsSaved { - return 'uuid' in object; + return 'uuid' in object; } diff --git a/config/editor/src/app/modules/config-editor/config-editor.module.ts b/config/editor/src/app/modules/config-editor/config-editor.module.ts index 6318e43..a5b60ba 100644 --- a/config/editor/src/app/modules/config-editor/config-editor.module.ts +++ b/config/editor/src/app/modules/config-editor/config-editor.module.ts @@ -62,6 +62,8 @@ import { LogListComponent } from './component/log/log-list/log-list.component'; import { LogAddDefaultComponent } from './component/log/log-add-default/log-add-default.component'; import { LogAddWriterComponent } from './component/log/log-add-writer/log-add-writer.component'; import { LogAddPackageComponent } from './component/log/log-add-package/log-add-package.component'; +import { SaveDialogComponent } from './component/save-dialog/save-dialog.component'; +import {MatSlideToggleModule} from "@angular/material/slide-toggle"; @NgModule({ @@ -109,7 +111,8 @@ import { LogAddPackageComponent } from './component/log/log-add-package/log-add- LogListComponent, LogAddDefaultComponent, LogAddWriterComponent, - LogAddPackageComponent + LogAddPackageComponent, + SaveDialogComponent ], imports: [ CommonModule, @@ -127,7 +130,8 @@ import { LogAddPackageComponent } from './component/log/log-add-package/log-add- MatDialogModule, MatCheckboxModule, MatRadioModule, - MatCardModule + MatCardModule, + MatSlideToggleModule ], providers: [YamlPipe, JsonDPipe] }) diff --git a/config/editor/src/app/version.ts b/config/editor/src/app/version.ts index d7b1e07..01d220f 100644 --- a/config/editor/src/app/version.ts +++ b/config/editor/src/app/version.ts @@ -1 +1 @@ -export const VERSION="0.0.5" +export const VERSION="0.0.7" diff --git a/config/editor/src/environments/environment.development.ts b/config/editor/src/environments/environment.development.ts index e97aed6..ff3fece 100644 --- a/config/editor/src/environments/environment.development.ts +++ b/config/editor/src/environments/environment.development.ts @@ -1,5 +1,5 @@ import {EnvroinmentDef} from "src/app/envroinment.def"; export const environment: EnvroinmentDef = { - useHash: false + useHash: true };