make more generic

src/components/user_autosuggest/user_autosuggest.js

@@ -1,5 +1,3 @@
-import BlockCard from '../block_card/block_card.vue'
-
 const debounceMilliseconds = 500
 
 export default {
@@ -16,9 +14,6 @@ export default {
       default: 'Search...'
     }
   },
-  components: {
-    BlockCard
-  },
   data () {
     return {
       term: '',

src/components/user_autosuggest/user_autosuggest.vue

@@ -2,7 +2,8 @@
   <div class="user-autosuggest" v-click-outside="onClickOutside">
     <input v-model="term" :placeholder="placeholder" @click="onInputClick" class="user-autosuggest-input" />
     <div class="user-autosuggest-results" v-if="resultsVisible && filtered.length > 0">
-      <BlockCard v-for="userId in filtered" :key="userId" :userId="userId"/>
+      <slot v-for="item in filtered" :item="item">
+      </slot>
     </div>
   </div>
 </template>

src/components/user_settings/user_settings.js

@@ -78,7 +78,8 @@ const UserSettings = {
     BlockList,
     MuteList,
     EmojiInput,
-    UserAutoSuggest
+    UserAutoSuggest,
+    BlockCard
   },
   computed: {
     user () {

src/components/user_settings/user_settings.vue

@@ -196,7 +196,9 @@
 
         <div :label="$t('settings.blocks_tab')">
           <div class="profile-edit-usersearch-wrapper">
-            <UserAutoSuggest :filter="filterUnblockedUsers" :query="queryUserIds" placeholder="Search whom you want to block" />
+            <UserAutoSuggest :filter="filterUnblockedUsers" :query="queryUserIds" placeholder="Search whom you want to block">
+              <BlockCard slot-scope="row" :userId="row.item"/>
+            </UserAutoSuggest>
           </div>
           <block-list :refresh="true">
             <template slot="empty">{{$t('settings.no_blocks')}}</template>