diff --git a/app/components/Contacts/ContactsForm.js b/app/components/Contacts/ContactsForm.js
index 049aa246..4a33af26 100644
--- a/app/components/Contacts/ContactsForm.js
+++ b/app/components/Contacts/ContactsForm.js
@@ -138,7 +138,7 @@ class ContactsForm extends React.Component {
{
- contactsform.searchQuery.length > 0 && filteredNetworkNodes.map(node => (
+ filteredNetworkNodes.map(node => (
-
{
diff --git a/app/reducers/contactsform.js b/app/reducers/contactsform.js
index 4b940db7..40e2a777 100644
--- a/app/reducers/contactsform.js
+++ b/app/reducers/contactsform.js
@@ -71,6 +71,12 @@ contactFormSelectors.filteredNetworkNodes = createSelector(
networkNodesSelector,
searchQuerySelector,
(nodes, searchQuery) => {
+ // If there is no search query default to showing the first 20 nodes from the nodes array
+ // (performance hit to render the entire thing by default)
+ if (!searchQuery.length) { return nodes.slice(0, 20) }
+
+ // if there is an '@' in the search query we are assuming they are using the format pubkey@host
+ // we can ignore the '@' and the host and just grab the pubkey for our search
const query = searchQuery.includes('@') ? searchQuery.split('@')[0] : searchQuery
return filter(nodes, node => node.alias.includes(query) || node.pub_key.includes(query))