From f1de907c323a90ae92ca25f9e5660416320b8055 Mon Sep 17 00:00:00 2001
From: Rimian Perkins <hello@rimian.com.au>
Date: Tue, 27 Aug 2019 22:05:30 +1000
Subject: [PATCH] add the basic form

---
 .../discourse/components/donation-form.es6    | 36 ++++++++++++++++++-
 .../templates/components/donation-form.hbs    | 12 +++++--
 .../components/donation-form-test.es6         |  9 +++--
 3 files changed, 51 insertions(+), 6 deletions(-)

diff --git a/assets/javascripts/discourse/components/donation-form.es6 b/assets/javascripts/discourse/components/donation-form.es6
index 84e446d..4e8c1c3 100644
--- a/assets/javascripts/discourse/components/donation-form.es6
+++ b/assets/javascripts/discourse/components/donation-form.es6
@@ -1 +1,35 @@
-export default Ember.Component.extend({});
+import { default as computed } from "ember-addons/ember-computed-decorators";
+
+export default Ember.Component.extend({
+  @computed
+  causes() {
+    const categoryEnabled =
+      Discourse.SiteSettings.discourse_donations_cause_category;
+
+    if (categoryEnabled) {
+      let categoryIds = Discourse.SiteSettings.discourse_donations_causes_categories.split(
+        "|"
+      );
+
+      if (categoryIds.length) {
+        categoryIds = categoryIds.map(Number);
+        return this.site
+          .get("categoriesList")
+          .filter(c => {
+            return categoryIds.indexOf(c.id) > -1;
+          })
+          .map(c => {
+            return {
+              id: c.id,
+              name: c.name
+            };
+          });
+      } else {
+        return [];
+      }
+    } else {
+      const causes = Discourse.SiteSettings.discourse_donations_causes;
+      return causes ? causes.split("|") : [];
+    }
+  }
+});
diff --git a/assets/javascripts/discourse/templates/components/donation-form.hbs b/assets/javascripts/discourse/templates/components/donation-form.hbs
index 9f00003..c105263 100644
--- a/assets/javascripts/discourse/templates/components/donation-form.hbs
+++ b/assets/javascripts/discourse/templates/components/donation-form.hbs
@@ -1,2 +1,10 @@
-
-hello world
+<form id="payment-form" class="form-horizontal">
+  <div class="control-group discourse-donations-cause">
+    <label class="control-label">
+      {{i18n 'discourse_donations.cause.label'}}
+    </label>
+    <div class="controls controls-dropdown">
+      {{combo-box content=causes value=cause none='discourse_donations.cause.placeholder'}}
+    </div>
+  </div>
+</form>
diff --git a/test/javascripts/components/donation-form-test.es6 b/test/javascripts/components/donation-form-test.es6
index d4ccca7..f2ffa49 100644
--- a/test/javascripts/components/donation-form-test.es6
+++ b/test/javascripts/components/donation-form-test.es6
@@ -2,10 +2,13 @@ import componentTest from "helpers/component-test";
 
 moduleForComponent("donation-form", { integration: true });
 
-componentTest("donation form", {
+componentTest("donation form has content", {
   template: `{{donation-form}}`,
 
-  test(assert) {
-    assert.ok(true);
+  async test(assert) {
+    assert.ok(find('#payment-form').length, 'The form renders');
+    assert.equal(find('.discourse-donations-cause .selected-name')
+      .text()
+      .trim(), 'Select a cause', 'It has the combo box');
   }
 });