Merge pull request #15506 from nextcloud/dependabot/npm_and_yarn/nextcloud-vue-0.11.1

Bump nextcloud-vue from 0.8.0 to 0.11.1

apps/files_sharing/js/dist/files_sharing.1.js

@@ -132,7 +132,7 @@ __webpack_require__.r(__webpack_exports__);
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var nextcloud_vue_collections__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! nextcloud-vue-collections */ "./node_modules/nextcloud-vue-collections/dist/nextcloud-vue-collections.js");
+!(function webpackMissingModule() { var e = new Error("Cannot find module 'nextcloud-vue-collections'"); e.code = 'MODULE_NOT_FOUND'; throw e; }());
 //
 //
 //
@@ -179,7 +179,7 @@ __webpack_require__.r(__webpack_exports__);
     }
   },
   components: {
-    CollectionList: nextcloud_vue_collections__WEBPACK_IMPORTED_MODULE_0__["CollectionList"]
+    CollectionList: !(function webpackMissingModule() { var e = new Error("Cannot find module 'nextcloud-vue-collections'"); e.code = 'MODULE_NOT_FOUND'; throw e; }())
   }
 });
 

apps/files_sharing/js/dist/files_sharing.4.js

@@ -1,4 +1,4 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[4],{14:function(e,o,i){"use strict";i.r(o);var n=i(17),l=i(25),r=i(26),s=i.n(r),a=i(27),u={name:"CollaborationView",computed:{fileId:function(){return this.$root.model&&this.$root.model.id?""+this.$root.model.id:null},filename:function(){return this.$root.model&&this.$root.model.name?""+this.$root.model.name:""}},components:{CollectionList:i(32).a}},c=i(58),d=Object(c.a)(u,function(){var t=this.$createElement,e=this._self._c||t;return this.fileId?e("collection-list",{attrs:{type:"file",id:this.fileId,name:this.filename}}):this._e()},[],!1,null,null,null).exports;i.d(o,"Vue",function(){return n.a}),i.d(o,"View",function(){return d}),
+(window.webpackJsonp=window.webpackJsonp||[]).push([[4],{14:function(e,o,i){"use strict";i.r(o);var n=i(17),l=i(19),r=i(26),u=i(29),d=i.n(u),a=i(30),s={name:"CollaborationView",computed:{fileId:function(){return this.$root.model&&this.$root.model.id?""+this.$root.model.id:null},filename:function(){return this.$root.model&&this.$root.model.name?""+this.$root.model.name:""}},components:{CollectionList:i(33).a}},c=i(59),f=Object(c.a)(s,function(){var e=this.$createElement,t=this._self._c||e;return this.fileId?t("collection-list",{attrs:{type:"file",id:this.fileId,name:this.filename}}):this._e()},[],!1,null,null,null).exports;i.d(o,"Vue",function(){return n.default}),i.d(o,"View",function(){return f}),
 /*
  * @copyright Copyright (c) 2019 Julius Härtl <jus@bitgrid.net>
  *
@@ -20,5 +20,5 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  *
  */
-n.a.prototype.t=t,n.a.component("PopoverMenu",l.PopoverMenu),n.a.directive("ClickOutside",s.a),n.a.directive("Tooltip",a.a)}}]);
+n.default.prototype.t=t,n.default.component("PopoverMenu",r.PopoverMenu),n.default.directive("ClickOutside",d.a),n.default.directive("Tooltip",a.a),n.default.use(l.a)}}]);
 //# sourceMappingURL=files_sharing.4.js.map

apps/files_sharing/src/collaborationresources.js

@@ -21,15 +21,16 @@
  */
 
 import Vue from 'vue';
+import Vuex from 'vuex';
 import { PopoverMenu } from 'nextcloud-vue';
 import ClickOutside from 'vue-click-outside';
 import { VTooltip } from 'v-tooltip';
 
 Vue.prototype.t = t;
-
 Vue.component('PopoverMenu', PopoverMenu);
 Vue.directive('ClickOutside', ClickOutside);
 Vue.directive('Tooltip', VTooltip);
+Vue.use(Vuex);
 
 import View from './views/CollaborationView';
 

apps/files_sharing/webpack.js

