Pass entire user collection to Editor

webapp/components/ContributionForm.vue

@@ -16,6 +16,7 @@
         />
         <no-ssr>
           <hc-editor
+            :users="users"
             :value="form.content"
             @input="updateEditorContent"
           />
@@ -125,6 +126,22 @@ export default {
       // this.form.content = value
       this.$refs.contributionForm.update('content', value)
     }
+  },
+  apollo: {
+    User: {
+      query() {
+        return gql(`{
+          User {
+            id
+            name
+            slug
+          }
+        }`)
+      },
+      result(result) {
+        this.users = result.data.User
+      }
+    }
   }
 }
 </script>

webapp/components/Editor/Editor.vue

@@ -197,6 +197,7 @@ export default {
     EditorMenuBubble
   },
   props: {
+    users: { type: Array, default: () => [] },
     value: { type: String, default: '' },
     doc: { type: Object, default: () => {} }
   },
@@ -227,12 +228,9 @@ export default {
           }),
           new History(),
           new Mention({
-            items: () => [
+            items: () => {
-              { id: 1, name: 'Philipp Kühn' },
+              return this.users
-              { id: 2, name: 'Hans Pagel' },
+            },
-              { id: 3, name: 'Kris Siepert' },
-              { id: 4, name: 'Justin Schueler' }
-            ],
             onEnter: ({ items, query, range, command, virtualNode }) => {
               this.query = query
               this.filteredUsers = items