Replace icons in FrequentItemsSearchInput vue component

app/assets/javascripts/frequent_items/components/frequent_items_search_input.vue

 <script>
 import _ from 'underscore';
 import { mapActions } from 'vuex';
+import Icon from '~/vue_shared/components/icon.vue';
 import eventHub from '../event_hub';
 import frequentItemsMixin from './frequent_items_mixin';
 
 export default {
+  components: {
+    Icon,
+  },
   mixins: [frequentItemsMixin],
   data() {
     return {
@@ -45,11 +49,12 @@ export default {
       type="search"
       class="form-control"
     />
-    <i
+    <icon
       v-if="!searchQuery"
-      class="search-icon fa fa-fw fa-search"
+      name="search"
+      size="12"
+      class="search-icon"
       aria-hidden="true"
-    >
-    </i>
+    />
   </div>
 </template>