Skip to content

Refactor NewMessageForm component #9430

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Antreesy merged 7 commits into from
May 12, 2023
Merged

Refactor NewMessageForm component #9430

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
b25ad42
move, rename and refactor existing inner components
Antreesy May 2, 2023
e979c74
extract attachments actions
Antreesy May 2, 2023
704f6fa
extract text creation dialog
Antreesy May 2, 2023
2a16bc7
align template picker appearance with Files app
Antreesy May 11, 2023
639a3f7
fix replacement of special symbols by EmojiPicker
Antreesy May 11, 2023
5ae4c82
post-review fixes, refactor NewMessageFormTextCreateDialog.vue
Antreesy May 12, 2023
1ffd8e5
shorten components names
Antreesy May 12, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 0 additions & 3 deletions src/App.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,6 @@
<RightSidebar :is-in-call="isInCall" />
<PreventUnload :when="warnLeaving || isSendingMessages" />
<MediaSettings :initialize-on-mounted="false" />
<UploadEditor />
<SettingsDialog />
<ConversationSettingsDialog />
</NcContent>
Expand All @@ -54,7 +53,6 @@ import LeftSidebar from './components/LeftSidebar/LeftSidebar.vue'
import MediaSettings from './components/MediaSettings/MediaSettings.vue'
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'
Expand All @@ -79,7 +77,6 @@ export default {
LeftSidebar,
PreventUnload,
RightSidebar,
UploadEditor,
SettingsDialog,
ConversationSettingsDialog,
MediaSettings,
Expand Down
3 changes: 0 additions & 3 deletions src/FilesSidebarTabApp.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,6 @@
<template v-else>
<CallButton class="call-button" />
<ChatView />
<UploadEditor />
<MediaSettings :initialize-on-mounted="false" />
</template>
</div>
Expand All @@ -58,7 +57,6 @@ import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
import ChatView from './components/ChatView.vue'
import MediaSettings from './components/MediaSettings/MediaSettings.vue'
import CallButton from './components/TopBar/CallButton.vue'
import UploadEditor from './components/UploadEditor.vue'

import browserCheck from './mixins/browserCheck.js'
import sessionIssueHandler from './mixins/sessionIssueHandler.js'
Expand All @@ -80,7 +78,6 @@ export default {
components: {
CallButton,
ChatView,
UploadEditor,
MediaSettings,
NcButton,
},
Expand Down
13 changes: 6 additions & 7 deletions src/components/BreakoutRoomsEditor/SendMessageDialog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,11 +27,10 @@
<h2 class="send-message-dialog__title">
{{ dialogTitle }}
</h2>
<NewMessageForm v-if="modalContainerId"
ref="messageForm"
<NewMessage v-if="modalContainerId"
ref="newMessage"
role="region"
:token="token"
:breakout-room="true"
:container="modalContainerId"
:aria-label="t('spreed', 'Post message')"
:broadcast="broadcast"
Expand All @@ -46,14 +45,14 @@ import { showError, showSuccess } from '@nextcloud/dialogs'

import NcModal from '@nextcloud/vue/dist/Components/NcModal.js'

import NewMessageForm from '../NewMessageForm/NewMessageForm.vue'
import NewMessage from '../NewMessage/NewMessage.vue'

export default {
name: 'SendMessageDialog',

components: {
NcModal,
NewMessageForm,
NewMessage,
},

props: {
Expand Down Expand Up @@ -105,10 +104,10 @@ export default {
},

mounted() {
// Postpone render of NewMessageForm until modal container is mounted
// Postpone render of NewMessage until modal container is mounted
this.modalContainerId = `#modal-description-${this.$refs.modal.randId}`
this.$nextTick(() => {
this.$refs.messageForm.focusInput()
this.$refs.newMessage.focusInput()
})
},

Expand Down
8 changes: 4 additions & 4 deletions src/components/ChatView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
:aria-label="t('spreed', 'Conversation messages')"
:token="token"
:is-visible="isVisible" />
<NewMessageForm v-if="containerId"
<NewMessage v-if="containerId"
role="region"
:token="token"
:container="containerId"
Expand All @@ -53,7 +53,7 @@

<script>
import MessagesList from './MessagesList/MessagesList.vue'
import NewMessageForm from './NewMessageForm/NewMessageForm.vue'
import NewMessage from './NewMessage/NewMessage.vue'

import { CONVERSATION } from '../constants.js'

Expand All @@ -63,7 +63,7 @@ export default {

components: {
MessagesList,
NewMessageForm,
NewMessage,
},

props: {
Expand Down Expand Up @@ -106,7 +106,7 @@ export default {
},
},
mounted() {
// Postpone render of NewMessageForm until application is mounted
// Postpone render of NewMessage until application is mounted
this.containerId = this.$store.getters.getMainContainerSelector()
},

Expand Down
Loading