Fixed tabs and Language support

Signed-off-by: John Molakvoæ (skjnldsv) <[email protected]>
nextcloud · May 16, 2018 · f330655 · f330655
1 parent 6ada825
commit f330655
Show file tree

Hide file tree

Showing 9 changed files with 595 additions and 555 deletions.
diff --git a/settings/js/main.js b/settings/js/main.js
diff --git a/settings/src/.jshintrc b/settings/src/.jshintrc
@@ -1,3 +1,3 @@
 {
-    "esversion": 6
+	"esversion": 6
 }
diff --git a/settings/src/components/userList.vue b/settings/src/components/userList.vue
@@ -231,7 +231,7 @@ export default {
 			// revert form to original state
 			Object.assign(this.newUser, this.$options.data.call(this).newUser);
 			this.loading = false;
-        },
+		},
 		createUser() {
 			this.loading = true;
 			this.$store.dispatch('addUser', {

diff --git a/settings/src/components/userList/userRow.vue b/settings/src/components/userList/userRow.vue
@@ -343,7 +343,7 @@ export default {
 			let userid = this.user.id;
 			let gid = group.id;
 			return this.$store.dispatch('addUserGroup', {userid, gid})
-					.then(() => this.loading.groups = false);
+				.then(() => this.loading.groups = false);
 		},
 
 		/**
@@ -357,7 +357,7 @@ export default {
 			let userid = this.user.id;
 			let gid = group.id;
 			return this.$store.dispatch('removeUserGroup', {userid, gid})
-					.then(() => this.loading.groups = false);
+				.then(() => this.loading.groups = false);
 		},
 
 		/**
@@ -371,7 +371,7 @@ export default {
 			let userid = this.user.id;
 			let gid = group.id;
 			return this.$store.dispatch('addUserSubAdmin', {userid, gid})
-					.then(() => this.loading.subadmins = false);
+				.then(() => this.loading.subadmins = false);
 		},
 
 		/**
@@ -385,12 +385,11 @@ export default {
 			let userid = this.user.id;
 			let gid = group.id;
 			return this.$store.dispatch('removeUserSubAdmin', {userid, gid})
-					.then(() => this.loading.subadmins = false);
+				.then(() => this.loading.subadmins = false);
 		},
 
-
 		/**
-		 * Validate quota string to make sure it's a valid human file size
+		 * Dispatch quota set request
 		 * 
 		 * @param {string|Object} quota Quota in readable format '5 GB' or Object {id: '5 GB', label: '5GB'}
 		 * @returns {string}
@@ -407,24 +406,6 @@ export default {
 			return quota;
 		},
 
-
-		/**
-		 * Validate quota string to make sure it's a valid human file size
-		 * 
-		 * @param {string|Object} quota Quota in readable format '5 GB' or Object {id: '5 GB', label: '5GB'}
-		 * @returns {string}
-		 */
-		setUserLanguage(lang) {
-			this.loading.languages = true;
-			// ensure we only send the preset id
-			this.$store.dispatch('setUserData', {
-				userid: this.user.id, 
-				key: 'language',
-				value: lang.code
-			}).then(() => this.loading.languages = false);
-			return lang;
-		},
-
 		/**
 		 * Validate quota string to make sure it's a valid human file size
 		 * 
@@ -442,6 +423,23 @@ export default {
 			}
 			// if no valid doo not change
 			return false;
+		},
+
+		/**
+		 * Dispatch language set request
+		 * 
+		 * @param {Object} lang language object {code:'en', name:'English'}
+		 * @returns {Object}
+		 */
+		setUserLanguage(lang) {
+			this.loading.languages = true;
+			// ensure we only send the preset id
+			this.$store.dispatch('setUserData', {
+				userid: this.user.id, 
+				key: 'language',
+				value: lang.code
+			}).then(() => this.loading.languages = false);
+			return lang;
 		}
 	}
 }

diff --git a/settings/src/main.js b/settings/src/main.js
@@ -12,9 +12,9 @@ Vue.prototype.OC = OC;
 Vue.prototype.oc_userconfig = oc_userconfig;
 
 const app = new Vue({
-    router,
-    store,
-    render: h => h(App)
+	router,
+	store,
+	render: h => h(App)
 }).$mount('#content');
 
 export { app, router, store };
diff --git a/settings/src/router.js b/settings/src/router.js
@@ -14,10 +14,10 @@ Vue.use(Router);
  */
 
 export default new Router({
-    mode: 'history',
-    base: window.location.pathName,
-    routes: [{
-        path: '/settings/users',
-        component: Users
-    }]
+	mode: 'history',
+	base: window.location.pathName,
+	routes: [{
+		path: '/settings/users',
+		component: Users
+	}]
 });
diff --git a/settings/src/store/api.js b/settings/src/store/api.js
@@ -4,47 +4,94 @@ const requestToken = document.getElementsByTagName('head')[0].getAttribute('data
 const tokenHeaders = { headers: { requesttoken: requestToken } };
 
 const sanitize = function(url) {
-    return url.replace(/\/$/, ''); // Remove last slash of url
-}
+	return url.replace(/\/$/, ''); // Remove last slash of url
+};
 
 export default {
-    requireAdmin() {
-        return new Promise(function(resolve, reject) {
-            setTimeout(reject, 5000); // automatically reject 5s if not ok
-            function waitForpassword() {
-                if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
-                    setTimeout(waitForpassword, 500);
-                    return;
-                }
-                resolve();
-            }
-            waitForpassword();
-            OC.PasswordConfirmation.requirePasswordConfirmation();
-        }).catch((error) => console.log('Required password not entered'));
-    },
-    get(url) {
-        return axios.get(sanitize(url), tokenHeaders)
-            .then((response) => Promise.resolve(response))
-            .catch((error) => Promise.reject(error));
-    },
-    post(url, data) {
-        return axios.post(sanitize(url), data, tokenHeaders)
-            .then((response) => Promise.resolve(response))
-            .catch((error) => Promise.reject(error));
-    },
-    patch(url, data) {
-        return axios.patch(sanitize(url), data, tokenHeaders)
-            .then((response) => Promise.resolve(response))
-            .catch((error) => Promise.reject(error));
-    },
-    put(url, data) {
-        return axios.put(sanitize(url), data, tokenHeaders)
-            .then((response) => Promise.resolve(response))
-            .catch((error) => Promise.reject(error));
-    },
-    delete(url, data) {
-        return axios.delete(sanitize(url), { data: data, headers: tokenHeaders.headers })
-            .then((response) => Promise.resolve(response))
-            .catch((error) => Promise.reject(error));
-    }
+
+	/**
+	 * This Promise is used to chain a request that require an admin password confirmation
+	 * Since chaining Promise have a very precise behavior concerning catch and then,
+	 * you'll need to be careful when using it.
+	 * e.g
+	 * // store
+	 * 	action(context) {
+	 *		return api.requireAdmin().then((response) => {
+	 *			return api.get('url')
+	 *				.then((response) => {API success})
+	 *				.catch((error) => {API failure});
+	 *		}).catch((error) => {requireAdmin failure});
+	 *	}
+	 * // vue
+	 *	this.$store.dispatch('action').then(() => {always executed})
+	 *
+	 * Since Promise.then().catch().then() will always execute the last then
+	 * this.$store.dispatch('action').then will always be executed
+	 * 
+	 * If you want requireAdmin failure to also catch the API request failure
+	 * you will need to throw a new error in the api.get.catch()
+	 * 
+	 * e.g
+	 *	api.requireAdmin().then((response) => {
+	 *		api.get('url')
+	 *			.then((response) => {API success})
+	 *			.catch((error) => {throw error;});
+	 *	}).catch((error) => {requireAdmin OR API failure});
+	 */
+	requireAdmin() {
+		return new Promise(function(resolve, reject) {
+			// TODO: migrate the OC.dialog to Vue and avoid this mess
+			// wait for password confirmation
+			let passwordTimeout;
+			let waitForpassword = function() {
+				if (OC.PasswordConfirmation.requiresPasswordConfirmation()) {
+					passwordTimeout = setTimeout(waitForpassword, 500);
+					return;
+				}
+				clearTimeout(passwordTimeout);
+				clearTimeout(promiseTimeout);
+				resolve();
+			};
+
+			// automatically reject after 5s if not resolved
+			let promiseTimeout = setTimeout(() => {
+				clearTimeout(passwordTimeout);
+				// close dialog
+				if (document.getElementsByClassName('oc-dialog-close').length>0) {
+					document.getElementsByClassName('oc-dialog-close')[0].click();
+				}
+				OC.Notification.showTemporary(t('settings', 'You did not enter the password in time'));
+				reject('Password request cancelled');
+			}, 7000); 
+
+			// request password
+			OC.PasswordConfirmation.requirePasswordConfirmation();
+			waitForpassword();
+		});
+	},
+	get(url) {
+		return axios.get(sanitize(url), tokenHeaders)
+			.then((response) => Promise.resolve(response))
+			.catch((error) => Promise.reject(error));
+	},
+	post(url, data) {
+		return axios.post(sanitize(url), data, tokenHeaders)
+			.then((response) => Promise.resolve(response))
+			.catch((error) => Promise.reject(error));
+	},
+	patch(url, data) {
+		return axios.patch(sanitize(url), data, tokenHeaders)
+			.then((response) => Promise.resolve(response))
+			.catch((error) => Promise.reject(error));
+	},
+	put(url, data) {
+		return axios.put(sanitize(url), data, tokenHeaders)
+			.then((response) => Promise.resolve(response))
+			.catch((error) => Promise.reject(error));
+	},
+	delete(url, data) {
+		return axios.delete(sanitize(url), { data: data, headers: tokenHeaders.headers })
+			.then((response) => Promise.resolve(response))
+			.catch((error) => Promise.reject(error));
+	}
 };