refer searched user objects from the global user rep

src/components/user_search/user_search.js

@@ -1,5 +1,6 @@
 import FollowCard from '../follow_card/follow_card.vue'
-import userSearchApi from '../../services/new_api/user_search.js'
+import map from 'lodash/map'
+
 const userSearch = {
   components: {
     FollowCard
@@ -10,10 +11,15 @@ const userSearch = {
   data () {
     return {
       username: '',
-      users: [],
+      userIds: [],
       loading: false
     }
   },
+  computed: {
+    users () {
+      return this.userIds.map(userId => this.$store.getters.findUser(userId))
+    }
+  },
   mounted () {
     this.search(this.query)
   },
@@ -33,10 +39,10 @@ const userSearch = {
         return
       }
       this.loading = true
-      userSearchApi.search({query, store: this.$store})
+      this.$store.dispatch('searchUsers', query)
         .then((res) => {
           this.loading = false
-          this.users = res
+          this.userIds = map(res, 'id')
         })
     }
   }

src/modules/users.js

@@ -1,4 +1,5 @@
 import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
+import userSearchApi from '../services/new_api/user_search.js'
 import { compact, map, each, merge, last, concat, uniq } from 'lodash'
 import { set } from 'vue'
 import { registerPushNotifications, unregisterPushNotifications } from '../services/push/push.js'
@@ -341,6 +342,14 @@ const users = {
         store.commit('setUserForNotification', notification)
       })
     },
+    searchUsers (store, query) {
+      // TODO: Move userSearch api into api.service
+      return userSearchApi.search({query, store: { state: store.rootState }})
+        .then((users) => {
+          store.commit('addNewUsers', users)
+          return users
+        })
+    },
     async signUp (store, userInfo) {
       store.commit('signUpPending')