diff --git a/src/__mocks__/capabilities.ts b/src/__mocks__/capabilities.ts index 43c9da15a1..8c5d6dd725 100644 --- a/src/__mocks__/capabilities.ts +++ b/src/__mocks__/capabilities.ts @@ -100,6 +100,7 @@ export const mockedCapabilities: Capabilities = { 'mutual-calendar-events', 'upcoming-reminders', 'sensitive-conversations', + 'threads', // Conditional features 'message-expiration', 'reactions', diff --git a/src/components/RightSidebar/RightSidebar.vue b/src/components/RightSidebar/RightSidebar.vue index 39442f2377..64aacf2e39 100644 --- a/src/components/RightSidebar/RightSidebar.vue +++ b/src/components/RightSidebar/RightSidebar.vue @@ -25,21 +25,28 @@ + @update:state="handleUpdateState" /> - + @close="handleUpdateState('default')" /> + + + - + @@ -140,6 +147,7 @@ import RightSidebarContent from './RightSidebarContent.vue' import SearchMessagesTab from './SearchMessages/SearchMessagesTab.vue' import SharedItemsTab from './SharedItems/SharedItemsTab.vue' import SipSettings from './SipSettings.vue' +import ThreadsTab from './Threads/ThreadsTab.vue' import { useGetParticipants } from '../../composables/useGetParticipants.ts' import { useGetToken } from '../../composables/useGetToken.ts' import { CONVERSATION, PARTICIPANT, WEBINAR } from '../../constants.ts' @@ -167,6 +175,7 @@ export default { SearchMessagesTab, SetGuestUsername, SharedItemsTab, + ThreadsTab, SipSettings, // Icons IconAccountMultiple, @@ -250,7 +259,7 @@ export default { return { contactsLoading: false, unreadNotificationHandle: null, - showSearchMessagesTab: false, + contentState: 'default', } }, @@ -427,6 +436,7 @@ export default { isInCall(newValue) { if (newValue) { // Set 'chat' tab as active, and switch to it if sidebar is open + this.contentState = 'default' this.activeTab = 'chat' return } @@ -506,11 +516,13 @@ export default { } }, - handleShowSearch(value) { - this.showSearchMessagesTab = value + handleUpdateState(value) { + this.contentState = value // FIXME upstream: NcAppSidebar should emit update:active - if (value) { + if (value === 'search') { this.activeTab = 'search-messages' + } else if (value === 'threads') { + this.activeTab = 'threads' } else { this.activeTab = this.isInCall ? 'chat' : 'participants' } diff --git a/src/components/RightSidebar/RightSidebarContent.vue b/src/components/RightSidebar/RightSidebarContent.vue index f81d51dd92..7fb311079c 100644 --- a/src/components/RightSidebar/RightSidebarContent.vue +++ b/src/components/RightSidebar/RightSidebarContent.vue @@ -43,14 +43,16 @@ type MutualEvent = { color: string } +type SidebarContentState = 'default' | 'search' | 'threads' + const props = defineProps<{ isUser: boolean - state: 'default' | 'search' + state: SidebarContentState mode: 'compact' | 'preview' | 'full' }>() const emit = defineEmits<{ - (event: 'update:search', value: boolean): void + (event: 'update:state', value: SidebarContentState): void (event: 'update:mode', value: 'compact' | 'preview' | 'full'): void }>() @@ -83,6 +85,11 @@ const sidebarTitle = computed(() => { escape: false, sanitize: false, }) + } else if (props.state === 'threads') { + return t('spreed', 'Threads in {name}', { name: conversation.value.displayName }, { + escape: false, + sanitize: false, + }) } return conversation.value.displayName }) @@ -202,7 +209,7 @@ function handleHeaderClick() { + @click="emit('update:state', 'search')"> @@ -262,12 +269,12 @@ function handleHeaderClick() { -