From 35fbb0c1a008d621d12e389d656b3863ee55be3a Mon Sep 17 00:00:00 2001
From: Alex Karpov <karpov4you@gmail.com>
Date: Tue, 28 Jan 2025 14:21:57 +0200
Subject: [PATCH 1/2] NAS-133816: YAML is not available during edit when app is
 created

---
 .../custom-app-form.component.spec.ts         |  1 +
 .../custom-app-form.component.ts              | 32 ++++++++++++++++---
 2 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/src/app/pages/apps/components/custom-app-form/custom-app-form.component.spec.ts b/src/app/pages/apps/components/custom-app-form/custom-app-form.component.spec.ts
index e2d3e002a12..91873b9c6e8 100644
--- a/src/app/pages/apps/components/custom-app-form/custom-app-form.component.spec.ts
+++ b/src/app/pages/apps/components/custom-app-form/custom-app-form.component.spec.ts
@@ -76,6 +76,7 @@ describe('CustomAppFormComponent', () => {
         getAllApps: jest.fn(() => {
           return of([fakeApp]);
         }),
+        getApp: jest.fn(() => of([fakeApp])),
       }),
       mockProvider(ErrorHandlerService),
       mockProvider(DialogService, {
diff --git a/src/app/pages/apps/components/custom-app-form/custom-app-form.component.ts b/src/app/pages/apps/components/custom-app-form/custom-app-form.component.ts
index ca78fe90f99..8bdfc5d23ed 100644
--- a/src/app/pages/apps/components/custom-app-form/custom-app-form.component.ts
+++ b/src/app/pages/apps/components/custom-app-form/custom-app-form.component.ts
@@ -10,7 +10,7 @@ import { Router } from '@angular/router';
 import { FormBuilder } from '@ngneat/reactive-forms';
 import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
-import { map, of } from 'rxjs';
+import { filter, map, of } from 'rxjs';
 import { RequiresRolesDirective } from 'app/directives/requires-roles/requires-roles.directive';
 import { CodeEditorLanguage } from 'app/enums/code-editor-language.enum';
 import { Role } from 'app/enums/role.enum';
@@ -75,13 +75,16 @@ export class CustomAppFormComponent implements OnInit {
     this.slideInRef.requireConfirmationWhen(() => {
       return of(this.form.dirty);
     });
+
     this.existingApp = this.slideInRef.getData();
+
+    if (this.existingApp?.id) {
+      this.handleExistingApp();
+    }
   }
 
   ngOnInit(): void {
-    if (this.existingApp) {
-      this.setAppForEdit(this.existingApp);
-    } else {
+    if (!this.existingApp) {
       this.setNewApp();
     }
   }
@@ -149,4 +152,25 @@ export class CustomAppFormComponent implements OnInit {
       },
     });
   }
+
+  handleExistingApp(): void {
+    this.isLoading.set(true);
+
+    this.appService.getApp(this.existingApp.id).pipe(
+      filter((apps) => apps.length > 0),
+      untilDestroyed(this),
+    ).subscribe({
+      next: ([app]) => {
+        this.existingApp = app;
+        this.setAppForEdit(app);
+      },
+      error: (error: unknown) => {
+        this.errorHandler.showErrorModal(error);
+        this.slideInRef.close({ response: false, error });
+      },
+      complete: () => {
+        this.isLoading.set(false);
+      },
+    });
+  }
 }

From 24034161e99dac27e24b735c8b64440631af8ed5 Mon Sep 17 00:00:00 2001
From: Alex Karpov <karpov4you@gmail.com>
Date: Tue, 28 Jan 2025 14:27:24 +0200
Subject: [PATCH 2/2] NAS-133816: YAML is not available during edit when app is
 created

---
 .../custom-app-form/custom-app-form.component.html   |  4 ++--
 .../custom-app-form/custom-app-form.component.ts     | 12 +++++++-----
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/app/pages/apps/components/custom-app-form/custom-app-form.component.html b/src/app/pages/apps/components/custom-app-form/custom-app-form.component.html
index a50c13fde62..bd9fe58bdf5 100644
--- a/src/app/pages/apps/components/custom-app-form/custom-app-form.component.html
+++ b/src/app/pages/apps/components/custom-app-form/custom-app-form.component.html
@@ -1,6 +1,6 @@
 <ix-modal-header
   [requiredRoles]="requiredRoles"
-  [title]="isNew() ? ('Install via YAML' | translate) : ('Edit App YAML' | translate)"
+  [title]="isNew ? ('Install via YAML' | translate) : ('Edit App YAML' | translate)"
   [loading]="isLoading()"
 ></ix-modal-header>
 
@@ -15,7 +15,7 @@
         formControlName="release_name"
         [required]="true"
         [label]="'Name' | translate"
-        [readonly]="!isNew()"
+        [readonly]="!isNew"
       ></ix-input>
       <ix-code-editor
         formControlName="custom_compose_config_string"
diff --git a/src/app/pages/apps/components/custom-app-form/custom-app-form.component.ts b/src/app/pages/apps/components/custom-app-form/custom-app-form.component.ts
index 8bdfc5d23ed..54f8c4ed530 100644
--- a/src/app/pages/apps/components/custom-app-form/custom-app-form.component.ts
+++ b/src/app/pages/apps/components/custom-app-form/custom-app-form.component.ts
@@ -49,7 +49,6 @@ import { ErrorHandlerService } from 'app/services/error-handler.service';
   ],
 })
 export class CustomAppFormComponent implements OnInit {
-  protected isNew = signal(true);
   protected requiredRoles = [Role.AppsWrite];
   protected readonly CodeEditorLanguage = CodeEditorLanguage;
   protected form = this.fb.group({
@@ -57,6 +56,10 @@ export class CustomAppFormComponent implements OnInit {
     custom_compose_config_string: ['\n\n', Validators.required],
   });
 
+  get isNew(): boolean {
+    return !this.existingApp;
+  }
+
   protected existingApp: App | undefined;
 
   protected isLoading = signal(false);
@@ -94,7 +97,6 @@ export class CustomAppFormComponent implements OnInit {
   }
 
   private setAppForEdit(app: App): void {
-    this.isNew.set(false);
     this.form.patchValue({
       release_name: app.id,
       custom_compose_config_string: jsonToYaml(app.config),
@@ -124,14 +126,14 @@ export class CustomAppFormComponent implements OnInit {
       { custom_compose_config_string: data.custom_compose_config_string },
     ]);
 
-    const job$ = this.isNew() ? appCreate$ : appUpdate$;
+    const job$ = this.isNew ? appCreate$ : appUpdate$;
 
     this.dialogService.jobDialog(
       job$,
       {
         title: this.translate.instant('Custom App'),
         canMinimize: false,
-        description: this.isNew()
+        description: this.isNew
           ? this.translate.instant('Creating custom app')
           : this.translate.instant('Updating custom app'),
       },
@@ -153,7 +155,7 @@ export class CustomAppFormComponent implements OnInit {
     });
   }
 
-  handleExistingApp(): void {
+  private handleExistingApp(): void {
     this.isLoading.set(true);
 
     this.appService.getApp(this.existingApp.id).pipe(