From f4acf380351e3aa2263ca40bd74aa74d3fe4fb7c Mon Sep 17 00:00:00 2001 From: grnd-alt Date: Mon, 12 May 2025 11:10:40 +0200 Subject: [PATCH] replace Vue.set with direct setting Signed-off-by: grnd-alt --- package-lock.json | 15 --------- package.json | 1 - src/components/KeyboardShortcuts.vue | 1 - src/components/board/Stack.vue | 2 +- src/init-collections.js | 48 +++++++++++++--------------- src/main.js | 7 ++-- src/store/attachment.js | 7 ++-- src/store/card.js | 21 ++++++------ src/store/comment.js | 10 +++--- src/store/main.js | 19 ++++++----- src/store/overview.js | 12 +++---- src/store/stack.js | 3 +- webpack.js | 4 +-- 13 files changed, 62 insertions(+), 88 deletions(-) diff --git a/package-lock.json b/package-lock.json index eabb30d28..a43e879a7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,7 +23,6 @@ "@nextcloud/notify_push": "^1.3.0", "@nextcloud/router": "^3.0.1", "@nextcloud/vue": "^9.0.0-alpha.7", - "@vue/compat": "^3.5.13", "@vue/compiler-sfc": "^3.5.13", "@vue/vue3-jest": "^29.2.6", "@vueuse/core": "^13.1.0", @@ -5753,20 +5752,6 @@ "integrity": "sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==", "license": "ISC" }, - "node_modules/@vue/compat": { - "version": "3.5.13", - "resolved": "https://registry.npmjs.org/@vue/compat/-/compat-3.5.13.tgz", - "integrity": "sha512-Q3xRdTPN4l+kddxU98REyUBgvc0meAo9CefCWE2lW8Fg3dyPn3vSCce52b338ihrJAx1RQQhO5wMWhJ/PAKUpA==", - "license": "MIT", - "dependencies": { - "@babel/parser": "^7.25.3", - "estree-walker": "^2.0.2", - "source-map-js": "^1.2.0" - }, - "peerDependencies": { - "vue": "3.5.13" - } - }, "node_modules/@vue/compiler-core": { "version": "3.5.13", "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.13.tgz", diff --git a/package.json b/package.json index f043b1a80..d6b7918e1 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,6 @@ "@nextcloud/notify_push": "^1.3.0", "@nextcloud/router": "^3.0.1", "@nextcloud/vue": "^9.0.0-alpha.7", - "@vue/compat": "^3.5.13", "@vue/compiler-sfc": "^3.5.13", "@vue/vue3-jest": "^29.2.6", "@vueuse/core": "^13.1.0", diff --git a/src/components/KeyboardShortcuts.vue b/src/components/KeyboardShortcuts.vue index b055f1a76..5affa87d9 100644 --- a/src/components/KeyboardShortcuts.vue +++ b/src/components/KeyboardShortcuts.vue @@ -260,7 +260,6 @@ export default { this.$refs.shortcutModal?.focus() }, close() { - console.log("HHHHH") this.card = null this.selector = null }, diff --git a/src/components/board/Stack.vue b/src/components/board/Stack.vue index ca2bf9380..d6f79c5da 100644 --- a/src/components/board/Stack.vue +++ b/src/components/board/Stack.vue @@ -94,7 +94,7 @@ non-drag-area-selector=".dragDisabled" :drag-handle-selector="dragHandleSelector" data-dragscroll-enabled - @should-accept-drop="canEdit" + :should-accept-drop="() => canEdit" @drag-start="draggingCard = true" @drag-end="draggingCard = false" @drop="($event) => onDropCard(stack.id, $event)"> diff --git a/src/init-collections.js b/src/init-collections.js index 124c2befb..eeae11478 100644 --- a/src/init-collections.js +++ b/src/init-collections.js @@ -3,38 +3,34 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ -import Vue from 'vue' - import './../css/collections.css' import FileSharingPicker from './views/FileSharingPicker.js' import { buildSelector } from './helpers/selector.js' import './shared-init.js' -Vue.prototype.t = t -Vue.prototype.n = n -Vue.prototype.OC = OC +export function initCollections() { + window.addEventListener('DOMContentLoaded', () => { + if (OCA.Sharing && OCA.Sharing.ShareSearch) { + OCA.Sharing.ShareSearch.addNewResult(FileSharingPicker) + } -window.addEventListener('DOMContentLoaded', () => { - if (OCA.Sharing && OCA.Sharing.ShareSearch) { - OCA.Sharing.ShareSearch.addNewResult(FileSharingPicker) - } + window.OCP.Collaboration.registerType('deck', { + action: () => { + const BoardSelector = () => import('./BoardSelector.vue') + return buildSelector(BoardSelector) + }, + typeString: t('deck', 'Link to a board'), + typeIconClass: 'icon-deck', + }) - window.OCP.Collaboration.registerType('deck', { - action: () => { - const BoardSelector = () => import('./BoardSelector.vue') - return buildSelector(BoardSelector) - }, - typeString: t('deck', 'Link to a board'), - typeIconClass: 'icon-deck', + window.OCP.Collaboration.registerType('deck-card', { + action: () => { + const CardSelector = () => import('./CardSelector.vue') + return buildSelector(CardSelector) + }, + typeString: t('deck', 'Link to a card'), + typeIconClass: 'icon-deck', + }) }) - - window.OCP.Collaboration.registerType('deck-card', { - action: () => { - const CardSelector = () => import('./CardSelector.vue') - return buildSelector(CardSelector) - }, - typeString: t('deck', 'Link to a card'), - typeIconClass: 'icon-deck', - }) -}) +} diff --git a/src/main.js b/src/main.js index 19f064be3..8a4d97d47 100644 --- a/src/main.js +++ b/src/main.js @@ -13,9 +13,7 @@ import ClickOutside from 'vue-click-outside' import './shared-init.js' import './models/index.js' import './sessions.js' -import { configureCompat } from '@vue/compat' - -configureCompat({ MODE: 3, INSTANCE_SCOPED_SLOTS: false, ATTR_ENUMERATED_COERCION: true, INSTANCE_EVENT_EMITTER: true, OPTIONS_BEFORE_DESTROY: true, CUSTOM_DIR: true, OPTIONS_DESTROYED: true, INSTANCE_LISTENERS: true, GLOBAL_SET: true }) +import { initCollections } from './init-collections.js' // the server snap.js conflicts with vertical scrolling so we disable it document.body.setAttribute('data-snap-ignore', 'true') @@ -24,6 +22,9 @@ const app = createApp(App) app.config.globalProperties.t = translate app.config.globalProperties.n = translatePlural +app.config.globalProperties.OC = OC + +initCollections({ t, n, OC }) app.directive('click-outside', ClickOutside) diff --git a/src/store/attachment.js b/src/store/attachment.js index 7ec5d1578..33fe311fa 100644 --- a/src/store/attachment.js +++ b/src/store/attachment.js @@ -4,7 +4,6 @@ */ import { AttachmentApi } from './../services/AttachmentApi.js' -import Vue from 'vue' const apiClient = new AttachmentApi() @@ -24,20 +23,20 @@ export default { mutations: { createAttachment(state, { cardId, attachment }) { if (typeof state.attachments[cardId] === 'undefined') { - Vue.set(state.attachments, cardId, [attachment]) + state.attachments[cardId] = [attachment] } else { state.attachments[cardId].push(attachment) } }, createAttachments(state, { cardId, attachments }) { - Vue.set(state.attachments, cardId, attachments) + state.attachments[cardId] = attachments }, updateAttachment(state, { cardId, attachment }) { const existingIndex = state.attachments[attachment.cardId].findIndex(a => a.id === attachment.id && a.type === attachment.type) if (existingIndex !== -1) { - Vue.set(state.attachments[cardId], existingIndex, attachment) + state.attachments[cardId][existingIndex] = attachment } }, diff --git a/src/store/card.js b/src/store/card.js index 556a52a2e..19c689f2b 100644 --- a/src/store/card.js +++ b/src/store/card.js @@ -5,7 +5,6 @@ import { CardApi } from './../services/CardApi.js' import moment from 'moment' -import Vue from 'vue' const apiClient = new CardApi() @@ -180,6 +179,7 @@ export default { .sort((a, b) => a.order - b.order || a.createdAt - b.createdAt) }, cardById: state => (id) => { + alert('cardById') return state.cards.find((card) => card.id === id) }, }, @@ -190,7 +190,7 @@ export default { const existingIndex = state.cards.findIndex(_card => _card.id === card.id) if (existingIndex !== -1) { const existingCard = state.cards.find(_card => _card.id === card.id) - Vue.set(state.cards, existingIndex, Object.assign({}, existingCard, card)) + state.cards[existingIndex] = { ...existingCard, ...card } } else { state.cards.push(card) } @@ -204,15 +204,15 @@ export default { updateCard(state, card) { const existingIndex = state.cards.findIndex(_card => _card.id === card.id) if (existingIndex !== -1) { - Vue.set(state.cards, existingIndex, Object.assign({}, state.cards[existingIndex], card)) + state.cards[existingIndex] = { ...state.cards[existingIndex], ...card } } }, updateCardsReorder(state, cards) { for (const newCard of cards) { const existingIndex = state.cards.findIndex(_card => _card.id === newCard.id) if (existingIndex !== -1) { - Vue.set(state.cards[existingIndex], 'order', newCard.order) - Vue.set(state.cards[existingIndex], 'stackId', newCard.stackId) + state.cards[existingIndex].order = newCard.order + state.cards[existingIndex].stackId = newCard.stackId } } }, @@ -234,26 +234,26 @@ export default { updateCardProperty(state, { card, property }) { const existingIndex = state.cards.findIndex(_card => _card.id === card.id) if (existingIndex !== -1) { - Vue.set(state.cards[existingIndex], property, card[property]) - Vue.set(state.cards[existingIndex], 'lastModified', Date.now() / 1000) + state.cards[existingIndex][property] = card[property] + state.cards[existingIndex].lastModifiedBy = Date.now() / 1000 } }, cardSetAttachmentCount(state, { cardId, count }) { const existingIndex = state.cards.findIndex(_card => _card.id === cardId) if (existingIndex !== -1) { - Vue.set(state.cards[existingIndex], 'attachmentCount', count) + state.cards[existingIndex].attachmentCount = count } }, cardIncreaseAttachmentCount(state, cardId) { const existingIndex = state.cards.findIndex(_card => _card.id === cardId) if (existingIndex !== -1) { - Vue.set(state.cards[existingIndex], 'attachmentCount', state.cards[existingIndex].attachmentCount + 1) + state.cards[existingIndex].attachmentCount = state.cards[existingIndex].attachmentCount + 1 } }, cardDecreaseAttachmentCount(state, cardId) { const existingIndex = state.cards.findIndex(_card => _card.id === cardId) if (existingIndex !== -1) { - Vue.set(state.cards[existingIndex], 'attachmentCount', state.cards[existingIndex].attachmentCount - 1) + state.cards[existingIndex].attachmentCount = state.cards[existingIndex].attachmentCount - 1 } }, addNewCard(state, card) { @@ -344,6 +344,7 @@ export default { commit('removeUserFromCard', user) }, async addLabel({ commit }, data) { + alert('hello world') await apiClient.assignLabelToCard(data) commit('updateCardProperty', { property: 'labels', card: data.card }) }, diff --git a/src/store/comment.js b/src/store/comment.js index d580fe06d..df4067a86 100644 --- a/src/store/comment.js +++ b/src/store/comment.js @@ -34,10 +34,10 @@ export default { }, addComments(state, { comments, cardId }) { if (state.comments[cardId] === undefined) { - Vue.set(state.comments, cardId, { - hasMore: comments.length > 0, + state.comments[cardId] = { + hasMore: comments.length >= 0, comments: [...comments], - }) + } } else { const newComments = comments.filter((comment) => { return state.comments[cardId].comments.findIndex((item) => item.id === comment.id) === -1 @@ -59,11 +59,11 @@ export default { }, markCommentsAsRead(state, cardId) { state.comments[cardId].comments.forEach(_comment => { - Vue.set(_comment, 'isUnread', false) + _comment.isUnread = false }) }, setReplyTo(state, comment) { - Vue.set(state, 'replyTo', comment) + state.replyTo = comment }, }, actions: { diff --git a/src/store/main.js b/src/store/main.js index cf6030b86..e1a9234e1 100644 --- a/src/store/main.js +++ b/src/store/main.js @@ -6,7 +6,6 @@ import 'url-search-params-polyfill' import { loadState } from '@nextcloud/initial-state' -import Vue from 'vue' import { createStore } from 'vuex' import axios from '@nextcloud/axios' import { generateOcsUrl, generateUrl } from '@nextcloud/router' @@ -129,7 +128,7 @@ const store = createStore({ }, mutations: { setFullApp(state, isFullApp) { - Vue.set(state, 'isFullApp', isFullApp) + state.isFullApp = isFullApp }, setHasCardSaveError(state, hasCardSaveError) { Vue.set(state, 'hasCardSaveError', hasCardSaveError) @@ -144,11 +143,11 @@ const store = createStore({ }) if (indexExisting > -1) { - Vue.set(state.boards[indexExisting].settings, configKey, value) + state.boards[indexExisting].settings[configKey] = value } break default: - Vue.set(state.config, key, value) + state.config[key] = value } }, setSearchQuery(state, searchQuery) { @@ -161,7 +160,7 @@ const store = createStore({ Object.keys(filter).forEach((key) => { switch (key) { case 'due': - Vue.set(state.filter, key, filter.due) + state.filter[key] = filter.due break default: filter[key].forEach((item) => { @@ -188,7 +187,7 @@ const store = createStore({ }) if (indexExisting > -1) { - Vue.set(state.boards, indexExisting, board) + state.boards[indexExisting] = board } else { state.boards.push(board) } @@ -200,7 +199,7 @@ const store = createStore({ }) if (indexExisting > -1) { - Vue.set(state.boards, indexExisting, board) + state.boards[indexExisting] = board } else { state.boards.push(board) } @@ -233,7 +232,7 @@ const store = createStore({ state.boards = boards }, setSharees(state, shareesUsersAndGroups) { - Vue.set(state, 'sharees', shareesUsersAndGroups.exact.users) + state.sharees = shareesUsersAndGroups.exact.users state.sharees.push(...shareesUsersAndGroups.exact.groups) state.sharees.push(...shareesUsersAndGroups.exact.circles) @@ -283,7 +282,7 @@ const store = createStore({ updateAclFromCurrentBoard(state, acl) { for (const acl_ in state.currentBoard.acl) { if (state.currentBoard.acl[acl_].participant.uid === acl.participant.uid) { - Vue.set(state.currentBoard.acl, acl_, acl) + state.currentBoard.acl[acl_] = acl break } } @@ -299,7 +298,7 @@ const store = createStore({ } if (removeIndex > -1) { - Vue.delete(state.currentBoard.acl, removeIndex) + state.currentBoard.acl.splice(removeIndex, 1) } }, TOGGLE_SHORTCUT_LOCK(state, lock) { diff --git a/src/store/overview.js b/src/store/overview.js index 43eeef39e..69fcab5a9 100644 --- a/src/store/overview.js +++ b/src/store/overview.js @@ -3,20 +3,18 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ -import Vue from 'vue' -import Vuex from 'vuex' +import { createStore } from 'vuex/dist/vuex.cjs.js' import { OverviewApi } from '../services/OverviewApi.js' -Vue.use(Vuex) const apiClient = new OverviewApi() -export default { +export default createStore({ state: { assignedCards: [], loading: false, }, getters: { - assignedCardsDashboard: state => { - return state.assignedCards + assignedCardsDashboard(state) { + return () => state.assignedCards }, }, mutations: { @@ -46,4 +44,4 @@ export default { return promise }, }, -} +}) diff --git a/src/store/stack.js b/src/store/stack.js index fc7074b07..093df4d5f 100644 --- a/src/store/stack.js +++ b/src/store/stack.js @@ -3,7 +3,6 @@ * SPDX-License-Identifier: AGPL-3.0-or-later */ -import Vue from 'vue' import { StackApi } from './../services/StackApi.js' import applyOrderToArray from './../helpers/applyOrderToArray.js' @@ -26,7 +25,7 @@ export default { const existingIndex = state.stacks.findIndex(_stack => _stack.id === stack.id) if (existingIndex !== -1) { const existingStack = state.stacks.find(_stack => _stack.id === stack.id) - Vue.set(state.stacks, existingIndex, Object.assign({}, existingStack, stack)) + state.stacks[existingIndex] = { ...existingStack, ...stack } } else { state.stacks.push(stack) } diff --git a/webpack.js b/webpack.js index 4fc93ee84..11b51348a 100644 --- a/webpack.js +++ b/webpack.js @@ -7,7 +7,7 @@ const isDevServer = process.env.WEBPACK_SERVE webpackConfig.entry = { ...webpackConfig.entry, - collections: path.join(__dirname, 'src', 'init-collections.js'), + // collections: path.join(__dirname, 'src', 'init-collections.js'), dashboard: path.join(__dirname, 'src', 'init-dashboard.js'), calendar: path.join(__dirname, 'src', 'init-calendar.js'), talk: path.join(__dirname, 'src', 'init-talk.js'), @@ -30,7 +30,5 @@ if (isDevServer) { modules: true, } } -// Workaround for https://github.com/nextcloud/webpack-vue-config/pull/432 causing problems with nextcloud-vue-collections -webpackConfig.resolve.alias = { vue: '@vue/compat' } module.exports = webpackConfig