chore(vue3): migrate async component registration and remove $children

Signed-off-by: Grigorii K. Shartsev <me@shgk.me>
Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
This commit is contained in:
Grigorii K. Shartsev
2024-05-16 12:57:15 +02:00
committed by Maksim Sukharev
parent 5875e28c1e
commit 7b5ff7795e
3 changed files with 15 additions and 19 deletions

View File

@ -15,6 +15,7 @@
</template>
<script>
import { defineAsyncComponent, defineComponent, h } from 'vue'
import LoadingComponent from './components/LoadingComponent.vue'
import { useGetToken } from './composables/useGetToken.ts'
import { useHashCheck } from './composables/useHashCheck.js'
@ -23,18 +24,15 @@ import { useSessionIssueHandler } from './composables/useSessionIssueHandler.ts'
import { useTokenStore } from './stores/token.ts'
export default {
name: 'FilesSidebarCallViewApp',
components: {
CallView: () => ({
component: import(/* webpackChunkName: "files-sidebar-call-chunk" */'./components/CallView/CallView.vue'),
loading: {
render: (h) => h(LoadingComponent, { class: 'call-loading' }),
},
CallView: defineAsyncComponent({
loader: () => import(/* webpackChunkName: "files-sidebar-call-chunk" */'./components/CallView/CallView.vue'),
loadingComponent: defineComponent(() => h(LoadingComponent, { class: 'call-loading' })),
}),
TopBar: () => import(/* webpackChunkName: "files-sidebar-call-chunk" */'./components/TopBar/TopBar.vue'),
TopBar: defineAsyncComponent(() => import(/* webpackChunkName: "files-sidebar-call-chunk" */'./components/TopBar/TopBar.vue')),
},
setup() {
@ -147,7 +145,7 @@ export default {
window.addEventListener('beforeunload', this.preventUnload)
},
beforeDestroy() {
beforeUnmount() {
window.removeEventListener('beforeunload', this.preventUnload)
},

View File

@ -27,11 +27,11 @@
</template>
<script>
import { getCurrentUser } from '@nextcloud/auth'
import Axios from '@nextcloud/axios'
import { loadState } from '@nextcloud/initial-state'
import { t } from '@nextcloud/l10n'
import { defineAsyncComponent, defineComponent, h } from 'vue'
import NcButton from '@nextcloud/vue/components/NcButton'
import LoadingComponent from './components/LoadingComponent.vue'
import { useGetToken } from './composables/useGetToken.ts'
@ -52,11 +52,9 @@ export default {
name: 'FilesSidebarTabApp',
components: {
FilesSidebarChatView: () => ({
component: import(/* webpackChunkName: "files-sidebar-tab-chunk" */'./views/FilesSidebarChatView.vue'),
loading: {
render: (h) => h(LoadingComponent, { class: 'tab-loading' }),
},
FilesSidebarChatView: defineAsyncComponent({
loader: () => import(/* webpackChunkName: "files-sidebar-tab-chunk" */'./views/FilesSidebarChatView.vue'),
loadingComponent: defineComponent(() => h(LoadingComponent, { class: 'tab-loading' })),
}),
NcButton,

View File

@ -16,12 +16,12 @@
*/
export default class FilesSidebarCallView {
constructor() {
this.callViewInstance = OCA.Talk.newCallView()
const callViewApp = OCA.Talk.newCallView()
this.$el = document.createElement('div')
this.id = 'FilesSidebarCallView'
const container = document.createElement('div')
container.id = 'FilesSidebarCallView'
this.callViewInstance.mount(this.$el)
this.callViewInstance = callViewApp.mount(container)
this.$el = this.callViewInstance.$el
this.$el.replaceAll = function(target) {
@ -32,6 +32,6 @@ export default class FilesSidebarCallView {
setFileInfo(fileInfo) {
// The FilesSidebarCallViewApp is the first (and only) child of the Vue
// instance.
this.callViewInstance.$children[0].setFileInfo(fileInfo)
this.callViewInstance.setFileInfo(fileInfo)
}
}