Add users from search results to the global store

fixes user cards

src/components/search/search.js

@@ -116,9 +116,16 @@ const Search = {
         this.lastMediaFetchCount = 0
       }
 
-      const searchTypes = searchType
+      let searchTypes = ['statuses', 'media', 'accounts', 'hashtags']
-        ? [searchType]
+
-        : ['statuses', 'media', 'accounts', 'hashtags']
+      if (searchType) {
+        searchTypes = [searchType]
+      } else if (this.preferredTab !== 'statuses') {
+        searchTypes = [
+          this.preferredTab,
+          ...searchTypes.filter((tab) => tab !== this.preferredTab)
+        ]
+      }
 
       let oldStatusesLength = this.statuses.length
       let oldMediaLength = this.media.length
@@ -210,7 +217,7 @@ const Search = {
       const available = {
         statuses: this.visibleStatuses.length > 0,
         media: this.visibleMedia.length > 0,
-        people: this.users.length > 0,
+        accounts: this.users.length > 0,
         hashtags: this.hashtags.length > 0,
       }
 
@@ -218,7 +225,7 @@ const Search = {
         return this.preferredTab
       }
 
-      const tabOrder = ['statuses', 'media', 'people', 'hashtags']
+      const tabOrder = ['statuses', 'media', 'accounts', 'hashtags']
       for (const tab of tabOrder) {
         if (available[tab]) {
           return tab

src/components/search/search.vue

@@ -60,7 +60,7 @@
             :label="$t('user_card.media') + resultCount('visibleMedia')"
           />
           <span
-            key="people"
+            key="accounts"
             :label="$t('search.people') + resultCount('users')"
           />
           <span
@@ -143,7 +143,7 @@
           </h4>
         </div>
       </div>
-      <div v-else-if="currentResultTab === 'people'">
+      <div v-else-if="currentResultTab === 'accounts'">
         <div
           v-if="users.length === 0 && !loading && loadedInitially"
           class="search-result-heading"
@@ -257,6 +257,12 @@
   display: flex;
   align-items: center;
 
+  & + & {
+    border-top: 1px solid;
+    border-color: $fallback--border;
+    border-color: var(--border, $fallback--border);
+  }
+
   .hashtag {
     flex: 1 1 auto;
     color: $fallback--text;
@@ -264,6 +270,12 @@
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+    box-sizing: border-box;
+
+    a {
+      display: inline-block;
+      padding: .5em 1em;
+    }
   }
 
   .count {

src/modules/statuses.js

@@ -766,13 +766,13 @@ const statuses = {
       rootState.api.backendInteractor.fetchRebloggedByUsers({ id })
         .then(rebloggedByUsers => commit('addRepeats', { id, rebloggedByUsers, currentUser: rootState.users.currentUser }))
     },
-    search (store, { q, resolve, limit, offset, following, type }) {
+    search ({ rootState, dispatch }, { q, resolve, limit, offset, following, type }) {
-      return store.rootState.api.backendInteractor.search2({ q, resolve, limit, offset, following, type })
+      return rootState.api.backendInteractor.search2({ q, resolve, limit, offset, following, type })
         .then((data) => {
-          store.commit('addNewUsers', data.accounts)
+          dispatch('addNewUsers', data.accounts)
-          store.commit('addNewStatuses', { statuses: data.statuses })
+          dispatch('addNewStatuses', { statuses: data.statuses })
           if ('media' in data) {
-            store.commit('addNewStatuses', { statuses: data.media })
+            dispatch('addNewStatuses', { statuses: data.media })
           }
           return data
         })