Merge branch 'entity-select' into 'master'

Revert TranscriptionEntity version filter to a select

Closes #801

See merge request !1059

test/Element/Transcription/Transcription.js

@@ -78,13 +78,16 @@ describe('Element', () => {
         await new Promise(resolve => wrapper.vm.$watch('versionIds', resolve))
 
         assert.deepStrictEqual(
-          wrapper.findAll('label').wrappers.map(l => [l.find('input').attributes('value'), l.text()]),
+          wrapper.findAll('option').wrappers.map(l => [l.attributes('value'), l.text()]),
           [
             ['', 'No entities'],
             ['__manual__', 'Manual'],
             ['versionid', 'Worker 1 xxxxxxxx']
           ]
         )
+        // First item should be selected
+        assert.strictEqual(wrapper.get('option:checked').element.value, '__manual__')
+        assert.strictEqual(wrapper.vm.workerVersionFilter, '__manual__')
       })
 
       it('hides the version filter when there are no entities', async () => {

vue/Element/Transcription/Transcription.vue

 <template>
   <div>
-    <div>
-      <div class="entities-versions" v-if="versionIds && versionIds.length">
-        <label><input type="radio" value="" v-model="workerVersionFilter" />No entities</label>
-        <label v-for="[id, name] in versionIds" :key="id"><input v-model="workerVersionFilter" type="radio" :value="id" />{{ name }}</label>
-      </div>
+    <div class="select" v-if="versionIds && versionIds.length">
+      <select v-model="workerVersionFilter">
+        <option value="">No entities</option>
+        <option v-for="[id, name] in versionIds" :key="id" :value="id">{{ name }}</option>
+      </select>
     </div>
     <div class="is-pulled-right" v-if="transcription.worker_version_id">
       <WorkerVersionDetails :worker-version-id="transcription.worker_version_id" :has-dropdown-title="true" />
@@ -56,19 +56,12 @@ export default {
       },
       default: []
     }
-  }
-}
-</script>
-
-<style lang="sass">
-.entities-versions {
-  font-size: 0.95em;
-
-  label {
-    display: block;
-    input {
-      margin-right: 2px;
+  },
+  watch: {
+    versionIds (newValue) {
+      // Automatically select the first available worker version
+      if (newValue.length) this.workerVersionFilter = newValue[0][0]
     }
   }
 }
-</style>
+</script>