diff --git a/app/components/payments/funds-recipient.js b/app/components/payments/funds-recipient.js
index 9feaa4e4d..a7fa5a04b 100644
--- a/app/components/payments/funds-recipient.js
+++ b/app/components/payments/funds-recipient.js
@@ -13,6 +13,7 @@ export default Component.extend({
     set(this, 'dobDay', 1);
     set(this, 'dobMonth', 1);
     set(this, 'dobYear', 2016);
+    set(this, 'country', 'US');
     this._super(...arguments);
   },
 
@@ -33,7 +34,6 @@ export default Component.extend({
         'dobDay', 'dobMonth', 'dobYear',
         'address1', 'address2', 'city', 'state', 'country', 'zip'
       );
-
       this.sendAction('recipientInformationSubmitted', fundsRecipient);
     }
   }
diff --git a/app/components/select/country-select.js b/app/components/select/country-select.js
new file mode 100644
index 000000000..cd8dfb0b2
--- /dev/null
+++ b/app/components/select/country-select.js
@@ -0,0 +1,12 @@
+import Ember from 'ember';
+
+const {
+  Component
+} = Ember;
+
+export default Component.extend({
+  classNames: ['select-country'],
+  countryOptions: [
+    { name: 'United States', id: 'US' }
+  ]
+});
diff --git a/app/templates/components/payments/funds-recipient.hbs b/app/templates/components/payments/funds-recipient.hbs
index e9ea0848d..1efac1d16 100644
--- a/app/templates/components/payments/funds-recipient.hbs
+++ b/app/templates/components/payments/funds-recipient.hbs
@@ -56,9 +56,7 @@
   </div>
   <div class="input-group">
     <label for="country">Country</label>
-    <select value=country name="country">
-      <option value="US">United States</option>
-    </select>
+    {{select/country-select country=country}}
   </div>
 </div>
 <div class="input-group">
diff --git a/app/templates/components/select/country-select.hbs b/app/templates/components/select/country-select.hbs
new file mode 100644
index 000000000..ac06788d7
--- /dev/null
+++ b/app/templates/components/select/country-select.hbs
@@ -0,0 +1,5 @@
+{{#x-select value=country as |xs| }}
+  {{#each countryOptions as |countryOption|}}
+    {{#xs.option value=countryOption.id}}{{countryOption.name}}{{/xs.option}}
+  {{/each}}
+{{/x-select}}
diff --git a/tests/integration/components/select/country-select-test.js b/tests/integration/components/select/country-select-test.js
new file mode 100644
index 000000000..3ad7f5c3e
--- /dev/null
+++ b/tests/integration/components/select/country-select-test.js
@@ -0,0 +1,31 @@
+import { moduleForComponent, test } from 'ember-qunit';
+import Ember from 'ember';
+import hbs from 'htmlbars-inline-precompile';
+import selectCountry from '../../../pages/components/select/country-select';
+import PageObject from 'ember-cli-page-object';
+
+const {
+  get,
+  set
+} = Ember;
+
+let page = PageObject.create(selectCountry);
+
+moduleForComponent('select/country-select', 'Integration | Component | select/country select', {
+  integration: true,
+  beforeEach() {
+    page.setContext(this);
+  },
+  afterEach() {
+    page.setContext(this);
+  }
+});
+
+test('it sets the correct country', function(assert) {
+  assert.expect(1);
+  set(this, 'country', 'US');
+  page.render(hbs`{{select/country-select country=country}}`);
+  page.country.fillIn('US');
+  let country = get(this, 'country');
+  assert.equal(country, 'US');
+});
diff --git a/tests/pages/components/select/country-select.js b/tests/pages/components/select/country-select.js
new file mode 100644
index 000000000..d583b6a95
--- /dev/null
+++ b/tests/pages/components/select/country-select.js
@@ -0,0 +1,12 @@
+import {
+  selectable
+} from 'ember-cli-page-object';
+
+export default {
+  scope: '.select-country',
+
+  country: {
+    scope: 'select:eq(0)',
+    fillIn: selectable()
+  }
+};