fix(userStatus): migrate util to Typescript

Signed-off-by: Maksim Sukharev <[email protected]>

src/components/BreakoutRoomsEditor/SelectableParticipant.vue

@@ -15,6 +15,7 @@
 			:source="participant.source || participant.actorType"
 			disable-menu
 			disable-tooltip
+			:preloaded-user-status="preloadedUserStatus"
 			show-user-status />
 
 		<span class="selectable-participant__content">
@@ -36,7 +37,7 @@ import IconCheck from 'vue-material-design-icons/Check.vue'
 
 import AvatarWrapper from '../AvatarWrapper/AvatarWrapper.vue'
 
-import { getStatusMessage } from '../../utils/userStatus.js'
+import { getStatusMessage } from '../../utils/userStatus.ts'
 
 export default {
 	name: 'SelectableParticipant',
@@ -73,8 +74,25 @@ export default {
 			},
 		},
 
+		preloadedUserStatus() {
+			if ('statusMessage' in this.participant) {
+				// We preloaded the status when via participants API
+				return {
+					status: this.participant.status || '',
+					message: this.participant.statusMessage || null,
+					icon: this.participant.statusIcon || null,
+					clearAt: this.participant.statusClearAt || null,
+				}
+			} else if ('status' in this.participant && typeof this.participant.status === 'object') {
+				// We preloaded the status when via search API
+				return this.participant.status
+			} else {
+				return undefined
+			}
+		},
+
 		participantStatus() {
-			return getStatusMessage(this.participant)
+			return getStatusMessage(this.preloadedUserStatus)
 		},
 	},
 }

src/components/RightSidebar/Participants/Participant.vue

@@ -373,7 +373,7 @@ import {
 import { hasTalkFeature } from '../../../services/CapabilitiesManager.ts'
 import { formattedTime } from '../../../utils/formattedTime.ts'
 import { readableNumber } from '../../../utils/readableNumber.ts'
-import { getStatusMessage } from '../../../utils/userStatus.js'
+import { getStatusMessage } from '../../../utils/userStatus.ts'
 
 export default {
 	name: 'Participant',
@@ -553,7 +553,7 @@ export default {
 					: '💬 ' + t('spreed', '{time} talking time', { time: formattedTime(this.timeSpeaking, true) })
 			}
 
-			return getStatusMessage(this.participant)
+			return getStatusMessage(this.preloadedUserStatus)
 		},
 
 		statusTitle() {
@@ -844,17 +844,19 @@ export default {
 			if (Object.prototype.hasOwnProperty.call(this.participant, 'statusMessage')) {
 				// We preloaded the status when via participants API
 				return {
-					status: this.participant.status || null,
+					status: this.participant.status || '',
 					message: this.participant.statusMessage || null,
 					icon: this.participant.statusIcon || null,
+					clearAt: this.participant.statusClearAt || null,
 				}
 			}
 			if (Object.prototype.hasOwnProperty.call(this.participant, 'status')) {
 				// We preloaded the status when via search API
 				return {
-					status: this.participant.status.status || null,
+					status: this.participant.status.status || '',
 					message: this.participant.status.message || null,
 					icon: this.participant.status.icon || null,
+					clearAt: this.participant.status.clearAt || null,
 				}
 			}
 			return undefined

src/components/TopBar/TopBar.vue

@@ -133,7 +133,7 @@ import { AVATAR, CONVERSATION } from '../../constants.js'
 import BrowserStorage from '../../services/BrowserStorage.js'
 import { getTalkConfig } from '../../services/CapabilitiesManager.ts'
 import { useChatExtrasStore } from '../../stores/chatExtras.js'
-import { getStatusMessage } from '../../utils/userStatus.js'
+import { getStatusMessage } from '../../utils/userStatus.ts'
 import { localCallParticipantModel, localMediaModel } from '../../utils/webrtc/index.js'
 
 export default {
@@ -220,7 +220,12 @@ export default {
 		},
 
 		statusMessage() {
-			return getStatusMessage(this.conversation)
+			return getStatusMessage({
+				status: this.conversation.status || '',
+				message: this.conversation.statusMessage || null,
+				icon: this.conversation.statusIcon || null,
+				clearAt: this.conversation.statusClearAt || null,
+			})
 		},
 
 		renderedDescription() {

src/composables/useSortParticipants.js

@@ -8,7 +8,7 @@ import { computed } from 'vue'
 
 import { useStore } from './useStore.js'
 import { ATTENDEE, PARTICIPANT } from '../constants.js'
-import { isDoNotDisturb } from '../utils/userStatus.js'
+import { isDoNotDisturb } from '../utils/userStatus.ts'
 
 const MODERATOR_TYPES = [PARTICIPANT.TYPE.OWNER, PARTICIPANT.TYPE.MODERATOR, PARTICIPANT.TYPE.GUEST_MODERATOR]
 

src/types/index.ts

@@ -55,7 +55,22 @@ export type JoinRoomFullResponse = {
 }
 
 // Participants
+export type ParticipantStatus = {
+	status?: string,
+	message?: string | null,
+	icon?: string | null,
+	clearAt?: number | null,
+}
 export type Participant = components['schemas']['Participant']
+export type ParticipantSearchResult = {
+	id: string,
+	label: string,
+	icon: string,
+	source: string,
+	subline: string,
+	shareWithDisplayNameUnique: string,
+	status: ParticipantStatus | '',
+}
 
 // Chats
 export type Mention = RichObject<'server'|'call-type'|'icon-url'>

src/utils/userStatus.ts

@@ -0,0 +1,45 @@
+/**
+ * SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+import { t } from '@nextcloud/l10n'
+
+import type {
+	Conversation,
+	Participant,
+	ParticipantSearchResult,
+	ParticipantStatus,
+} from '../types/index.ts'
+
+/**
+ * Generate full status message for user according to its status data
+ *
+ * @param userData user data (from conversation, participant, search result)
+ */
+export function getStatusMessage(userData: ParticipantStatus): string {
+	if (!userData) {
+		return ''
+	}
+
+	let status = userData.icon ?? ''
+
+	if (userData.message) {
+		status += ' ' + userData.message
+	} else if (userData.status === 'dnd') {
+		status += ' ' + t('spreed', 'Do not disturb')
+	} else if (userData.status === 'away') {
+		status += ' ' + t('spreed', 'Away')
+	}
+
+	return status
+}
+
+/**
+ * Check if current status is "Do not disturb"
+ *
+ * @param userData user data
+ */
+export function isDoNotDisturb(userData: Conversation | Participant | ParticipantSearchResult): boolean {
+	return userData?.status === 'dnd'
+}