fix: reduce the global blur implementation against per conversation level virtual background

Signed-off-by: DorraJaouad <dorra.jaoued7@gmail.com>

2 files changed, 15 insertions, 18 deletions

diff --git a/src/components/MediaSettings/MediaSettings.vue b/src/components/MediaSettings/MediaSettings.vue
index b2e59f64e7..1da0a9c8dd 100644
--- a/src/components/MediaSettings/MediaSettings.vue
+++ b/src/components/MediaSettings/MediaSettings.vue
@@ -436,20 +436,19 @@ export default {
 				this.audioOn = !BrowserStorage.getItem('audioDisabled_' + this.token)
 				this.videoOn = !BrowserStorage.getItem('videoDisabled_' + this.token)
 				this.silentCall = !!BrowserStorage.getItem('silentCall_' + this.token)
-				// Check main blur background setting
-				if (this.blurBackgroundEnabled) {
+
+				// Set virtual background depending on BrowserStorage's settings
+				if (BrowserStorage.getItem('virtualBackgroundEnabled_' + this.token) === 'true') {
+					if (BrowserStorage.getItem('virtualBackgroundType_' + this.token) === VIRTUAL_BACKGROUND.BACKGROUND_TYPE.BLUR) {
+						this.blurVirtualBackground()
+					} else if (BrowserStorage.getItem('virtualBackgroundType_' + this.token) === VIRTUAL_BACKGROUND.BACKGROUND_TYPE.IMAGE) {
+						this.setVirtualBackgroundImage(BrowserStorage.getItem('virtualBackgroundUrl_' + this.token))
+					}
+				} else if (this.blurBackgroundEnabled) {
+					// Fall back to global blur background setting
 					this.blurVirtualBackground()
 				} else {
-					// Set virtual background depending on BrowserStorage's settings
-					if (BrowserStorage.getItem('virtualBackgroundEnabled_' + this.token) === 'true') {
-						if (BrowserStorage.getItem('virtualBackgroundType_' + this.token) === VIRTUAL_BACKGROUND.BACKGROUND_TYPE.BLUR) {
-							this.blurVirtualBackground()
-						} else if (BrowserStorage.getItem('virtualBackgroundType_' + this.token) === VIRTUAL_BACKGROUND.BACKGROUND_TYPE.IMAGE) {
-							this.setVirtualBackgroundImage(BrowserStorage.getItem('virtualBackgroundUrl_' + this.token))
-						}
-					} else {
-						this.clearVirtualBackground()
-					}
+					this.clearVirtualBackground()
 				}
 
 				this.initializeDevices()
@@ -476,8 +475,9 @@ export default {
 
 		isInCall(value) {
 			if (value) {
+				const virtualBackgroundEnabled = BrowserStorage.getItem('virtualBackgroundEnabled_' + this.token) === 'true'
 				// Apply global blur background setting
-				if (this.blurBackgroundEnabled && !this.skipBlurBackgroundEnabled) {
+				if (this.blurBackgroundEnabled && !this.skipBlurBackgroundEnabled && !virtualBackgroundEnabled) {
 					this.blurBackground(true)
 				}
 			}
diff --git a/src/components/MediaSettings/VideoBackgroundEditor.vue b/src/components/MediaSettings/VideoBackgroundEditor.vue
index b9842b325b..a24bc38d46 100644
--- a/src/components/MediaSettings/VideoBackgroundEditor.vue
+++ b/src/components/MediaSettings/VideoBackgroundEditor.vue
@@ -256,11 +256,6 @@ export default {
 		},
 
 		loadBackground() {
-			// Set virtual background depending on main blur setting (in Talk settings)
-			if (this.settingsStore.blurBackgroundEnabled) {
-				this.selectedBackground = 'blur'
-				return
-			}
 			// Set virtual background depending on browser storage's settings
 			if (BrowserStorage.getItem('virtualBackgroundEnabled_' + this.token) === 'true') {
 				if (BrowserStorage.getItem('virtualBackgroundType_' + this.token) === VIRTUAL_BACKGROUND.BACKGROUND_TYPE.BLUR) {
@@ -270,6 +265,8 @@ export default {
 				} else {
 					this.selectedBackground = 'none'
 				}
+			} else if (this.settingsStore.blurBackgroundEnabled) {
+				this.selectedBackground = 'blur'
 			} else {
 				this.selectedBackground = 'none'
 			}