diff options
author | Grigorii Shartsev <grigorii.shartsev@nextcloud.com> | 2023-05-03 17:59:25 +0200 |
---|---|---|
committer | Grigorii Shartsev <grigorii.shartsev@nextcloud.com> | 2023-05-03 19:42:55 +0200 |
commit | c9a8dfe0363feea8612f01f65a5692386b2d4a5d (patch) | |
tree | daf53def165593e1edabf1c59750ef0c67d40b9d | |
parent | 4890b3a6f79eb41b2f822999565fd60dd608af51 (diff) |
refactor(frontend): make openViewer and isInCall mixins composables
Signed-off-by: Grigorii Shartsev <grigorii.shartsev@nextcloud.com>
20 files changed, 262 insertions, 179 deletions
diff --git a/src/App.vue b/src/App.vue index 68dbbeeea..0ca46cf7a 100644 --- a/src/App.vue +++ b/src/App.vue @@ -56,9 +56,9 @@ import RightSidebar from './components/RightSidebar/RightSidebar.vue' import SettingsDialog from './components/SettingsDialog/SettingsDialog.vue' import UploadEditor from './components/UploadEditor.vue' +import { useIsInCall } from './composables/useIsInCall.js' import { CONVERSATION, PARTICIPANT } from './constants.js' import browserCheck from './mixins/browserCheck.js' -import isInCall from './mixins/isInCall.js' import participant from './mixins/participant.js' import sessionIssueHandler from './mixins/sessionIssueHandler.js' import talkHashCheck from './mixins/talkHashCheck.js' @@ -89,11 +89,15 @@ export default { browserCheck, talkHashCheck, sessionIssueHandler, - isInCall, participant, isMobile, ], + setup() { + const isInCall = useIsInCall() + return { isInCall } + }, + data() { return { savedLastMessageMap: {}, diff --git a/src/FilesSidebarCallViewApp.vue b/src/FilesSidebarCallViewApp.vue index 8089030fc..042319a20 100644 --- a/src/FilesSidebarCallViewApp.vue +++ b/src/FilesSidebarCallViewApp.vue @@ -38,7 +38,6 @@ import PreventUnload from 'vue-prevent-unload' import CallView from './components/CallView/CallView.vue' import TopBar from './components/TopBar/TopBar.vue' -import isInCall from './mixins/isInCall.js' import participant from './mixins/participant.js' import sessionIssueHandler from './mixins/sessionIssueHandler.js' import talkHashCheck from './mixins/talkHashCheck.js' @@ -46,6 +45,8 @@ import talkHashCheck from './mixins/talkHashCheck.js' // Styles import '@nextcloud/dialogs/dist/index.css' +import { useIsInCall } from './composables/useIsInCall.js' + export default { name: 'FilesSidebarCallViewApp', @@ -58,11 +59,14 @@ export default { mixins: [ sessionIssueHandler, - isInCall, participant, talkHashCheck, ], + setup() { + return { isInCall: useIsInCall() } + }, + data() { return { // Needed for reactivity. diff --git a/src/PublicShareSidebar.vue b/src/PublicShareSidebar.vue index ffaedab5e..8f4abea8c 100644 --- a/src/PublicShareSidebar.vue +++ b/src/PublicShareSidebar.vue @@ -66,8 +66,8 @@ import MediaSettings from './components/MediaSettings/MediaSettings.vue' import CallButton from './components/TopBar/CallButton.vue' import TopBar from './components/TopBar/TopBar.vue' +import { useIsInCall } from './composables/useIsInCall.js' import browserCheck from './mixins/browserCheck.js' -import isInCall from './mixins/isInCall.js' import participant from './mixins/participant.js' import sessionIssueHandler from './mixins/sessionIssueHandler.js' import talkHashCheck from './mixins/talkHashCheck.js' @@ -98,7 +98,6 @@ export default { mixins: [ browserCheck, sessionIssueHandler, - isInCall, participant, talkHashCheck, ], @@ -115,6 +114,11 @@ export default { }, }, + setup() { + const isInCall = useIsInCall() + return { isInCall } + }, + data() { return { fetchCurrentConversationIntervalId: null, diff --git a/src/components/CallView/shared/LocalMediaControls.vue b/src/components/CallView/shared/LocalMediaControls.vue index 3cd0f30e1..db95a59ad 100644 --- a/src/components/CallView/shared/LocalMediaControls.vue +++ b/src/components/CallView/shared/LocalMediaControls.vue @@ -157,8 +157,8 @@ import PresentToAll from '../../missingMaterialDesignIcons/PresentToAll.vue' import LocalAudioControlButton from './LocalAudioControlButton.vue' import LocalVideoControlButton from './LocalVideoControlButton.vue' +import { useIsInCall } from '../../../composables/useIsInCall.js' import { PARTICIPANT } from '../../../constants.js' -import isInCall from '../../../mixins/isInCall.js' import { CONNECTION_QUALITY } from '../../../utils/webrtc/analyzers/PeerConnectionAnalyzer.js' import { callAnalyzer } from '../../../utils/webrtc/index.js' import SpeakingWhileMutedWarner from '../../../utils/webrtc/SpeakingWhileMutedWarner.js' @@ -186,10 +186,6 @@ export default { PresentToAll, }, - mixins: [ - isInCall, - ], - props: { token: { type: String, @@ -221,6 +217,11 @@ export default { }, }, + setup() { + const isInCall = useIsInCall() + return { isInCall } + }, + data() { return { speakingWhileMutedNotification: null, diff --git a/src/components/LeftSidebar/NewGroupConversation/NewGroupConversation.vue b/src/components/LeftSidebar/NewGroupConversation/NewGroupConversation.vue index 8c0cfadd1..856f89418 100644 --- a/src/components/LeftSidebar/NewGroupConversation/NewGroupConversation.vue +++ b/src/components/LeftSidebar/NewGroupConversation/NewGroupConversation.vue @@ -136,8 +136,8 @@ import Confirmation from './Confirmation/Confirmation.vue' import SetContacts from './SetContacts/SetContacts.vue' import SetConversationName from './SetConversationName/SetConversationName.vue' +import { useIsInCall } from '../../../composables/useIsInCall.js' import { CONVERSATION } from '../../../constants.js' -import isInCall from '../../../mixins/isInCall.js' import participant from '../../../mixins/participant.js' import { createPublicConversation, @@ -167,10 +167,12 @@ export default { Plus, }, - mixins: [ - isInCall, - participant, - ], + mixins: [participant], + + setup() { + const isInCall = useIsInCall() + return { isInCall } + }, data() { return { diff --git a/src/components/MediaSettings/MediaSettings.vue b/src/components/MediaSettings/MediaSettings.vue index 183368880..071f3e00a 100644 --- a/src/components/MediaSettings/MediaSettings.vue +++ b/src/components/MediaSettings/MediaSettings.vue @@ -202,9 +202,9 @@ import CallButton from '../TopBar/CallButton.vue' import VolumeIndicator from '../VolumeIndicator/VolumeIndicator.vue' import VideoBackgroundEditor from './VideoBackgroundEditor.vue' +import { useIsInCall } from '../../composables/useIsInCall.js' import { CALL, VIRTUAL_BACKGROUND } from '../../constants.js' import { devices } from '../../mixins/devices.js' -import isInCall from '../../mixins/isInCall.js' import isInLobby from '../../mixins/isInLobby.js' import BrowserStorage from '../../services/BrowserStorage.js' import { localMediaModel } from '../../utils/webrtc/index.js' @@ -237,7 +237,12 @@ export default { VideoBackgroundEditor, }, - mixins: [devices, isInLobby, isInCall], + mixins: [devices, isInLobby], + + setup() { + const isInCall = useIsInCall() + return { isInCall } + }, data() { return { diff --git a/src/components/MessagesList/MessagesGroup/Message/Message.spec.js b/src/components/MessagesList/MessagesGroup/Message/Message.spec.js index 50841c6ec..58c18e466 100644 --- a/src/components/MessagesList/MessagesGroup/Message/Message.spec.js +++ b/src/components/MessagesList/MessagesGroup/Message/Message.spec.js @@ -20,6 +20,7 @@ import FilePreview from './MessagePart/FilePreview.vue' import Location from './MessagePart/Location.vue' import Mention from './MessagePart/Mention.vue' +import * as useIsInCallModule from '../../../../composables/useIsInCall.js' import { CONVERSATION, ATTENDEE, PARTICIPANT } from '../../../../constants.js' import { EventBus } from '../../../../services/EventBus.js' import storeConfig from '../../../../store/storeConfig.js' @@ -231,17 +232,13 @@ describe('Message.vue', () => { messageProps.message = 'message two' conversationProps.hasCall = true + jest.spyOn(useIsInCallModule, 'useIsInCall').mockReturnValue(() => true) + const wrapper = shallowMount(Message, { localVue, store, propsData: messageProps, provide: injected, - mixins: [{ - // mock the isInCall mixin - computed: { - isInCall: () => true, - }, - }], }) const callButton = wrapper.findComponent({ name: 'CallButton' }) diff --git a/src/components/MessagesList/MessagesGroup/Message/Message.vue b/src/components/MessagesList/MessagesGroup/Message/Message.vue index 3e1dfe6dd..07f4b5045 100644 --- a/src/components/MessagesList/MessagesGroup/Message/Message.vue +++ b/src/components/MessagesList/MessagesGroup/Message/Message.vue @@ -231,8 +231,8 @@ import Location from './MessagePart/Location.vue' import Mention from './MessagePart/Mention.vue' import Poll from './MessagePart/Poll.vue' +import { useIsInCall } from '../../../../composables/useIsInCall.js' import { ATTENDEE, CONVERSATION, PARTICIPANT } from '../../../../constants.js' -import isInCall from '../../../../mixins/isInCall.js' import participant from '../../../../mixins/participant.js' import { EventBus } from '../../../../services/EventBus.js' @@ -261,7 +261,6 @@ export default { mixins: [ participant, - isInCall, ], inject: ['scrollerBoundingClientRect'], @@ -401,6 +400,11 @@ export default { }, }, + setup() { + const isInCall = useIsInCall() + return { isInCall } + }, + data() { return { isHovered: false, diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue index 11f9cdea0..b0b8a2218 100644 --- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue +++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue @@ -84,7 +84,7 @@ import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip.js' import AudioPlayer from './AudioPlayer.vue' -import { openViewer } from '../../../../../mixins/openViewer.js' +import { useViewer } from '../../../../../composables/useViewer.js' const PREVIEW_TYPE = { TEMPORARY: 0, @@ -107,8 +107,6 @@ export default { tooltip: Tooltip, }, - mixins: [openViewer], - props: { /** * File id @@ -236,6 +234,12 @@ export default { default: false, }, }, + + setup() { + const { openViewer } = useViewer() + return { openViewer } + }, + data() { return { isLoading: true, diff --git a/src/components/MessagesList/MessagesList.vue b/src/components/MessagesList/MessagesList.vue index f4041e5e8..7d9b02437 100644 --- a/src/components/MessagesList/MessagesList.vue +++ b/src/components/MessagesList/MessagesList.vue @@ -89,8 +89,8 @@ import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js' import LoadingPlaceholder from '../LoadingPlaceholder.vue' import MessagesGroup from './MessagesGroup/MessagesGroup.vue' +import { useIsInCall } from '../../composables/useIsInCall.js' import { ATTENDEE, CHAT } from '../../constants.js' -import isInCall from '../../mixins/isInCall.js' import isInLobby from '../../mixins/isInLobby.js' import { EventBus } from '../../services/EventBus.js' @@ -105,10 +105,7 @@ export default { NcEmptyContent, }, - mixins: [ - isInLobby, - isInCall, - ], + mixins: [isInLobby], provide() { return { @@ -131,6 +128,11 @@ export default { }, }, + setup() { + const isInCall = useIsInCall() + return { isInCall } + }, + data() { return { viewId: null, diff --git a/src/components/NewMessageForm/NewMessageForm.vue b/src/components/NewMessageForm/NewMessageForm.vue index 0041c0384..a28873f60 100644 --- a/src/components/NewMessageForm/NewMessageForm.vue +++ b/src/components/NewMessageForm/NewMessageForm.vue @@ -247,8 +247,8 @@ import AudioRecorder from './AudioRecorder/AudioRecorder.vue' import SimplePollsEditor from './SimplePollsEditor/SimplePollsEditor.vue' import TemplatePreview from './TemplatePreview.vue' +import { useViewer } from '../../composables/useViewer.js' import { CONVERSATION, PARTICIPANT } from '../../constants.js' -import { openViewer } from '../../mixins/openViewer.js' import { EventBus } from '../../services/EventBus.js' import { shareFile, createTextFile } from '../../services/filesSharingServices.js' import { searchPossibleMentions } from '../../services/mentionsService.js' @@ -293,8 +293,6 @@ export default { NcTextField, }, - mixins: [openViewer], - props: { /** * The current conversation token or the breakout room token. @@ -331,6 +329,11 @@ export default { }, }, + setup() { + const { openViewer } = useViewer() + return { openViewer } + }, + data() { return { text: '', diff --git a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue index 69de7ef15..06114eaee 100644 --- a/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue +++ b/src/components/RightSidebar/BreakoutRooms/BreakoutRoomsActions.vue @@ -121,8 +121,8 @@ import NcModal f |