Fix change detection for plugin fields

client/src/app/+videos-publish-manage/shared-manage/common/video-edit.model.ts

@@ -163,13 +163,15 @@ export class VideoEdit {
   }
 
   private saveStore: {
-    common?: CommonUpdate
+    common?: Omit<CommonUpdate, 'pluginData' | 'previewfile'>
-    previewfile?: {
+    previewfile?: { size: number }
-      size: number
+
-    }
     live?: LiveVideoUpdate
+
+    pluginData?: any
     pluginDefaults?: Record<string, string | boolean>
   } = {}
+  private checkPluginChanges = false
 
   private serverConfig: HTMLServerConfig
 
@@ -338,12 +340,12 @@ export class VideoEdit {
     this.common = buildObj()
 
     if (saveInStore) {
-      this.saveStore.common = buildObj()
+      const obj = buildObj()
+      this.saveStore.common = omit(obj, [ 'pluginData', 'previewfile' ])
 
       // Apply plugin defaults so we correctly detect changes
-      if (this.saveStore.pluginDefaults) {
+      const pluginDefaults = this.saveStore.pluginDefaults || {}
-        this.saveStore.common.pluginData = { ...this.saveStore.pluginDefaults, ...this.saveStore.common.pluginData }
+      this.saveStore.pluginData = { ...pluginDefaults, ...obj.pluginData }
-      }
     }
 
     // ---------------------------------------------------------------------------
@@ -365,8 +367,8 @@ export class VideoEdit {
   loadPluginDataDefaults (pluginDefaults: Record<string, string | boolean>) {
     this.saveStore.pluginDefaults = pluginDefaults
 
-    if (this.saveStore.common?.pluginData) {
+    if (this.saveStore?.pluginData) {
-      this.saveStore.common.pluginData = { ...this.saveStore.pluginDefaults, ...this.saveStore.common.pluginData }
+      this.saveStore.pluginData = { ...this.saveStore.pluginDefaults, ...this.saveStore.pluginData }
     }
   }
 
@@ -772,7 +774,7 @@ export class VideoEdit {
     if (this.isNewVideo) return true
     if (!this.saveStore.common) return true
 
-    let changes = !this.areSameObjects(omit(this.common, [ 'previewfile' ]), omit(this.saveStore.common, [ 'previewfile' ]))
+    let changes = !this.areSameObjects(omit(this.common, [ 'previewfile', 'pluginData' ]), this.saveStore.common)
 
     // Compare preview file
     if (changes !== true && (this.common.previewfile || this.saveStore.previewfile)) {
@@ -789,6 +791,22 @@ export class VideoEdit {
     return changes
   }
 
+  hasPluginDataChanges () {
+    if (!this.checkPluginChanges) return false
+    if (!this.saveStore.pluginData) return true
+
+    const current = this.common.pluginData
+    const changes = !this.areSameObjects(current, this.saveStore.pluginData)
+
+    debugLogger('Check if has plugin data changes', {
+      changes,
+      pluginData: current,
+      savePluginData: this.saveStore.pluginData
+    })
+
+    return changes
+  }
+
   hasCaptionChanges () {
     const changes = this.captions.some(caption => !!caption.action)
 
@@ -840,7 +858,8 @@ export class VideoEdit {
       this.hasReplaceFile() ||
       this.hasStudioTasks() ||
       this.hasChaptersChanges() ||
-      this.hasCommonChanges()
+      this.hasCommonChanges() ||
+      this.hasPluginDataChanges()
   }
 
   // ---------------------------------------------------------------------------
@@ -904,4 +923,12 @@ export class VideoEdit {
   onSave () {
     this.isNewVideo = false
   }
+
+  enableCheckPluginChanges () {
+    this.checkPluginChanges = true
+  }
+
+  disableCheckPluginChanges () {
+    this.checkPluginChanges = false
+  }
 }

client/src/app/+videos-publish-manage/shared-manage/main-info/video-main-info.component.ts

@@ -226,6 +226,7 @@ export class VideoMainInfoComponent implements OnInit, OnDestroy {
 
     this.updatedSub?.unsubscribe()
     this.manageController.unregisterSaveHook()
+    this.videoEdit.disableCheckPluginChanges()
   }
 
   // ---------------------------------------------------------------------------
@@ -372,6 +373,7 @@ export class VideoMainInfoComponent implements OnInit, OnDestroy {
     )
 
     this.videoEdit.loadPluginDataDefaults(pluginDefaults)
+    this.videoEdit.enableCheckPluginChanges()
 
     this.form.addControl('pluginData', this.pluginDataFormGroup)
     this.formErrors['pluginData'] = pluginFormErrors