config could take a while

frontend/projects/ui/src/app/modals/app-config/app-config.page.ts

@@ -1,5 +1,11 @@
 import { Component, Input, ViewChild } from '@angular/core'
-import { AlertController, ModalController, IonContent, LoadingController, IonicSafeString } from '@ionic/angular'
+import {
+  AlertController,
+  ModalController,
+  IonContent,
+  LoadingController,
+  IonicSafeString,
+} from '@ionic/angular'
 import { ApiService } from 'src/app/services/api/embassy-api.service'
 import { DependentInfo, isEmptyObject, isObject } from 'src/app/util/misc.util'
 import { wizardModal } from 'src/app/components/install-wizard/install-wizard.component'
@@ -7,9 +13,15 @@ import { WizardBaker } from 'src/app/components/install-wizard/prebaked-wizards'
 import { ConfigSpec } from 'src/app/pkg-config/config-types'
 import { PackageDataEntry } from 'src/app/services/patch-db/data-model'
 import { PatchDbService } from 'src/app/services/patch-db/patch-db.service'
-import { ErrorToastService, getErrorMessage } from 'src/app/services/error-toast.service'
+import {
+  ErrorToastService,
+  getErrorMessage,
+} from 'src/app/services/error-toast.service'
 import { FormGroup } from '@angular/forms'
-import { convertValuesRecursive, FormService } from 'src/app/services/form.service'
+import {
+  convertValuesRecursive,
+  FormService,
+} from 'src/app/services/form.service'
 import { compare, Operation, getValueByPointer } from 'fast-json-patch'
 
 @Component({
@@ -55,21 +67,33 @@ export class AppConfigPage {
       let patch: Operation[]
       if (this.dependentInfo) {
         this.loadingText = `Setting properties to accommodate ${this.dependentInfo.title}`
-        const { 'old-config': oc, 'new-config': nc, spec: s } = await this.embassyApi.dryConfigureDependency({ 'dependency-id': this.pkgId, 'dependent-id': this.dependentInfo.id })
+        const {
+          'old-config': oc,
+          'new-config': nc,
+          spec: s,
+        } = await this.embassyApi.dryConfigureDependency({
+          'dependency-id': this.pkgId,
+          'dependent-id': this.dependentInfo.id,
+        })
         oldConfig = oc
         newConfig = nc
         spec = s
         patch = compare(oldConfig, newConfig)
       } else {
         this.loadingText = 'Loading Config'
-        const { config: c, spec: s } = await this.embassyApi.getPackageConfig({ id: this.pkgId })
+        const { config: c, spec: s } = await this.embassyApi.getPackageConfig({
+          id: this.pkgId,
+        })
         oldConfig = c
         spec = s
       }
 
       this.original = oldConfig
       this.configSpec = spec
-      this.configForm = this.formService.createForm(spec, newConfig || oldConfig)
+      this.configForm = this.formService.createForm(
+        spec,
+        newConfig || oldConfig,
+      )
       this.configForm.markAllAsTouched()
 
       if (patch) {
@@ -105,13 +129,15 @@ export class AppConfigPage {
     convertValuesRecursive(this.configSpec, this.configForm)
 
     if (this.configForm.invalid) {
-      document.getElementsByClassName('validation-error')[0].parentElement.parentElement.scrollIntoView({ behavior: 'smooth' })
+      document
+        .getElementsByClassName('validation-error')[0]
+        .parentElement.parentElement.scrollIntoView({ behavior: 'smooth' })
       return
     }
 
     const loader = await this.loadingCtrl.create({
       spinner: 'lines',
-      message: `Saving config...`,
+      message: `Saving config. This could take a while...`,
       cssClass: 'loader',
     })
     await loader.present()
@@ -161,7 +187,9 @@ export class AppConfigPage {
           message = `Removed ${this.getOldValue(op.path)}`
           break
         case 'replace':
-          message = `Changed from ${this.getOldValue(op.path)} to ${this.getNewValue(op.value)}`
+          message = `Changed from ${this.getOldValue(
+            op.path,
+          )} to ${this.getNewValue(op.value)}`
           break
         default:
           message = `Unknown operation`
@@ -169,7 +197,8 @@ export class AppConfigPage {
 
       let displayPath: string
 
-      const arrPath = op.path.substring(1)
+      const arrPath = op.path
+        .substring(1)
         .split('/')
         .map(node => {
           const num = Number(node)
@@ -209,7 +238,8 @@ export class AppConfigPage {
 
   private markDirty(patch: Operation[]) {
     patch.forEach(op => {
-      const arrPath = op.path.substring(1)
+      const arrPath = op.path
+        .substring(1)
         .split('/')
         .map(node => {
           const num = Number(node)
@@ -246,4 +276,3 @@ export class AppConfigPage {
     await alert.present()
   }
 }
-