Merge pull request #40428 from nextcloud/artonge/fix/users_list_bugs

Do not display userCount when it is equal to 0

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

@@ -250,11 +250,12 @@
 					:input-id="'manager' + uniqueId"
 					:close-on-select="true"
 					:disabled="isLoadingField"
-					:loading="idState.loading.manager"
+					:loading="idState.loadingPossibleManagers || idState.loading.manager"
 					label="displayname"
 					:options="idState.possibleManagers"
 					:placeholder="managerLabel"
 					class="select-vue"
+					@open="searchInitialUserManager"
 					@search="searchUserManager"
 					@option:selected="updateUserManager"
 					@input="updateUserManager" />
@@ -359,6 +360,7 @@ export default {
 		return {
 			selectedQuota: false,
 			rand: Math.random().toString(36).substring(2),
+			loadingPossibleManagers: false,
 			possibleManagers: [],
 			currentManager: '',
 			editing: false,
@@ -502,11 +504,13 @@ export default {
 	},
 
 	async beforeMount() {
-		await this.searchUserManager()
-
 		if (this.user.manager) {
 			await this.initManager(this.user.manager)
 		}
+
+		// Reset loading state before mounting the component.
+		// This is useful when we disable a user as the loading state cannot be properly reset upon promise resolution.
+		Object.keys(this.idState.loading).forEach(key => (this.idState.loading[key] = false))
 	},
 
 	methods: {
@@ -547,6 +551,12 @@ export default {
 			})
 		},
 
+		async searchInitialUserManager() {
+			this.idState.loadingPossibleManagers = true
+			await this.searchUserManager()
+			this.idState.loadingPossibleManagers = false
+		},
+
 		async searchUserManager(query) {
 			await this.$store.dispatch('searchUsers', { offset: 0, limit: 10, search: query }).then(response => {
 				const users = response?.data ? this.filterManagers(Object.values(response?.data.ocs.data.users)) : []

apps/settings/src/store/users.js

@@ -169,6 +169,11 @@ const mutations = {
 	},
 	// update active/disabled counts, groups counts
 	updateUserCounts(state, { user, actionType }) {
+		// 0 is a special value
+		if (state.userCount === 0) {
+			return
+		}
+
 		const disabledGroup = state.groups.find(group => group.id === 'disabled')
 		switch (actionType) {
 		case 'enable':

apps/settings/src/views/Users.vue

@@ -56,7 +56,7 @@
 							<AccountGroup :size="20" />
 						</template>
 						<template #counter>
-							<NcCounterBubble :type="!selectedGroupDecoded ? 'highlighted' : undefined">
+							<NcCounterBubble v-if="userCount" :type="!selectedGroupDecoded ? 'highlighted' : undefined">
 								{{ userCount }}
 							</NcCounterBubble>
 						</template>