No account search results message

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>

app/soapbox/features/aliases/index.js

@@ -22,6 +22,7 @@ const messages = defineMessages({
 const mapStateToProps = state => ({
   aliases: state.getIn(['meta', 'pleroma', 'also_known_as']),
   searchAccountIds: state.getIn(['aliases', 'suggestions', 'items']),
+  loaded: state.getIn(['aliases', 'suggestions', 'loaded']),
 });
 
 export default @connect(mapStateToProps)
@@ -34,7 +35,7 @@ class Aliases extends ImmutablePureComponent {
   }
 
   render() {
-    const { intl, aliases, searchAccountIds } = this.props;
+    const { intl, aliases, searchAccountIds, loaded } = this.props;
 
     const emptyMessage = <FormattedMessage id='empty_column.aliases' defaultMessage="You haven't created any account alias yet." />;
 
@@ -42,9 +43,17 @@ class Aliases extends ImmutablePureComponent {
       <Column className='aliases-settings-panel' icon='suitcase' heading={intl.formatMessage(messages.heading)} backBtnSlim>
         <ColumnSubheading text={intl.formatMessage(messages.subheading_add_new)} />
         <Search />
-        <div className='aliases__accounts'>
+        {
-          {searchAccountIds.map(accountId => <Account key={accountId} accountId={accountId} />)}
+          loaded && searchAccountIds.size === 0 ? (
-        </div>
+            <div className='aliases__accounts empty-column-indicator'>
+              <FormattedMessage id='empty_column.aliases.suggestions' defaultMessage='There are no account suggestions available for the provided term.' />
+            </div>
+          ) : (
+            <div className='aliases__accounts'>
+              {searchAccountIds.map(accountId => <Account key={accountId} accountId={accountId} />)}
+            </div>
+          )
+        }
         <ColumnSubheading text={intl.formatMessage(messages.subheading_aliases)} />
         <div className='aliases-settings-panel'>
           <ScrollableList

app/soapbox/locales/pl.json

@@ -318,6 +318,7 @@
   "empty_column.account_timeline": "Brak wpisów tutaj!",
   "empty_column.account_unavailable": "Profil niedostępny",
   "empty_column.aliases": "Nie utworzyłeś(-aś) jeszcze żadnego aliasu konta.",
+  "empty_column.aliases.suggestions": "Brak propozycji kont dla podanej frazy.",
   "empty_column.blocks": "Nie zablokowałeś(-aś) jeszcze żadnego użytkownika.",
   "empty_column.bookmarks": "Nie masz jeszcze żadnej zakładki. Kiedy dodasz jakąś, pojawi się ona tutaj.",
   "empty_column.community": "Lokalna oś czasu jest pusta. Napisz coś publicznie, aby zagaić!",

app/soapbox/reducers/aliases.js

@@ -8,6 +8,7 @@ import {
 const initialState = ImmutableMap({
   suggestions: ImmutableMap({
     value: '',
+    loaded: false,
     items: ImmutableList(),
   }),
 });
@@ -15,13 +16,18 @@ const initialState = ImmutableMap({
 export default function aliasesReducer(state = initialState, action) {
   switch(action.type) {
   case ALIASES_SUGGESTIONS_CHANGE:
-    return state.setIn(['suggestions', 'value'], action.value);
+    return state
+      .setIn(['suggestions', 'value'], action.value)
+      .setIn(['suggestions', 'loaded'], false);
   case ALIASES_SUGGESTIONS_READY:
-    return state.setIn(['suggestions', 'items'], ImmutableList(action.accounts.map(item => item.id)));
+    return state
+      .setIn(['suggestions', 'items'], ImmutableList(action.accounts.map(item => item.id)))
+      .setIn(['suggestions', 'loaded'], true);
   case ALIASES_SUGGESTIONS_CLEAR:
     return state.update('suggestions', suggestions => suggestions.withMutations(map => {
       map.set('items', ImmutableList());
       map.set('value', '');
+      map.set('loaded', false);
     }));
   default:
     return state;

app/styles/components/aliases.scss

@@ -11,6 +11,11 @@
     .account__avatar {
       cursor: default;
     }
+
+    &.empty-column-indicator {
+      min-height: unset;
+      overflow-y: unset;
+    }
   }
 
   &_search {