@@ -31,28 +31,12 @@ module.exports = {
 			{
 				test: /\.js$/,
 				loader: 'babel-loader',
-				exclude: /node_modules/,
+				exclude: /node_modules/
-				options: {
-					plugins: ['@babel/plugin-syntax-dynamic-import', 'transform-es2015-arrow-functions']
-				}
-			},
-			{
-				test: /\.(png|jpg|gif|svg)$/,
-				loader: 'file-loader',
-				options: {
-					name: '[name].[ext]?[hash]'
-				}
 			}
 		]
 	},
 	plugins: [new VueLoaderPlugin()],
 	resolve: {
-		alias: {
+		extensions: ['*', '.js', '.vue', '.json']
-			vue$: 'vue/dist/vue.runtime.esm.js',
-		},
-		extensions: ['*', '.js', '.vue', '.json'],
-		modules: [
-			path.join(__dirname, '../../node_modules')
-		]
 	},
 };

package-lock.json

@@ -4842,38 +4842,9 @@
       "integrity": "sha512-ZqnNDFNR0rCpifb29uoqyqd9IyVwNZrDePzmP6DbGiNStFrvnlOG8OTdIMSdC82bKzKAqzXU5L73kSQncG8oXA=="
     },
     "nextcloud-vue": {
-      "version": "0.8.0",
+      "version": "0.11.3",
-      "resolved": "https://registry.npmjs.org/nextcloud-vue/-/nextcloud-vue-0.8.0.tgz",
+      "resolved": "https://registry.npmjs.org/nextcloud-vue/-/nextcloud-vue-0.11.3.tgz",
-      "integrity": "sha512-6qXcWTgtrbM4W1AjyHSWn0cHOFm/Q39A//OibrY7M332orQnDvCrDoGloUUOW6+vbXJarI+L7t7scL6mkRw4Qg==",
+      "integrity": "sha512-lVih3gUuRZf5B82+XjLuiw3qp2tvAITF512mTyhHLtAzBWEiBfWsidMP10Nntql4zAEoLTZvLaQ1izFglMUDmw==",
-      "requires": {
-        "hammerjs": "^2.0.8",
-        "md5": "^2.2.1",
-        "nextcloud-axios": "^0.1.3",
-        "v-tooltip": "^2.0.0-rc.33",
-        "vue": "^2.6.7",
-        "vue-click-outside": "^1.0.7",
-        "vue-multiselect": "^2.1.3",
-        "vue2-datepicker": "^2.10.0"
-      }
-    },
-    "nextcloud-vue-collections": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/nextcloud-vue-collections/-/nextcloud-vue-collections-0.4.0.tgz",
-      "integrity": "sha512-UxgormIFW4CD9dUsobRzIuQt1PQXkT+EI2KCp1CoAiJiurzf5yO9BmmS3gN9lWZa1+EZvLqljapvAlyntWwX6Q==",
-      "requires": {
-        "lodash": "^4.17.11",
-        "nextcloud-axios": "^0.1.2",
-        "nextcloud-vue": "^0.9.0",
-        "v-tooltip": "^2.0.0-rc.33",
-        "vue": "^2.6.6",
-        "vue-click-outside": "^1.0.7",
-        "vuex": "^3.1.0"
-      },
-      "dependencies": {
-        "nextcloud-vue": {
-          "version": "0.9.7",
-          "resolved": "https://registry.npmjs.org/nextcloud-vue/-/nextcloud-vue-0.9.7.tgz",
-          "integrity": "sha512-47mr8kBQfJW1oNTgKjFdktgX6+Z0c6jryd1xq+515jLef3o1DWdMmRLF5Yab3TTUdha/aG3dL0lpVQ6Z3jf9Aw==",
       "requires": {
         "hammerjs": "^2.0.8",
         "md5": "^2.2.1",
@@ -4885,6 +4856,29 @@
         "vue-visible": "^1.0.2",
         "vue2-datepicker": "^2.10.0"
       }
+    },
+    "nextcloud-vue-collections": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/nextcloud-vue-collections/-/nextcloud-vue-collections-0.5.2.tgz",
+      "integrity": "sha512-trqoV2cPhjwelzqE5bhxm6jBDdE9IxrPo1EXjebEBNB3GXT76cL0BpxVf/lZQYXQ6ylKxbLL4tPwEFUT0scyxw==",
+      "requires": {
+        "lodash": "^4.17.11",
+        "nextcloud-axios": "^0.1.2",
+        "nextcloud-vue": "^0.11.1",
+        "v-tooltip": "^3.0.0-alpha.7",
+        "vue": "^2.6.6",
+        "vue-click-outside": "^1.0.7",
+        "vuex": "^3.1.0"
+      },
+      "dependencies": {
+        "v-tooltip": {
+          "version": "3.0.0-alpha.7",
+          "resolved": "https://registry.npmjs.org/v-tooltip/-/v-tooltip-3.0.0-alpha.7.tgz",
+          "integrity": "sha512-BJM1tYm/Idsa4xjY8nsZ/o329qEhnpAnKTI5fG2r5/aEFtmno9HJKT8+lmbHGpZhOnV8NCCg/9PuiCFPOT7/Lw==",
+          "requires": {
+            "popper.js": "^1.15.0",
+            "vue-resize": "^0.4.5"
+          }
         }
       }
     },
