Use Select component

After merging develop, the dropdown didn't format properly any more because selects have been made into a component. Here I turn the select into a component as well.

2 files changed, 13 insertions, 20 deletions

diff --git a/src/components/report/report.js b/src/components/report/report.js
index 14b0cfd4..76055764 100644
--- a/src/components/report/report.js
+++ b/src/components/report/report.js
@@ -1,3 +1,4 @@
+import Select from '../select/select.vue'
 import StatusContent from '../status_content/status_content.vue'
 import Timeago from '../timeago/timeago.vue'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
@@ -7,6 +8,7 @@ const Report = {
     'reportId'
   ],
   components: {
+    Select,
     StatusContent,
     Timeago
   },
diff --git a/src/components/report/report.vue b/src/components/report/report.vue
index 4020773d..6f7fa7d2 100644
--- a/src/components/report/report.vue
+++ b/src/components/report/report.vue
@@ -14,28 +14,19 @@
     </div>
     <div class="report-state">
       <span>{{ $t('report.state') }}</span>
-      <label
-        for="report-state"
-        class="select"
+      <Select
+        :id="report-state"
+        v-model="state"
+        class="form-control"
       >
-        <select
-          id="report-state"
-          v-model="state"
-          class="form-control"
+        <option
+          v-for="state in ['open', 'closed', 'resolved']"
+          :key="state"
+          :value="state"
         >
-          <option
-            v-for="state in ['open', 'closed', 'resolved']"
-            :key="state"
-            :value="state"
-          >
-            {{ $t('report.state_' + state) }}
-          </option>
-        </select>
-        <FAIcon
-          class="select-down-icon"
-          icon="chevron-down"
-        />
-      </label>
+          {{ $t('report.state_' + state) }}
+        </option>
+      </Select>
     </div>
     <!-- eslint-disable vue/no-v-html -->
     <div