app/components/add-proposal/template.hbs

@@ -1,9 +1,11 @@
 <form {{action "save" on="submit"}}>
   <p>
-    {{input type="text"
-            placeholder="0xF18E631Ea191aE4ebE70046Fcb01a436554421BA4"
-            value=proposal.recipientAddress
-            class=(if isValidRecipient 'valid' '')}}
+    <select required onchange={{action (mut proposal.recipientAddress) value="target.value"}}>
+      <option value="" selected disabled hidden>Contributor</option>
+      {{#each contributors as |contributor|}}
+        <option value={{contributor.address}} selected={{eq proposal.recipientAddress contributor.address}}>{{contributor.github_username}}</option>
+      {{/each}}
+    </select>
   </p>
   <p>
     {{input type="text"

app/controllers/proposals/new.js

@@ -18,6 +18,8 @@ export const queryParams = new QueryParams({
 
 export default Ember.Controller.extend(queryParams.Mixin, {
 
+  contributors: null,
+
   actions: {
     onSave() {
       this.transitionToRoute('index');

app/routes/proposals/new.js

@@ -1,15 +1,36 @@
 import Ember from 'ember';
 import Proposal from 'kredits-web/models/proposal';
 
-export default Ember.Route.extend({
+const {
+  Route,
+  RSVP,
+  inject: {
+    service
+  }
+} = Ember;
+
+export default Route.extend({
+
+  kredits: service(),
 
   model(params) {
-    return Proposal.create({
+    const proposal = Proposal.create({
       recipientAddress: params.recipient,
       amount: params.amount,
       url: params.url,
       ipfsHash: params.ipfsHash
     });
+
+    return RSVP.hash({
+      proposal,
+      contributors: this.get('kredits').getContributors()
+    });
+  },
+
+  setupController(controller, model) {
+    this._super(controller, model.proposal);
+
+    controller.set('contributors', model.contributors);
   }
 
 });

app/services/kredits.js

@@ -6,13 +6,14 @@ import Proposal from 'kredits-web/models/proposal';
 import kreditsContracts from 'npm:kredits-contracts';
 
 const {
+  Service,
   isPresent,
   inject: {
     service
   }
 } = Ember;
 
-export default Ember.Service.extend({
+export default Service.extend({
 
   ipfs: service(),
 

app/styles/components/_add-contributor.scss

@@ -15,7 +15,7 @@ section#add-contributor, section#add-proposal {
       }
     }
 
-    input[type=text] {
+    input[type=text], select {
       width: 100%;
       padding: 1rem;
       border: none;
@@ -26,6 +26,31 @@ section#add-contributor, section#add-proposal {
       &:focus, &.valid {
         background-color: rgba(22, 21, 40, 0.6);
       }
+      @include placeholder {
+        color: rgba(238, 238, 238, 0.5);
+      }
+    }
+
+    select {
+      -webkit-appearance: none;
+      -moz-appearance: none;
+      appearance: none;
+      border-radius: 0;
+      background-color: rgba(22, 21, 40, 0.6);
+      background-image:
+        linear-gradient(45deg, transparent 50%, gray 50%),
+        linear-gradient(135deg, gray 50%, transparent 50%);
+      background-position:
+        calc(100% - 1.5rem) calc(1rem + 0.5rem),
+        calc(100% - 1rem) calc(1rem + 0.5rem);
+      background-size:
+        0.5rem 0.5rem,
+        0.5rem 0.5rem;
+      background-repeat: no-repeat;
+
+      &:invalid {
+        color: rgba(238, 238, 238, 0.5);
+      }
     }
 
     input[type=submit] {

app/templates/proposals/new.hbs

@@ -4,7 +4,7 @@
   </header>
 
   <div class="content">
-    {{add-proposal proposal=model onSave=(action 'onSave')}}
+    {{add-proposal proposal=model contributors=contributors onSave=(action 'onSave')}}
   </div>
 </section>
 

package.json

@@ -53,6 +53,7 @@
     "ember-load-initializers": "^0.5.1",
     "ember-parachute": "0.1.0",
     "ember-resolver": "^2.0.3",
+    "ember-truth-helpers": "1.3.0",
     "ipfs-api": "^12.1.7",
     "kredits-contracts": "^2.4.0",
     "loader.js": "^4.0.10",