@@ -7255,9 +7249,9 @@
       "integrity": "sha512-yaX2its9XAJKGuQqf7LsiZHHSkxsIK8rmCOQOvEGEoF41blKRK8qr9my4qYoD6ikdLss4n8tKqYBecmaY0+WJg=="
     },
     "vue2-datepicker": {
-      "version": "2.10.0",
+      "version": "2.11.2",
-      "resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-2.10.0.tgz",
+      "resolved": "https://registry.npmjs.org/vue2-datepicker/-/vue2-datepicker-2.11.2.tgz",
-      "integrity": "sha512-WGL7ou0TdBiJQuHVp29BtBw3rSkLrIYwXWU/ELmaLdnAerI0EdGVAu7DvZV2iIxY4lsHyjqocApxdvXTmwLrAw==",
+      "integrity": "sha512-xGyIN5pMMdaKMnndSrzqW6LDST/e7PHcFt2uIp73OOMZMDAlhEmzroNtoYBwJEEzKnCNMo+ktcykgYljrE8y8Q==",
       "requires": {
         "fecha": "^2.3.3"
       }

package.json

@@ -43,8 +43,8 @@
     "moment": "^2.24.0",
     "nextcloud-axios": "^0.1.3",
     "nextcloud-password-confirmation": "^0.4.1",
-    "nextcloud-vue": "^0.8.0",
+    "nextcloud-vue": "^0.11.3",
-    "nextcloud-vue-collections": "^0.4.0",
+    "nextcloud-vue-collections": "^0.5.2",
     "snap.js": "^2.0.9",
     "strengthify": "git+https://github.com/MorrisJobke/strengthify.git#0.5.8",
     "underscore": "^1.9.1",

settings/src/components/AuthToken.vue

@@ -21,7 +21,7 @@
 
 <template>
 	<tr :data-id="token.id"
-		:class="{wiping}">
+		:class="wiping">
 		<td class="client">
 			<div :class="iconName.icon"></div>
 		</td>
@@ -41,17 +41,57 @@
 			<span class="last-activity" v-tooltip="lastActivity">{{lastActivityRelative}}</span>
 		</td>
 		<td class="more">
-			<Action v-if="!token.current"
+			<Actions v-if="!token.current"
 				:actions="actions"
-					v-bind:open.sync="actionOpen"
+				:open.sync="actionOpen"
-					v-tooltip="{content: t('settings', 'Device settings'), container: 'body'}"
+				v-tooltip.auto="{
-					tabindex="0"/>
+					content: t('settings', 'Device settings'),
+					container: 'body'
+				}">
+				<ActionCheckbox v-if="token.type === 1"
+					:checked="token.scope.filesystem"
+					@change.stop.prevent="$emit('toggleScope', token, 'filesystem', !token.scope.filesystem)">
+					<!-- TODO: add text/longtext with some description -->
+					{{ t('settings', 'Allow filesystem access') }}
+				</ActionCheckbox>
+				<ActionButton v-if="token.canRename"
+					icon="icon-rename"
+					@click.stop.prevent="startRename">
+					<!-- TODO: add text/longtext with some description -->
+					{{ t('settings', 'Rename') }}
+				</ActionButton>
+				
+				<!-- revoke & wipe -->
+				<template v-if="token.canDelete">
+					<template v-if="token.type !== 2">
+						<ActionButton icon="icon-delete"
+							@click.stop.prevent="revoke">
+							<!-- TODO: add text/longtext with some description -->
+							{{ t('settings', 'Revoke') }}
+						</ActionButton>
+						<ActionButton icon="icon-delete"
+							@click.stop.prevent="wipe">
+							{{ t('settings', 'Wipe device') }}
+						</ActionButton>
+					</template>
+					<ActionButton v-else-if="token.type === 2"
+						icon="icon-delete"
+						:title="t('settings', 'Revoke')"
+						@click.stop.prevent="revoke">
+						{{ t('settings', 'Revoking this token might prevent the wiping of your device if it hasn\'t started the wipe yet.') }}
+					</ActionButton>
+				</template>
+			</Actions>
 		</td>
 	</tr>
 </template>
 
 <script>
