Merge pull request #5694 from nextcloud/backport/5288/stable21.1

[stable21.1] Inject the preloaded user status into the avatar component

4 files changed, 38 insertions, 8 deletions

diff --git a/package-lock.json b/package-lock.json
index dae5b0cd9..1b3ac0bbc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3259,9 +3259,9 @@
 			}
 		},
 		"@nextcloud/vue": {
-			"version": "3.5.4",
-			"resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-3.5.4.tgz",
-			"integrity": "sha512-Rsli88Osx1upQHGls/Lpxzn9x4m0T9EaXsMIIxmxggblxsSn4IVoPiqqYIrgP2+p2fDMYYmPup6WMQ7F0Qul4A==",
+			"version": "3.7.2",
+			"resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-3.7.2.tgz",
+			"integrity": "sha512-WR3HSdzdPI5kIUtU9k2Wc+4QKMshpfrvFrJ0POecimLOravibjfP9549y7McceB1bHg61tA/upNGQpZDdT+OjQ==",
 			"requires": {
 				"@nextcloud/auth": "^1.2.3",
 				"@nextcloud/axios": "^1.3.2",
@@ -3272,7 +3272,7 @@
 				"@nextcloud/l10n": "^1.2.3",
 				"@nextcloud/router": "^1.0.2",
 				"core-js": "^3.6.5",
-				"debounce": "1.2.0",
+				"debounce": "1.2.1",
 				"emoji-mart-vue-fast": "^7.0.7",
 				"escape-html": "^1.0.3",
 				"hammerjs": "^2.0.8",
@@ -3312,6 +3312,11 @@
 					"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.0.tgz",
 					"integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg=="
 				},
+				"debounce": {
+					"version": "1.2.1",
+					"resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.1.tgz",
+					"integrity": "sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug=="
+				},
 				"emoji-mart-vue-fast": {
 					"version": "7.0.7",
 					"resolved": "https://registry.npmjs.org/emoji-mart-vue-fast/-/emoji-mart-vue-fast-7.0.7.tgz",
@@ -3323,9 +3328,9 @@
 					}
 				},
 				"string-length": {
-					"version": "4.0.1",
-					"resolved": "https://registry.npmjs.org/string-length/-/string-length-4.0.1.tgz",
-					"integrity": "sha512-PKyXUd0LK0ePjSOnWn34V2uD6acUWev9uy0Ft05k0E8xRW+SKcA0F7eMr7h5xlzfn+4O3N+55rduYyet3Jk+jw==",
+					"version": "4.0.2",
+					"resolved": "https://registry.npmjs.org/string-length/-/string-length-4.0.2.tgz",
+					"integrity": "sha512-+l6rNN5fYHNhZZy41RXsYptCjA2Igmq4EG7kZAYFQI1E1VTXarr6ZPXBg6eq7Y6eK4FEhY6AJlyuFIb/v/S0VQ==",
 					"requires": {
 						"char-regex": "^1.0.2",
 						"strip-ansi": "^6.0.0"
diff --git a/package.json b/package.json
index ddf40cb4f..586c050f1 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,7 @@
 		"@nextcloud/moment": "^1.1.1",
 		"@nextcloud/paths": "^2.0.0",
 		"@nextcloud/router": "^1.2.0",
-		"@nextcloud/vue": "^3.5.4",
+		"@nextcloud/vue": "^3.7.2",
 		"@nextcloud/vue-dashboard": "^1.0.1",
 		"attachmediastream": "^2.1.0",
 		"color.js": "^1.2.0",
diff --git a/src/components/AvatarWrapper/AvatarWrapper.vue b/src/components/AvatarWrapper/AvatarWrapper.vue
index f6dad0537..89d0c9f98 100644
--- a/src/components/AvatarWrapper/AvatarWrapper.vue
+++ b/src/components/AvatarWrapper/AvatarWrapper.vue
@@ -34,6 +34,7 @@
 			:disable-menu="disableMenu"
 			:show-user-status="showUserStatus"
 			:show-user-status-compact="showUserStatusCompact"
+			:preloaded-user-status="preloadedUserStatus"
 			:size="size" />
 		<div v-else
 			class="guest"
@@ -92,6 +93,10 @@ export default {
 			type: Boolean,
 			default: true,
 		},
+		preloadedUserStatus: {
+			type: Object,
+			default: undefined,
+		},
 	},
 	computed: {
 		// Determines which icon is displayed
diff --git a/src/components/RightSidebar/Participants/ParticipantsList/Participant/Participant.vue b/src/components/RightSidebar/Participants/ParticipantsList/Participant/Participant.vue
index e8ff85bb0..645559a72 100644
--- a/src/components/RightSidebar/Participants/ParticipantsList/Participant/Participant.vue
+++ b/src/components/RightSidebar/Participants/ParticipantsList/Participant/Participant.vue
@@ -40,6 +40,7 @@
 			:size="44"
 			:show-user-status="showUserStatus && !isSearched"
 			:show-user-status-compact="false"
+			:preloaded-user-status="preloadedUserStatus"
 			:name="computedName"
 			:source="participant.source || participant.actorType"
 			:offline="isOffline" />
@@ -400,6 +401,25 @@ export default {
 		canBePromoted() {
 			return this.canModerate && !this.isModerator
 		},
+		preloadedUserStatus() {
+			if (this.participant.hasOwnProperty('statusMessage')) {
+				// We preloaded the status when via participants API
+				return {
+					status: this.participant.status || null,
+					message: this.participant.statusMessage || null,
+					icon: this.participant.statusIcon || null,
+				}
+			}
+			if (this.participant.hasOwnProperty('status')) {
+				// We preloaded the status when via search API
+				return {
+					status: this.participant.status.status || null,
+					message: this.participant.status.message || null,
+					icon: this.participant.status.icon || null,
+				}
+			}
+			return undefined
+		},
 	},
 
 	methods: {