aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/react/components/presentational/Result.js9
-rw-r--r--src/client/react/reducers/search.js14
-rw-r--r--src/client/react/users.js1
-rw-r--r--src/client/style/_component-search.scss5
4 files changed, 22 insertions, 7 deletions
diff --git a/src/client/react/components/presentational/Result.js b/src/client/react/components/presentational/Result.js
index a30cf52..83c6709 100644
--- a/src/client/react/components/presentational/Result.js
+++ b/src/client/react/components/presentational/Result.js
@@ -24,7 +24,14 @@ class Result extends React.Component {
<div className="search__icon-wrapper">
<IconFromUserType userType={users.byId[this.props.userId].type} />
</div>
- <div className="search__result__text">{users.byId[this.props.userId].value}</div>
+ <div className="search__result__text">
+ {users.byId[this.props.userId].value}
+ {users.byId[this.props.userId].alt &&
+ <span className="search__result__text__alt">
+ {` ${users.byId[this.props.userId].alt}`}
+ </span>
+ }
+ </div>
</div>
);
}
diff --git a/src/client/react/reducers/search.js b/src/client/react/reducers/search.js
index 6293b8a..2f02874 100644
--- a/src/client/react/reducers/search.js
+++ b/src/client/react/reducers/search.js
@@ -1,4 +1,5 @@
-import fuzzy from 'fuzzy';
+import FuzzySearch from 'fuzzy-search';
+import uniqBy from 'lodash/uniqBy';
import users from '../users';
const DEFAULT_STATE = {
@@ -11,16 +12,17 @@ const DEFAULT_STATE = {
};
function getSearchResults(allUsers, query) {
+ const searcher = new FuzzySearch(allUsers, ['value', 'alt']);
+
if (query.trim() === '') {
return [];
}
- const allResults = fuzzy.filter(query, allUsers, {
- extract: user => user.value,
- });
+ const allResults = searcher.search(query);
+ const uniqResults = uniqBy(allResults, result => result.id);
+ const firstResults = uniqResults.splice(0, 4);
- const firstResults = allResults.splice(0, 4);
- const userIds = firstResults.map(result => result.original.id);
+ const userIds = firstResults.map(result => result.id);
return userIds;
}
diff --git a/src/client/react/users.js b/src/client/react/users.js
index 01ff093..bb28317 100644
--- a/src/client/react/users.js
+++ b/src/client/react/users.js
@@ -56,6 +56,7 @@ USERS.forEach((user) => {
user: {
type: user.type,
value: user.value,
+ alt: user.alt,
id: getId(user),
},
});
diff --git a/src/client/style/_component-search.scss b/src/client/style/_component-search.scss
index 1687ec3..b989cc1 100644
--- a/src/client/style/_component-search.scss
+++ b/src/client/style/_component-search.scss
@@ -61,6 +61,11 @@
padding-left: 0px;
font-size: 16px;
transform: translate(0, 3px);
+
+ &__alt {
+ font-style: italic;
+ color: gray;
+ }
}
}
}