Improve performance, sort contacts, exclude read-only and exclude alr…

…eady selected ones

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

lib/Controller/PageController.php

@@ -29,10 +29,11 @@
 use OCP\AppFramework\Http\TemplateResponse;
 
 use OCA\Contacts\AppInfo\Application;
+use OCA\Contacts\Service\SocialApiService;
 use OCP\IConfig;
 use OCP\IInitialStateService;
-use OCP\IUserSession;
 use OCP\IRequest;
+use OCP\IUserSession;
 use OCP\L10N\IFactory;
 use OCP\Util;
 

package.json

@@ -76,7 +76,7 @@
 		"@nextcloud/eslint-plugin": "^1.4.0",
 		"babel-eslint": "^10.1.0",
 		"babel-loader": "^8.1.0",
-		"css-loader": "^4.2.1",
+		"css-loader": "^3.6.0",
 		"eslint": "^6.8.0",
 		"eslint-config-standard": "^14.1.1",
 		"eslint-loader": "^4.0.2",

src/components/EntityPicker/EntityPicker.vue

@@ -75,6 +75,7 @@
 					{{ t('contacts', 'Cancel') }}
 				</button>
 				<button
+					:disabled="isEmptySelection"
 					class="navigation__button-right primary"
 					@click="onSubmit">
 					{{ t('contacts', 'Add to group') }}
@@ -159,6 +160,19 @@ export default {
 			return !(this.dataTypes.length > 1)
 		},
 
+		/**
+		 * Is the current selection empty
+		 * @returns {boolean}
+		 */
+		isEmptySelection() {
+			return Object.keys(this.selection).length === 0
+		},
+
+		/**
+		 * Formatted search input placeholder based on
+		 * available types
+		 * @returns {string}
+		 */
 		searchPlaceholderTypes() {
 			const types = this.dataTypes
 				.map(type => type.label)
@@ -182,7 +196,7 @@ export default {
 
 		/**
 		 * Returns available entities grouped by type(s) if any
-		 * @returns {Array[]}
+		 * @returns {Object[]}
 		 */
 		availableEntities() {
 			// If only one type, return the full set directly
@@ -347,6 +361,11 @@ $icon-margin: ($clickable-area - $icon-size) / 2;
 	}
 }
 
+// Properly center Entity Picker empty content
+.empty-content {
+	margin: 0;
+}
+
 /** Size full in the modal component doesn't have border radius, this adds
 it back */
 ::v-deep .modal-container {

src/views/Contacts.vue

@@ -285,7 +285,6 @@ export default {
 			// Create group
 			isCreatingGroup: false,
 			isNewGroupMenuOpen: false,
-			loading: true,
 			createGroupError: null,
 
 			// Add to group picker
@@ -294,7 +293,7 @@ export default {
 			contactPickerforGroup: null,
 			pickerTypes: [{
 				id: 'contact',
-				label: t('contacts', 'contacts'),
+				label: t('contacts', 'Contacts'),
 			}],
 
 			// Bulk processing
@@ -395,18 +394,6 @@ export default {
 		recentlyContactedContacts() {
 			return this.groups.find(group => group.name === t('contactsinteraction', 'Recently contacted'))
 		},
-
-		/**
-		 * Contacts formatted for the EntityPicker
-		 * @returns {Array}
-		 */
-		pickerData() {
-			return Object.values(this.contacts).map(contact => ({
-				id: contact.key,
-				label: contact.displayName,
-				type: 'contact',
-			}))
-		},
 	},
 
 	watch: {
@@ -689,11 +676,29 @@ export default {
 				}
 			}
 
+			// Init data set
+			this.pickerData = this.sortedContacts
+				.map(({ key }) => {
+					const contact = this.contacts[key]
+					return {
+						id: contact.key,
+						label: contact.displayName,
+						type: 'contact',
+						readOnly: contact.addressbook.readOnly,
+						groups: contact.groups,
+					}
+				})
+				// No read only contacts
+				.filter(contact => !contact.readOnly)
+				// No contacts already present in group
+				.filter(contact => contact.groups.indexOf(group.name) === -1)
+
 			this.showContactPicker = true
 			this.contactPickerforGroup = group
 		},
 
 		onContactPickerClose() {
+			this.pickerData = []
 			this.showContactPicker = false
 		},
 

tests/unit/Controller/PageControllerTest.php

@@ -24,16 +24,17 @@
 
 namespace OCA\Contacts\Controller;
 
+use ChristophWurst\Nextcloud\Testing\TestCase;
+use OCA\Contacts\Service\SocialApiService;
 use OCP\AppFramework\Http\TemplateResponse;
+use OCP\IAppManager;
 use OCP\IConfig;
-use PHPUnit\Framework\MockObject\MockObject;
 use OCP\IInitialStateService;
+use OCP\IRequest;
 use OCP\IUser;
 use OCP\IUserSession;
-use OCP\IRequest;
 use OCP\L10N\IFactory;
-use OCA\Contacts\Service\SocialApiService;
-use ChristophWurst\Nextcloud\Testing\TestCase;
+use PHPUnit\Framework\MockObject\MockObject;
 
 class PageControllerTest extends TestCase {
 	private $controller;
@@ -56,6 +57,9 @@ class PageControllerTest extends TestCase {
 	/** @var SocialApiService|MockObject*/
 	private $socialApi;
 
+	/** @var IAppManager|MockObject*/
+	private $appManager;
+
 	public function setUp() {
 		parent::setUp();
 
@@ -65,14 +69,16 @@ public function setUp() {
 		$this->languageFactory = $this->createMock(IFactory::class);
 		$this->userSession = $this->createMock(IUserSession::class);
 		$this->socialApi = $this->createMock(SocialApiService::class);
+		$this->appManager = $this->createMock(IAppManager::class);
 
 		$this->controller = new PageController(
 			$this->request,
 			$this->config,
 			$this->initialStateService,
 			$this->languageFactory,
 			$this->userSession,
-			$this->socialApi
+			$this->socialApi,
+			$this->appManager
 		);
 	}