Migrate to @nextcloud/vue 1.x.x

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

apps/files/src/components/LegacyTab.vue

@@ -26,7 +26,7 @@
 		:active-tab="activeTab" />
 </template>
 <script>
-import AppSidebarTab from 'nextcloud-vue/dist/Components/AppSidebarTab'
+import AppSidebarTab from '@nextcloud/vue/dist/Components/AppSidebarTab'
 
 export default {
 	name: 'LegacyTab',

apps/files/src/components/TransferOwnershipDialogue.vue

@@ -70,7 +70,7 @@ import axios from '@nextcloud/axios'
 import debounce from 'debounce'
 import { generateOcsUrl } from '@nextcloud/router'
 import { getFilePickerBuilder } from '@nextcloud/dialogs'
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
 import Vue from 'vue'
 
 import logger from '../logger'

apps/files/src/views/Sidebar.vue

@@ -73,8 +73,8 @@
 <script>
 import $ from 'jquery'
 import axios from '@nextcloud/axios'
-import AppSidebar from 'nextcloud-vue/dist/Components/AppSidebar'
-import ActionButton from 'nextcloud-vue/dist/Components/ActionButton'
+import AppSidebar from '@nextcloud/vue/dist/Components/AppSidebar'
+import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
 import FileInfo from '../services/FileInfo'
 import LegacyTab from '../components/LegacyTab'
 import LegacyView from '../components/LegacyView'
@@ -240,6 +240,35 @@ export default {
 		},
 	},
 
