Use AND instead of OR for tags search // Sort tags when displayed (#2719)

js/src/ui/Tags/tags.js

@@ -38,19 +38,21 @@ export default class Tags extends Component {
       ? [ styles.tag, styles.tagClickable ]
       : [ styles.tag ];
 
-    return tags.map((tag, idx) => {
+    return tags
-      const onClick = handleAddSearchToken
+      .sort()
-        ? () => handleAddSearchToken(tag)
+      .map((tag, idx) => {
-        : null;
+        const onClick = handleAddSearchToken
+          ? () => handleAddSearchToken(tag)
+          : null;
 
-      return (
+        return (
-        <div
+          <div
-          key={ idx }
+            key={ idx }
-          className={ tagClasses.join(' ') }
+            className={ tagClasses.join(' ') }
-          onClick={ onClick }>
+            onClick={ onClick }>
-          { tag }
+            { tag }
-        </div>
+          </div>
-      );
+        );
-    });
+      });
   }
 }

js/src/views/Accounts/List/list.js

@@ -130,15 +130,15 @@ export default class List extends Component {
           .concat(tags, name)
           .map(v => v.toLowerCase());
 
-        return values
+        return searchValues
-          .filter((value) => {
+          .map(searchValue => {
-            return searchValues
+            return values
-              .map(searchValue => value.indexOf(searchValue) >= 0)
+              .filter(value => value.indexOf(searchValue) >= 0)
-              // `current && truth, true` => use tokens as AND
+              .length > 0;
-              // `current || truth, false` => use tokens as OR
-              .reduce((current, truth) => current || truth, false);
           })
-          .length > 0;
+          // `current && truth, true` => use tokens as AND
+          // `current || truth, false` => use tokens as OR
+          .reduce((current, truth) => current && truth, true);
       });
   }
 }