-	import {Action} from 'nextcloud-vue';
+import {
+	Actions,
+	ActionButton,
+	ActionCheckbox
+} from 'nextcloud-vue';
 
 const userAgentMap = {
 	ie: /(?:MSIE|Trident|Trident\/7.0; rv)[ :](\d+)/,
@@ -116,7 +156,9 @@
 export default {
 	name: "AuthToken",
 	components: {
-			Action,
+		Actions,
+		ActionButton,
+		ActionCheckbox
 	},
 	props: {
 		token: {
@@ -125,49 +167,6 @@
 		}
 	},
 	computed: {
-			actions () {
-				const actions = [];
-
-				if (this.token.type === 1) {
-					// TODO: add text/longtext with some description
-					actions.push({
-						input: 'checkbox',
-						action: () => this.$emit('toggleScope', this.token, 'filesystem', !this.token.scope.filesystem),
-						model: this.token.scope.filesystem,
-						text: t('settings', 'Allow filesystem access'),
-					});
-				}
-				if (this.token.canRename) {
-					// TODO: add text/longtext with some description
-					actions.push({
-						icon: 'icon-rename',
-						action: () => this.startRename(),
-						text: t('settings', 'Rename'),
-					});
-				}
-				if (this.token.canDelete && this.token.type !== 2) {
-					// TODO: add text/longtext with some description
-					actions.push({
-						icon: 'icon-delete',
-						action: () => this.$emit('delete', this.token),
-						text: t('settings', 'Revoke'),
-					});
-					actions.push({
-						icon: 'icon-delete',
-						action: this.wipe,
-						text: t('settings', 'Wipe device'),
-					});
-				} else if (this.token.canDelete && this.token.type === 2) {
-					actions.push({
-						icon: 'icon-delete',
-						action: () => this.$emit('delete', this.token),
-						text: t('settings', 'Revoke'),
-						longtext: t('settings', 'Revoking this token might prevent the wiping of your device if it hasn\'t started the wipe yet.'),
-					});
-				}
-
-				return actions;
-			},
 		lastActivityRelative () {
 			return OC.Util.relativeModifiedDate(this.token.lastActivity * 1000);
 		},
@@ -238,13 +237,16 @@
 		cancelRename() {
 			this.renaming = false;
 		},
+		revoke() {
+			this.actionOpen = false;
+			this.$emit('delete', this.token)
+		},
 		rename() {
 			this.renaming = false;
 			this.$emit('rename', this.token, this.newName);
 		},
 		wipe() {
 			this.actionOpen = false;
-
 			this.$emit('wipe', this.token);
 		}
 	}
@@ -266,7 +268,8 @@
 		&%icon {
 			overflow: visible;
 			position: relative;
-			width: 16px;
+			width: 44px;
+			height: 44px;
 		}
 
 		&.token-name {
@@ -287,6 +290,7 @@
 
 		&.more {
 			@extend %icon;
+			padding: 0 10px;
 		}
 
 		&.client {

settings/src/views/Apps.vue

@@ -21,25 +21,31 @@
   -->
 
 <template>
-	<AppContent app-name="settings" :class="{ 'with-app-sidebar': currentApp}"
+	<Content app-name="settings" :class="{ 'with-app-sidebar': currentApp}"
 	:content-class="{ 'icon-loading': loadingList }" :navigation-class="{ 'icon-loading': loading }">
-		<template #navigation>
+		<AppNavigation>
 			<ul id="appscategories">
 				<AppNavigationItem v-for="item in menu" :key="item.key" :item="item" />
 			</ul>
-		</template>
+		</AppNavigation>
-		<template #content class="app-settings-content" :class="{ 'icon-loading': loadingList }">
+		<AppContent class="app-settings-content" :class="{ 'icon-loading': loadingList }">
-			<app-list :category="category" :app="currentApp" :search="searchQuery"></app-list>
+			<AppList :category="category" :app="currentApp" :search="searchQuery" />
-		</template>
-		<template #sidebar v-if="id && currentApp" >
-			<app-details :category="category" :app="currentApp"></app-details>
-		</template>
 		</AppContent>
+		<AppSidebar v-if="id && currentApp" >
+			<AppDetails :category="category" :app="currentApp" />
+		</AppSidebar>
+	</Content>
 </template>
 
 <script>
-import { AppContent, AppNavigationItem } from 'nextcloud-vue';
+import { 
-import appList from '../components/appList';
+	AppContent,
+	AppNavigation,
+	AppNavigationItem,
+	AppSidebar,
+	Content
+} from 'nextcloud-vue';
+import AppList from '../components/appList';
 import Vue from 'vue';
 import VueLocalStorage from 'vue-localstorage'
 import AppDetails from '../components/appDetails';
@@ -60,9 +66,12 @@ export default {
 	},
 	components: {
 		AppContent,
-		AppDetails,
+		AppNavigation,
-		appList,
 		AppNavigationItem,
+		AppSidebar,
+		Content,
+		AppDetails,
+		AppList
 	},
 	methods: {
 		setSearch(query) {

settings/src/views/Users.vue

@@ -21,8 +21,8 @@
   -->
 
 <template>
-	<AppContent app-name="settings" :navigation-class="{ 'icon-loading': loadingAddGroup }">
+	<Content app-name="settings" :navigation-class="{ 'icon-loading': loadingAddGroup }">
-		<template #navigation>
+		<AppNavigation>
 			<AppNavigationNew button-id="new-user-button" :text="t('settings','New user')" button-class="icon-add" @click="toggleNewUserMenu" />
 			<ul id="usergrouplist">
 				<AppNavigationItem v-for="item in menu" :key="item.key" :item="item" />
@@ -30,12 +30,12 @@
 			<AppNavigationSettings>
 				<div>
 					<p>{{t('settings', 'Default quota:')}}</p>
-					<multiselect :value="defaultQuota" :options="quotaOptions"
+					<Multiselect :value="defaultQuota" :options="quotaOptions"
 								 tag-placeholder="create" :placeholder="t('settings', 'Select default quota')"
-								 label="label" track-by="id" class="multiselect-vue"
+								 label="label" track-by="id"
 								 :allowEmpty="false" :taggable="true"
 								 @tag="validateQuota" @input="setDefaultQuota">
-					</multiselect>
+					</Multiselect>
 
 				</div>
 				<div>
@@ -55,22 +55,27 @@
 					<label for="showStoragePath">{{t('settings', 'Show storage path')}}</label>
 				</div>
 			</AppNavigationSettings>
-		</template>
+		</AppNavigation>
-		<user-list #content :users="users" :showConfig="showConfig" :selectedGroup="selectedGroup" :externalActions="externalActions" />
+		<AppContent>
+			<UserList #content :users="users" :showConfig="showConfig" :selectedGroup="selectedGroup" :externalActions="externalActions" />
 		</AppContent>
+	</Content>
 </template>
 
 <script>
+import Vue from 'vue';
+import VueLocalStorage from 'vue-localstorage'
 import {
 	AppContent,
+	AppNavigation,
 	AppNavigationItem,
 	AppNavigationNew,
 	AppNavigationSettings,
+	AppSidebar,
+	Content,
+	Multiselect
 } from 'nextcloud-vue';
-import userList from '../components/userList';
+import UserList from '../components/userList';
-import Vue from 'vue';
-import VueLocalStorage from 'vue-localstorage'
-import Multiselect from 'vue-multiselect';
 import api from '../store/api';
 
 Vue.use(VueLocalStorage)
@@ -80,10 +85,13 @@ export default {
 	props: ['selectedGroup'],
 	components: {
 		AppContent,
+		AppNavigation,
 		AppNavigationItem,
 		AppNavigationNew,
 		AppNavigationSettings,
-		userList,
+		AppSidebar,
+		Content,
+		UserList,
 		Multiselect,
 	},
 	beforeMount() {