+	watch: {
+		// update the sidebar data
+		async file(curr, prev) {
+			this.resetData()
+			if (curr && curr.trim() !== '') {
+				try {
+					this.fileInfo = await FileInfo(this.davPath)
+					// adding this as fallback because other apps expect it
+					this.fileInfo.dir = this.file.split('/').slice(0, -1).join('/')
+
+					// DEPRECATED legacy views
+					// TODO: remove
+					this.views.forEach(view => {
+						view.setFileInfo(this.fileInfo)
+					})
+
+					this.$nextTick(() => {
+						if (this.$refs.sidebar) {
+							this.$refs.sidebar.updateTabs()
+						}
+					})
+				} catch (error) {
+					this.error = t('files', 'Error while loading the file data')
+					console.error('Error while loading the file data', error)
+				}
+			}
+		},
+	},
+
 	methods: {
 		/**
 		 * Can this tab be displayed ?

apps/files_sharing/js/dist/collaboration.js

@@ -1,2 +1,2 @@
-!function(e){var n={};function t(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},t.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,n){if(1&n&&(e=t(e)),8&n)return e;if(4&n&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(t.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var o in e)t.d(r,o,function(n){return e[n]}.bind(null,o));return r},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="/js/",t(t.s=283)}({283:function(e,n,r){r.p=OC.linkTo("files_sharing","js/dist/"),r.nc=btoa(OC.requestToken),window.OCP.Collaboration.registerType("file",{action:function(){return new Promise((function(e,n){OC.dialogs.filepicker(t("files_sharing","Link to a file"),(function(t){OC.Files.getClient().getFileInfo(t).then((function(n,t){e(t.id)})).fail((function(){n(new Error("Cannot get fileinfo"))}))}),!1,null,!1,OC.dialogs.FILEPICKER_TYPE_CHOOSE,"",{allowDirectoryChooser:!0})}))},typeString:t("files_sharing","Link to a file"),typeIconClass:"icon-files-dark"})}});
+!function(e){var n={};function t(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},t.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,n){if(1&n&&(e=t(e)),8&n)return e;if(4&n&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(t.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var o in e)t.d(r,o,function(n){return e[n]}.bind(null,o));return r},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="/js/",t(t.s=275)}({275:function(e,n,r){r.p=OC.linkTo("files_sharing","js/dist/"),r.nc=btoa(OC.requestToken),window.OCP.Collaboration.registerType("file",{action:function(){return new Promise((function(e,n){OC.dialogs.filepicker(t("files_sharing","Link to a file"),(function(t){OC.Files.getClient().getFileInfo(t).then((function(n,t){e(t.id)})).fail((function(){n(new Error("Cannot get fileinfo"))}))}),!1,null,!1,OC.dialogs.FILEPICKER_TYPE_CHOOSE,"",{allowDirectoryChooser:!0})}))},typeString:t("files_sharing","Link to a file"),typeIconClass:"icon-files-dark"})}});
 //# sourceMappingURL=collaboration.js.map

apps/files_sharing/js/dist/main.js

@@ -1,4 +1,4 @@
-!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="/js/",r(r.s=827)}({827:function(e,t){
+!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="/js/",r(r.s=728)}({728:function(e,t){
 /**
  * @copyright Copyright (c) 2019 John Molakvoæ <skjnldsv@protonmail.com>
  *

apps/files_sharing/src/collaborationresources.js

@@ -22,7 +22,8 @@
 
 import Vue from 'vue'
 import Vuex from 'vuex'
-import { Tooltip, PopoverMenu } from 'nextcloud-vue'
+import PopoverMenu from '@nextcloud/vue/dist/Components/PopoverMenu'
+import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
 import ClickOutside from 'vue-click-outside'
 
 import View from './views/CollaborationView'

apps/files_sharing/src/components/SharingEntry.vue

@@ -135,13 +135,13 @@
 </template>
 
 <script>
-import Avatar from 'nextcloud-vue/dist/Components/Avatar'
-import Actions from 'nextcloud-vue/dist/Components/Actions'
-import ActionButton from 'nextcloud-vue/dist/Components/ActionButton'
-import ActionCheckbox from 'nextcloud-vue/dist/Components/ActionCheckbox'
-import ActionInput from 'nextcloud-vue/dist/Components/ActionInput'
-import ActionTextEditable from 'nextcloud-vue/dist/Components/ActionTextEditable'
-import Tooltip from 'nextcloud-vue/dist/Directives/Tooltip'
+import Avatar from '@nextcloud/vue/dist/Components/Avatar'
+import Actions from '@nextcloud/vue/dist/Components/Actions'
+import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import ActionCheckbox from '@nextcloud/vue/dist/Components/ActionCheckbox'
+import ActionInput from '@nextcloud/vue/dist/Components/ActionInput'
+import ActionTextEditable from '@nextcloud/vue/dist/Components/ActionTextEditable'
+import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
 
 import SharesMixin from '../mixins/SharesMixin'
 

apps/files_sharing/src/components/SharingEntryInherited.vue

@@ -50,10 +50,10 @@
 
 <script>
 import { generateUrl } from '@nextcloud/router'
-import Avatar from 'nextcloud-vue/dist/Components/Avatar'
-import ActionButton from 'nextcloud-vue/dist/Components/ActionButton'
-import ActionLink from 'nextcloud-vue/dist/Components/ActionLink'
-import ActionText from 'nextcloud-vue/dist/Components/ActionText'
+import Avatar from '@nextcloud/vue/dist/Components/Avatar'
+import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import ActionLink from '@nextcloud/vue/dist/Components/ActionLink'
+import ActionText from '@nextcloud/vue/dist/Components/ActionText'
 
 // eslint-disable-next-line no-unused-vars
 import Share from '../models/Share'

apps/files_sharing/src/components/SharingEntryInternal.vue

@@ -20,7 +20,7 @@
 
 <script>
 import { generateUrl } from '@nextcloud/router'
-import ActionLink from 'nextcloud-vue/dist/Components/ActionLink'
+import ActionLink from '@nextcloud/vue/dist/Components/ActionLink'
 import SharingEntrySimple from './SharingEntrySimple'
 
 export default {

apps/files_sharing/src/components/SharingEntryLink.vue

@@ -299,16 +299,16 @@
 import { generateUrl } from '@nextcloud/router'
 import axios from '@nextcloud/axios'
 
-import ActionButton from 'nextcloud-vue/dist/Components/ActionButton'
-import ActionCheckbox from 'nextcloud-vue/dist/Components/ActionCheckbox'
-import ActionRadio from 'nextcloud-vue/dist/Components/ActionRadio'
-import ActionInput from 'nextcloud-vue/dist/Components/ActionInput'
-import ActionText from 'nextcloud-vue/dist/Components/ActionText'
-import ActionTextEditable from 'nextcloud-vue/dist/Components/ActionTextEditable'
-import ActionLink from 'nextcloud-vue/dist/Components/ActionLink'
-import Actions from 'nextcloud-vue/dist/Components/Actions'
-import Avatar from 'nextcloud-vue/dist/Components/Avatar'
-import Tooltip from 'nextcloud-vue/dist/Directives/Tooltip'
+import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import ActionCheckbox from '@nextcloud/vue/dist/Components/ActionCheckbox'
+import ActionRadio from '@nextcloud/vue/dist/Components/ActionRadio'
+import ActionInput from '@nextcloud/vue/dist/Components/ActionInput'
+import ActionText from '@nextcloud/vue/dist/Components/ActionText'
+import ActionTextEditable from '@nextcloud/vue/dist/Components/ActionTextEditable'
+import ActionLink from '@nextcloud/vue/dist/Components/ActionLink'
+import Actions from '@nextcloud/vue/dist/Components/Actions'
+import Avatar from '@nextcloud/vue/dist/Components/Avatar'
+import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
 
 import Share from '../models/Share'
 import SharesMixin from '../mixins/SharesMixin'

apps/files_sharing/src/components/SharingEntrySimple.vue

@@ -36,8 +36,8 @@
 </template>
 
 <script>
-import Actions from 'nextcloud-vue/dist/Components/Actions'
-import Tooltip from 'nextcloud-vue/dist/Directives/Tooltip'
+import Actions from '@nextcloud/vue/dist/Components/Actions'
+import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
 
 export default {
 	name: 'SharingEntrySimple',

apps/files_sharing/src/components/SharingInput.vue

@@ -50,7 +50,7 @@ import { generateOcsUrl } from '@nextcloud/router'
 import { getCurrentUser } from '@nextcloud/auth'
 import axios from '@nextcloud/axios'
 import debounce from 'debounce'
-import Multiselect from 'nextcloud-vue/dist/Components/Multiselect'
+import Multiselect from '@nextcloud/vue/dist/Components/Multiselect'
 
 import Config from '../services/ConfigService'
 import Share from '../models/Share'

apps/files_sharing/src/views/SharingInherited.vue

@@ -44,7 +44,7 @@
 
 <script>
 import { generateOcsUrl } from '@nextcloud/router'
-import ActionButton from 'nextcloud-vue/dist/Components/ActionButton'
+import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
 import axios from '@nextcloud/axios'
 
 import Share from '../models/Share'

apps/files_sharing/src/views/SharingTab.vue

@@ -87,9 +87,9 @@
 <script>
 import { CollectionList } from 'nextcloud-vue-collections'
 import { generateOcsUrl } from '@nextcloud/router'
-import Avatar from 'nextcloud-vue/dist/Components/Avatar'
+import Avatar from '@nextcloud/vue/dist/Components/Avatar'
 import axios from '@nextcloud/axios'
-import Tab from 'nextcloud-vue/dist/Components/AppSidebarTab'
+import Tab from '@nextcloud/vue/dist/Components/AppSidebarTab'
 
 import { shareWithTitle } from '../utils/SharedWithMe'
 import Share from '../models/Share'

apps/settings/src/components/AdminTwoFactor.vue

@@ -67,7 +67,7 @@
 
 <script>
 import axios from '@nextcloud/axios'
-import { Multiselect } from 'nextcloud-vue'
+import { Multiselect } from '@nextcloud/vue'
 import _ from 'lodash'
 
 export default {

apps/settings/src/components/AppDetails.vue

@@ -187,7 +187,7 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue'
+import { Multiselect } from '@nextcloud/vue'
 import marked from 'marked'
 import dompurify from 'dompurify'
 

apps/settings/src/components/AuthToken.vue

@@ -89,7 +89,7 @@ import {
 	Actions,
 	ActionButton,
 	ActionCheckbox,
-} from 'nextcloud-vue'
+} from '@nextcloud/vue'
 
 const userAgentMap = {
 	ie: /(?:MSIE|Trident|Trident\/7.0; rv)[ :](\d+)/,

apps/settings/src/components/UserList.vue

@@ -242,7 +242,7 @@
 
 <script>
 import userRow from './UserList/UserRow'
-import { Multiselect, Actions, ActionButton } from 'nextcloud-vue'
+import { Multiselect, Actions, ActionButton } from '@nextcloud/vue'
 import InfiniteLoading from 'vue-infinite-loading'
 import Vue from 'vue'
 

apps/settings/src/components/UserList/UserRow.vue

@@ -246,7 +246,7 @@ import {
 	Multiselect,
 	Actions,
 	ActionButton,
-} from 'nextcloud-vue'
+} from '@nextcloud/vue'
 import UserRowSimple from './UserRowSimple'
 import UserRowMixin from '../../mixins/UserRowMixin'
 

apps/settings/src/components/UserList/UserRowSimple.vue

@@ -75,7 +75,7 @@
 </template>
 
 <script>
-import { PopoverMenu, Actions, ActionButton } from 'nextcloud-vue'
+import { PopoverMenu, Actions, ActionButton } from '@nextcloud/vue'
 import ClickOutside from 'vue-click-outside'
 import { getCurrentUser } from '@nextcloud/auth'
 

apps/settings/src/views/Apps.vue

@@ -27,7 +27,57 @@
 		:navigation-class="{ 'icon-loading': loading }">
 		<AppNavigation>
 			<ul id="appscategories">
-				<AppNavigationItem v-for="item in menu" :key="item.key" :item="item" />
+				<AppNavigationItem
+					id="app-category-your-apps"
+					:to="{ name: 'apps' }"
+					:exact="true"
+					icon="icon-category-installed"
+					:title="t('settings', 'Your apps')" />
+				<AppNavigationItem
+					id="app-category-enabled"
+					:to="{ name: 'apps-category', params: { category: 'enabled' } }"
+					icon="icon-category-enabled"
+					:title="t('settings', 'Active apps')" />
+				<AppNavigationItem
+					id="app-category-disabled"
+					:to="{ name: 'apps-category', params: { category: 'disabled' } }"
+					icon="icon-category-disabled"
+					:title="t('settings', 'Disabled apps')" />
+				<AppNavigationItem
+					v-if="updateCount > 0"
+					id="app-category-updates"
+					:to="{ name: 'apps-category', params: { category: 'updates' } }"
+					icon="icon-download"
+					:title="t('settings', 'Updates')">
+					<AppNavigationCounter slot="counter">
+						{{ updateCount }}
+					</AppNavigationCounter>
+				</AppNavigationItem>
+				<AppNavigationItem
+					id="app-category-your-bundles"
+					:to="{ name: 'apps-category', params: { category: 'app-bundles' } }"
+					icon="icon-category-app-bundles"
+					:title="t('settings', 'App bundles')" />
+
+				<AppNavigationSpacer />
+
+				<!-- App store categories -->
+				<template v-if="settings.appstoreEnabled">
+					<AppNavigationItem
+						v-for="cat in categories"
+						:key="'icon-category-' + cat.ident"
+						:icon="'icon-category-' + cat.ident"
+						:to="{
+							name: 'apps-category',
+							params: { category: cat.ident },
+						}"
+						:title="cat.displayName" />
+				</template>
+
+				<AppNavigationItem
+					id="app-developer-docs"
+					href="settings.developerDocumentation"
+					:title="t('settings', 'Developer documentation') + ' ↗'" />
 			</ul>
 		</AppNavigation>
 		<AppContent class="app-settings-content" :class="{ 'icon-loading': loadingList }">
@@ -40,16 +90,17 @@
 </template>
 
 <script>
-import {
-	AppContent,
-	AppNavigation,
-	AppNavigationItem,
-	AppSidebar,
-	Content,
-} from 'nextcloud-vue'
-import AppList from '../components/AppList'
+import AppContent from '@nextcloud/vue/dist/Components/AppContent'
+import AppNavigation from '@nextcloud/vue/dist/Components/AppNavigation'
+import AppNavigationCounter from '@nextcloud/vue/dist/Components/AppNavigationCounter'
+import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
+import AppNavigationSpacer from '@nextcloud/vue/dist/Components/AppNavigationSpacer'
+import AppSidebar from '@nextcloud/vue/dist/Components/AppSidebar'
+import Content from '@nextcloud/vue/dist/Components/Content'
 import Vue from 'vue'
 import VueLocalStorage from 'vue-localstorage'
+
+import AppList from '../components/AppList'
 import AppDetails from '../components/AppDetails'
 
 Vue.use(VueLocalStorage)
@@ -58,12 +109,14 @@ export default {
 	name: 'Apps',
 	components: {
 		AppContent,
+		AppDetails,
+		AppList,
 		AppNavigation,
+		AppNavigationCounter,
 		AppNavigationItem,
+		AppNavigationSpacer,
 		AppSidebar,
 		Content,
-		AppDetails,
-		AppList,
 	},
 	props: {
 		category: {
@@ -102,95 +155,6 @@ export default {
 		settings() {
 			return this.$store.getters.getServerData
 		},
-
-		// BUILD APP NAVIGATION MENU OBJECT
-		menu() {
-			// Data provided php side
-			let categories = this.$store.getters.getCategories
-			categories = Array.isArray(categories) ? categories : []
-
-			// Map groups
-			categories = categories.map(category => {
-				const item = {}
-				item.id = 'app-category-' + category.ident
-				item.icon = 'icon-category-' + category.ident
-				item.classes = []							// empty classes, active will be set later
-				item.router = {								// router link to
-					name: 'apps-category',
-					params: { category: category.ident },
-				}
-				item.text = category.displayName
-
-				return item
-			})
-
-			// Add everyone group
-			const defaultCategories = [
-				{
-					id: 'app-category-your-apps',
-					classes: [],
-					router: { name: 'apps' },
-					icon: 'icon-category-installed',
-					text: t('settings', 'Your apps'),
-				},
-				{
-					id: 'app-category-enabled',
-					classes: [],
-					icon: 'icon-category-enabled',
-					router: { name: 'apps-category', params: { category: 'enabled' } },
-					text: t('settings', 'Active apps'),
-				}, {
-					id: 'app-category-disabled',
-					classes: [],
-					icon: 'icon-category-disabled',
-					router: { name: 'apps-category', params: { category: 'disabled' } },
-					text: t('settings', 'Disabled apps'),
-				},
-			]
-
-			if (!this.settings.appstoreEnabled) {
-				return defaultCategories
-			}
-
-			if (this.$store.getters.getUpdateCount > 0) {
-				defaultCategories.push({
-					id: 'app-category-updates',
-					classes: [],
-					icon: 'icon-download',
-					router: { name: 'apps-category', params: { category: 'updates' } },
-					text: t('settings', 'Updates'),
-					utils: { counter: this.$store.getters.getUpdateCount },
-				})
-			}
-
-			defaultCategories.push({
-				id: 'app-category-app-bundles',
-				classes: [],
-				icon: 'icon-category-app-bundles',
-				router: { name: 'apps-category', params: { category: 'app-bundles' } },
-				text: t('settings', 'App bundles'),
-			})
-
-			categories = defaultCategories.concat(categories)
-
-			// Set current group as active
-			const activeGroup = categories.findIndex(group => group.id === 'app-category-' + this.category)
-			if (activeGroup >= 0) {
-				categories[activeGroup].classes.push('active')
-			} else {
-				categories[0].classes.push('active')
-			}
-
-			categories.push({
-				id: 'app-developer-docs',
-				classes: [],
-				href: this.settings.developerDocumentation,
-				text: t('settings', 'Developer documentation') + ' ↗',
-			})
-
-			// Return
-			return categories
-		},
 	},
 	watch: {
 		category: function(val, old) {

apps/settings/src/views/Users.vue

@@ -28,7 +28,70 @@
 				button-class="icon-add"
 				@click="toggleNewUserMenu" />
 			<ul id="usergrouplist">
-				<AppNavigationItem v-for="item in menu" :key="item.key" :item="item" />
+				<AppNavigationItem
+					id="addgroup"
+					ref="addGroup"
+					:edit-placeholder="t('settings', 'Enter group name')"
+					:editable="true"
+					:loading="loadingAddGroup"
+					:title="t('settings', 'Add group')"
+					icon="icon-add"
+					@click="toggleAddGroupEntry(true)"
+					@update:title="createGroup" />
+				<AppNavigationItem
+					id="everyone"
+					:exact="true"
+					:title="t('settings', 'Everyone')"
+					:to="{ name: 'users' }"
+					icon="icon-contacts-dark">
+					<AppNavigationCounter v-if="userCount > 0" slot="counter">
+						{{ userCount }}
+					</AppNavigationCounter>
+				</AppNavigationItem>
+				<AppNavigationItem
+					id="admin"
+					:exact="true"
+					:title="t('settings', 'Admins')"
+					:to="{ name: 'users', params: { selectedGroup: 'admin' } }"
+					icon="icon-user-admin">
+					<AppNavigationCounter v-if="adminGroupMenu.count" slot="counter">
+						{{ adminGroupMenu.count }}
+					</AppNavigationCounter>
+				</AppNavigationItem>
+
+				<!-- Hide the disabled if none, if we don't have the data (-1) show it -->
+				<AppNavigationItem
+					v-if="disabledGroupMenu.usercount > 0 || disabledGroupMenu.usercount === -1"
+					id="disabled"
+					:exact="true"
+					:title="t('settings', 'Disabled users')"
+					:to="{ name: 'users', params: { selectedGroup: 'disabled' } }"
+					icon="icon-disabled-users">
+					<AppNavigationCounter v-if="disabledGroupMenu.usercount > 0" slot="counter">
+						{{ disabledGroupMenu.usercount }}
+					</AppNavigationCounter>
+				</AppNavigationItem>
+
+				<AppNavigationCaption v-if="groupList.length > 0" :title="t('settings', 'Groups')" />
+				<AppNavigationItem
+					v-for="group in groupList"
+					:id="group.id"
+					:key="group.id"
+					:exact="true"
+					:title="group.title"
+					:to="{ name: 'users', params: { selectedGroup: group.id } }">
+					<AppNavigationCounter v-if="group.count" slot="counter">
+						{{ group.count }}
+					</AppNavigationCounter>
+					<template slot="actions">
+						<ActionButton
+							v-if="group.id !== 'admin' && group.id !== 'disabled' && settings.isAdmin"
+							icon="icon-delete"
+							@click="removeGroup(group.id)">
+							{{ t('settings', 'Remove group') }}
+						</ActionButton>
+					</template>
+				</AppNavigationItem>
 			</ul>
 			<AppNavigationSettings>
 				<div>
@@ -85,17 +148,19 @@
 </template>
 
 <script>
+import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
+import AppContent from '@nextcloud/vue/dist/Components/AppContent'
+import AppNavigation from '@nextcloud/vue/dist/Components/AppNavigation'
+import AppNavigationCaption from '@nextcloud/vue/dist/Components/AppNavigationCaption'
+import AppNavigationCounter from '@nextcloud/vue/dist/Components/AppNavigationCounter'
+import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
+import AppNavigationNew from '@nextcloud/vue/dist/Components/AppNavigationNew'
+import AppNavigationSettings from '@nextcloud/vue/dist/Components/AppNavigationSettings'
+import Content from '@nextcloud/vue/dist/Components/Content'
+import Multiselect from '@nextcloud/vue/dist/Components/Multiselect'
 import Vue from 'vue'
 import VueLocalStorage from 'vue-localstorage'
-import {
-	AppContent,
-	AppNavigation,
-	AppNavigationItem,
-	AppNavigationNew,
-	AppNavigationSettings,
-	Content,
-	Multiselect,
-} from 'nextcloud-vue'
+
 import UserList from '../components/UserList'
 
 Vue.use(VueLocalStorage)
@@ -103,14 +168,17 @@ Vue.use(VueLocalStorage)
 export default {
 	name: 'Users',
 	components: {
+		ActionButton,
 		AppContent,
 		AppNavigation,
+		AppNavigationCaption,
+		AppNavigationCounter,
 		AppNavigationItem,
 		AppNavigationNew,
 		AppNavigationSettings,
 		Content,
-		UserList,
 		Multiselect,
+		UserList,
 	},
 	props: {
 		selectedGroup: {
@@ -125,7 +193,6 @@ export default {
 			// temporary value used for multiselect change
 			selectedQuota: false,
 			externalActions: [],
-			showAddGroupEntry: false,
 			loadingAddGroup: false,
 			showConfig: {
 				showStoragePath: false,
@@ -140,6 +207,9 @@ export default {
 		users() {
 			return this.$store.getters.getUsers
 		},
+		groups() {
+			return this.$store.getters.getGroups
+		},
 		usersOffset() {
 			return this.$store.getters.getUsersOffset
 		},
@@ -206,134 +276,20 @@ export default {
 
 		},
 
-		// BUILD APP NAVIGATION MENU OBJECT
-		menu() {
-			// Data provided php side
-			const self = this
-			let groups = this.$store.getters.getGroups
-			groups = Array.isArray(groups) ? groups : []
-
-			// Map groups
-			groups = groups.map(group => {
-				const item = {}
-				item.id = group.id.replace(' ', '_')
-				item.key = item.id
-				item.utils = {}
-
-				// router link to
-				item.router = {
-					name: 'group',
-					params: { selectedGroup: group.id },
-				}
-
-				// group name
-				item.text = group.name
-				item.title = group.name
-
-				// users count for all groups
-				if (group.usercount - group.disabled > 0 || group.usercount === -1) {
-					item.utils.counter = group.usercount - group.disabled
-				}
-
-				if (item.id !== 'admin' && item.id !== 'disabled' && this.settings.isAdmin) {
-					// add delete button on real groups
-					item.utils.actions = [{
-						icon: 'icon-delete',
-						text: t('settings', 'Remove group'),
-						action: function() {
-							self.removeGroup(group.id)
-						},
-					}]
-				}
-				return item
-			})
-
-			// Every item is added on top of the array, so we're going backward
-			// Groups, separator, disabled, admin, everyone
-
-			// Add separator
-			let realGroups = groups.find((group) => { return group.id !== 'disabled' && group.id !== 'admin' })
-			realGroups = typeof realGroups === 'undefined' ? [] : realGroups
-			realGroups = Array.isArray(realGroups) ? realGroups : [realGroups]
-			if (realGroups.length > 0) {
-				const separator = {
-					caption: true,
-					text: t('settings', 'Groups'),
-				}
-				groups.unshift(separator)
-			}
-
-			// Adjust admin and disabled groups
-			const adminGroup = groups.find(group => group.id === 'admin')
-			const disabledGroup = groups.find(group => group.id === 'disabled')
-
-			// filter out admin and disabled
-			groups = groups.filter(group => ['admin', 'disabled'].indexOf(group.id) === -1)
-
-			if (adminGroup && adminGroup.text) {
-				adminGroup.text = t('settings', 'Admins')	// rename admin group
-				adminGroup.icon = 'icon-user-admin'			// set icon
-				groups.unshift(adminGroup)					// add admin group if present
-			}
-			if (disabledGroup && disabledGroup.text) {
-				disabledGroup.text = t('settings', 'Disabled users')	// rename disabled group
-				disabledGroup.icon = 'icon-disabled-users'				// set icon
-				if (disabledGroup.utils && (
-					disabledGroup.utils.counter > 0						// add disabled if not empty
-					|| disabledGroup.utils.counter === -1)				// add disabled if ldap enabled
-				) {
-					groups.unshift(disabledGroup)
-					if (disabledGroup.utils.counter === -1) {
-						// hides the counter instead of showing -1
-						delete disabledGroup.utils.counter
-					}
-				}
-			}
-
-			// Add everyone group
-			const everyoneGroup = {
-				id: 'everyone',
-				key: 'everyone',
-				icon: 'icon-contacts-dark',
-				router: { name: 'users' },
-				text: t('settings', 'Everyone'),
-			}
-			// users count
-			if (this.userCount > 0) {
-				Vue.set(everyoneGroup, 'utils', {
-					counter: this.userCount,
-				})
-			}
-			groups.unshift(everyoneGroup)
-
-			const addGroup = {
-				id: 'addgroup',
-				key: 'addgroup',
-				icon: 'icon-add',
-				text: t('settings', 'Add group'),
-				classes: this.loadingAddGroup ? 'icon-loading-small' : '',
-			}
-			if (this.showAddGroupEntry) {
-				Vue.set(addGroup, 'edit', {
-					text: t('settings', 'Add group'),
-					action: this.createGroup,
-					reset: function() {
-						self.showAddGroupEntry = false
-					},
-				})
-				addGroup.classes = 'editing'
-			} else {
-				Vue.set(addGroup, 'action', function() {
-					self.showAddGroupEntry = true
-					// focus input
-					Vue.nextTick(() => {
-						window.addgroup.querySelector('form > input[type="text"]').focus()
-					})
-				})
-			}
-			groups.unshift(addGroup)
+		groupList() {
+			const groups = Array.isArray(this.groups) ? this.groups : []
 
 			return groups
+				// filter out disabled and admin
+				.filter(group => group.id !== 'disabled' && group.id !== 'admin')
+				.map(group => this.formatGroupMenu(group))
+		},
+
+		adminGroupMenu() {
+			return this.formatGroupMenu(this.groups.find(group => group.id === 'admin'))
+		},
+		disabledGroupMenu() {
+			return this.formatGroupMenu(this.groups.find(group => group.id === 'disabled'))
 		},
 	},
 	beforeMount() {
@@ -446,26 +402,81 @@ export default {
 		/**
 		 * Create a new group
 		 *
-		 * @param {Object} event The form submit event
+		 * @param {string} gid The group id
 		 */
-		createGroup(event) {
-			const gid = event.target[0].value
-			this.loadingAddGroup = true
-			this.$store.dispatch('addGroup', gid)
-				.then(() => {
-					this.showAddGroupEntry = false
-					this.loadingAddGroup = false
-					this.$router.push({
-						name: 'group',
-						params: {
-							selectedGroup: gid,
-						},
-					})
+		async createGroup(gid) {
+			// group is not valid
+			if (gid.trim() === '') {
+				Vue.nextTick(() => {
+					this.toggleAddGroupEntry(true)
 				})
-				.catch(() => {
-					this.loadingAddGroup = false
+				return
+			}
+
+			try {
+				this.loadingAddGroup = true
+				await this.$store.dispatch('addGroup', gid.trim())
+
+				this.toggleAddGroupEntry(false)
+				this.$router.push({
+					name: 'group',
+					params: {
+						selectedGroup: gid.trim(),
+					},
 				})
+			} catch {
+				this.toggleAddGroupEntry(true)
+			} finally {
+				this.loadingAddGroup = false
+			}
+		},
+
+		/**
+		 * Toggle the add group entry editing state
+		 * @param {boolean} [state] set state instead of toggling
+		 */
+		toggleAddGroupEntry(state) {
+			if (state === undefined) {
+				state = !this.$refs.addGroup.editing
+			}
+			this.$refs.addGroup.editing = state
+
+			// focus input
+			Vue.nextTick(() => {
+				if (this.$refs.addGroup.$el) {
+					const input = this.$refs.addGroup.$el.querySelector('form > input[type="text"]')
+					if (input) {
+						input.focus()
+					}
+				}
+			})
+		},
+
+		/**
+		 * Format a group to a menu entry
+		 * @param {Object} group the group
+		 * @returns {Object}
+		 */
+		formatGroupMenu(group) {
+			const item = {}
+			item.id = group.id.replace(' ', '_')
+			item.title = group.name
+			item.usercount = group.usercount
+
+			// users count for all groups
+			if (group.usercount - group.disabled > 0) {
+				item.count = group.usercount - group.disabled
+			}
+
+			return item
 		},
 	},
 }
 </script>
+
+<style lang="scss" scoped>
+// force hiding the editing action for the add group entry
+#usergrouplist #addgroup::v-deep .app-navigation-entry__utils {
+	display: none;
+}
+</style>

apps/updatenotification/src/components/UpdateNotification.vue

@@ -109,7 +109,7 @@
 </template>
 
 <script>
-import { PopoverMenu, Multiselect } from 'nextcloud-vue'
+import { PopoverMenu, Multiselect } from '@nextcloud/vue'
 import { VTooltip } from 'v-tooltip'
 import ClickOutside from 'vue-click-outside'
 

apps/workflowengine/src/components/Check.vue

@@ -41,9 +41,9 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
-import { Actions } from 'nextcloud-vue/dist/Components/Actions'
-import { ActionButton } from 'nextcloud-vue/dist/Components/ActionButton'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
+import { Actions } from '@nextcloud/vue/dist/Components/Actions'
+import { ActionButton } from '@nextcloud/vue/dist/Components/ActionButton'
 import ClickOutside from 'vue-click-outside'
 
 export default {

apps/workflowengine/src/components/Checks/FileMimeType.vue

@@ -51,7 +51,7 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
 import valueMixin from './../../mixins/valueMixin'
 
 export default {

apps/workflowengine/src/components/Checks/MultiselectTag/MultiselectTag.vue

@@ -41,7 +41,7 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
 import { searchTags } from './api'
 
 let uuid = 0

apps/workflowengine/src/components/Checks/RequestTime.vue

@@ -20,7 +20,7 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
 import moment from 'moment-timezone'
 import valueMixin from '../../mixins/valueMixin'
 

apps/workflowengine/src/components/Checks/RequestURL.vue

@@ -51,7 +51,7 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
 import valueMixin from '../../mixins/valueMixin'
 
 export default {

apps/workflowengine/src/components/Checks/RequestUserAgent.vue

@@ -53,7 +53,7 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
 import valueMixin from '../../mixins/valueMixin'
 
 export default {

apps/workflowengine/src/components/Checks/RequestUserGroup.vue

@@ -34,7 +34,7 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
 import axios from '@nextcloud/axios'
 
 const groups = []

apps/workflowengine/src/components/Event.vue

@@ -27,7 +27,7 @@
 </template>
 
 <script>
-import { Multiselect } from 'nextcloud-vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
 
 export default {
 	name: 'Event',

apps/workflowengine/src/components/Rule.vue

@@ -51,9 +51,9 @@
 </template>
 
 <script>
-import { Tooltip } from 'nextcloud-vue/dist/Directives/Tooltip'
-import { Actions } from 'nextcloud-vue/dist/Components/Actions'
-import { ActionButton } from 'nextcloud-vue/dist/Components/ActionButton'
+import { Tooltip } from '@nextcloud/vue/dist/Directives/Tooltip'
+import { Actions } from '@nextcloud/vue/dist/Components/Actions'
+import { ActionButton } from '@nextcloud/vue/dist/Components/ActionButton'
 import Event from './Event'
 import Check from './Check'
 import Operation from './Operation'

package-lock.json

@@ -3025,12 +3025,12 @@
       }
     },
     "@nextcloud/vue": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-1.2.2.tgz",
-      "integrity": "sha512-9yrW7K7Fsfj5/s01+5V/a3AO9WxLK8NaiWc/ZYM63bvJ8gKzPqrtU0S0hhZRdO492DYSdeUNAA4nIorTsN1A7Q==",
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/@nextcloud/vue/-/vue-1.2.5.tgz",
+      "integrity": "sha512-PW7QKBYFoUwU3TuKx3qAVm/7bNENh7jiMO/atkAAstWgupXiqv59j24mejZRQeGECsP2AzF9nWbbwT6iM7YcwQ==",
       "requires": {
-        "@nextcloud/axios": "^0.5.0",
-        "@nextcloud/router": "^0.1.0",
+        "@nextcloud/axios": "^1.1.0",
+        "@nextcloud/router": "^1.0.0",
         "core-js": "^3.4.4",
         "escape-html": "^1.0.3",
         "hammerjs": "^2.0.8",
@@ -3045,63 +3045,10 @@
         "vue2-datepicker": "^2.10.0"
       },
       "dependencies": {
-        "@nextcloud/auth": {
-          "version": "0.3.1",
-          "resolved": "https://registry.npmjs.org/@nextcloud/auth/-/auth-0.3.1.tgz",
-          "integrity": "sha512-kx5VfB2SWG+BNudoggnjQrmxr559rCDANVLnaDDKmCujToxv0l3kNMTBUUcYhSvv8dyYaD/ZTaXBUON9ZLm9lw==",
-          "requires": {
-            "@nextcloud/event-bus": "^0.2.0",
-            "core-js": "3.2.1"
-          },
-          "dependencies": {
-            "@nextcloud/event-bus": {
-              "version": "0.2.1",
-              "resolved": "https://registry.npmjs.org/@nextcloud/event-bus/-/event-bus-0.2.1.tgz",
-              "integrity": "sha512-yerEPTA5lnJ1JV8qYK6sHMWW8m6fxuMEtptVgv7WnGCy2l5rvxDh9vqwk72qX/Z9i2OrC7Jy382TMYbke8b2Qw==",
-              "requires": {
-                "core-js": "^3.1.4"
-              }
-            },
-            "core-js": {
-              "version": "3.2.1",
-              "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.2.1.tgz",
-              "integrity": "sha512-Qa5XSVefSVPRxy2XfUC13WbvqkxhkwB3ve+pgCQveNgYzbM/UxZeu1dcOX/xr4UmfUd+muuvsaxilQzCyUurMw=="
-            }
-          }
-        },
-        "@nextcloud/axios": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/@nextcloud/axios/-/axios-0.5.0.tgz",
-          "integrity": "sha512-cnf/bgyOpiUty50VMfmtWYNvq0n2G4YJpNldUcY/LJrB5ENyuiv7vJbOl9R40pb6NztWkmDyTK8Ycl1VlzcYrA==",
-          "requires": {
-            "@babel/cli": "^7.6.2",
-            "@babel/core": "^7.6.2",
-            "@babel/preset-env": "^7.6.2",
-            "@babel/preset-typescript": "^7.6.0",
-            "@nextcloud/auth": "^0.3.1",
-            "axios": "^0.19.0",
-            "core-js": "^3.2.1"
-          }
-        },
-        "@nextcloud/router": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/@nextcloud/router/-/router-0.1.0.tgz",
-          "integrity": "sha512-adHnDQrnSMX/O9hYJfLVj9PnNJBISLchbzltKvI7s/WJhKF6++qFTx3G5eNEeXbI52Yb8lKIyLRrqC4JWyLmvA==",
-          "requires": {
-            "core-js": "3.1.4"
-          },
-          "dependencies": {
-            "core-js": {
-              "version": "3.1.4",
-              "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.1.4.tgz",
-              "integrity": "sha512-YNZN8lt82XIMLnLirj9MhKDFZHalwzzrL9YLt6eb0T5D0EDl4IQ90IGkua8mHbnxNrkj1d8hbdizMc0Qmg1WnQ=="
-            }
-          }
-        },
         "core-js": {
-          "version": "3.4.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.4.7.tgz",
-          "integrity": "sha512-qaPVGw30J1wQ0GR3GvoPqlGf9GZfKKF4kFC7kiHlcsPTqH3txrs9crCp3ZiMAXuSenhz89Jnl4GZs/67S5VOSg=="
+          "version": "3.6.4",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.4.tgz",
+          "integrity": "sha512-4paDGScNgZP2IXXilaffL9X7968RuvwlkK3xWtZRVqgd8SYNiVKRJvkFd1aqqEuPfN7E68ZHEp9hDj6lHj4Hyw=="
         },
         "v-click-outside": {
           "version": "3.0.0",
@@ -7948,14 +7895,6 @@
       "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.1.tgz",
       "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw=="
     },
-    "nextcloud-axios": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/nextcloud-axios/-/nextcloud-axios-0.2.1.tgz",
-      "integrity": "sha512-gzW/TXXGkxSgaIhLyPGOZ8Gs8t43i7cUpZNtDQh/UGecSn62AqjpSms+8YRw0NSJ0nhOdlqhFCFw/wb9XfYVjg==",
-      "requires": {
-        "axios": "^0.19.0"
-      }
-    },
     "nextcloud-password-confirmation": {
       "version": "0.4.2",
       "resolved": "https://registry.npmjs.org/nextcloud-password-confirmation/-/nextcloud-password-confirmation-0.4.2.tgz",
@@ -7976,24 +7915,6 @@
         }
       }
     },
-    "nextcloud-vue": {
-      "version": "0.12.11",
-      "resolved": "https://registry.npmjs.org/nextcloud-vue/-/nextcloud-vue-0.12.11.tgz",
-      "integrity": "sha512-3zzgSRpWtPMqIi+DpZsh0YxACACHv+j8bWmMYyiUJVB2JjVADYpzb/lbUxQCE/A8rB3N75zIfkQOf0gd9BC9oA==",
-      "requires": {
-        "@babel/polyfill": "^7.4.4",
-        "escape-html": "^1.0.3",
-        "hammerjs": "^2.0.8",
-        "md5": "^2.2.1",
-        "nextcloud-axios": "^0.2.0",
-        "v-click-outside": "^2.1.4",
-        "v-tooltip": "^2.0.0-rc.33",
-        "vue": "^2.6.7",
-        "vue-multiselect": "^2.1.3",
-        "vue-visible": "^1.0.2",
-        "vue2-datepicker": "^2.10.0"
-      }
-    },
     "nextcloud-vue-collections": {
       "version": "0.7.1",
       "resolved": "https://registry.npmjs.org/nextcloud-vue-collections/-/nextcloud-vue-collections-0.7.1.tgz",
@@ -10661,11 +10582,6 @@
       "integrity": "sha512-pW0No1RGHgzlpHJO1nsVrHKpOEIxkGg1xB+v0ZmdNH5OAeAwzAVrCnI2/6Mtx+Uys6iaylxa+D3g4j63IKKjSQ==",
       "dev": true
     },
-    "v-click-outside": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmjs.org/v-click-outside/-/v-click-outside-2.1.5.tgz",
-      "integrity": "sha512-VPNCOTZK6WZy73lcWc+R7IW1uaBFEO3/Csrs5CzWVOdvE30V8Y1+BE/BtTlcEmeDGx0eqdE7bSCg55Jj37PMJg=="
-    },
     "v-tooltip": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/v-tooltip/-/v-tooltip-2.0.2.tgz",

package.json

@@ -34,6 +34,7 @@
     "@nextcloud/logger": "^1.0.0",
     "@nextcloud/paths": "^1.1.0",
     "@nextcloud/router": "^1.0.0",
+    "@nextcloud/vue": "^1.2.5",
     "autosize": "^4.0.2",
     "backbone": "^1.4.0",
     "blueimp-md5": "^2.12.0",
@@ -56,7 +57,6 @@
     "moment-timezone": "^0.5.27",
     "nextcloud-password-confirmation": "^0.4.2",
     "nextcloud-router": "0.0.9",
-    "nextcloud-vue": "^0.12.11",
     "nextcloud-vue-collections": "^0.7.1",
     "p-limit": "^2.2.2",
     "p-queue": "^6.2.1",