the subscribe product page

assets/javascripts/discourse/controllers/patrons-subscribe-show.js.es6

@@ -34,9 +34,9 @@ export default Ember.Controller.extend({
             }
 
             subscription.save().then(() => {
-              bootbox.alert("ok payment good... some kind of message");
+              bootbox.alert(I18n.t("discourse_patrons.transactions.payment.success"));
               this.transitionToRoute(
-                "user.billing",
+                "user.subscriptions",
                 Discourse.User.current().username.toLowerCase()
               );
             });

assets/javascripts/discourse/models/plan.js.es6

@@ -20,8 +20,8 @@ const Plan = Discourse.Model.extend({
 });
 
 Plan.reopenClass({
-  findAll() {
-    return ajax("/patrons/plans", { method: "get" }).then(result =>
+  findAll(data) {
+    return ajax("/patrons/plans", { method: "get", data }).then(result =>
       result.map(plan => Plan.create(plan))
     );
   }

assets/javascripts/discourse/models/product.js.es6

@@ -7,6 +7,12 @@ Product.reopenClass({
     return ajax("/patrons/products", { method: "get" }).then(result =>
       result.map(product => Product.create(product))
     );
+  },
+
+  find(id) {
+    return ajax(`/patrons/products/${id}`, { method: "get" }).then(
+      product => Product.create(product)
+    );
   }
 });
 

assets/javascripts/discourse/models/subscription.js.es6

@@ -15,22 +15,13 @@ const Subscription = Discourse.Model.extend({
     };
 
     return ajax("/patrons/subscriptions", { method: "post", data });
-  },
-
-  destroy() {
-    return ajax(`/patrons/subscriptions/${this.id}`, { method: "delete" }).then(
-      result => Subscription.create(result)
-    );
   }
 });
 
 Subscription.reopenClass({
   findAll() {
     return ajax("/patrons/subscriptions", { method: "get" }).then(result =>
-      result.map(subscription => {
-        subscription.plan = Plan.create(subscription.plan);
-        return Subscription.create(subscription);
-      })
+      result.map(subscription => Subscription.create(subscription))
     );
   }
 });

assets/javascripts/discourse/models/user-subscription.js.es6

@@ -6,6 +6,12 @@ const UserSubscription = Discourse.Model.extend({
   @computed("status")
   canceled(status) {
     return status === "canceled";
+  },
+
+  destroy() {
+    return ajax(`/patrons/user/subscriptions/${this.id}`, { method: "delete" }).then(
+      result => UserSubscription.create(result)
+    );
   }
 });
 

assets/javascripts/discourse/patrons-route-map.js.es6

@@ -1,5 +1,7 @@
 export default function() {
   this.route("patrons", function() {
-    this.route("subscribe");
+    this.route("subscribe", function() {
+      this.route("show", { path: "/:subscription-id" });
+    });
   });
 }

assets/javascripts/discourse/routes/patrons-subscribe-show.js.es6

@@ -0,0 +1,16 @@
+import Product from "discourse/plugins/discourse-patrons/discourse/models/product";
+import Plan from "discourse/plugins/discourse-patrons/discourse/models/plan";
+import Subscription from "discourse/plugins/discourse-patrons/discourse/models/subscription";
+
+export default Discourse.Route.extend({
+  model(params) {
+  const product_id = params["subscription-id"];
+  const product = Product.find(product_id);
+  const subscription = Subscription.create();
+  const plans = Plan.findAll({ product_id: product_id }).then(results =>
+    results.map(p => ({ id: p.id, name: p.subscriptionRate }))
+  );
+
+  return Ember.RSVP.hash({ plans, product, subscription });
+  },
+});

assets/javascripts/discourse/routes/patrons-subscribe.js.es6

@@ -1,14 +1,7 @@
-import Plan from "discourse/plugins/discourse-patrons/discourse/models/plan";
-import Subscription from "discourse/plugins/discourse-patrons/discourse/models/subscription";
+import Product from "discourse/plugins/discourse-patrons/discourse/models/product";
 
 export default Discourse.Route.extend({
   model() {
-    const plans = Plan.findAll().then(results =>
-      results.map(p => ({ id: p.id, name: p.subscriptionRate }))
-    );
-
-    const subscription = Subscription.create();
-
-    return Ember.RSVP.hash({ plans, subscription });
-  }
+    return Product.findAll();
+  },
 });

assets/javascripts/discourse/templates/patrons/subscribe.hbs

@@ -1,34 +1,12 @@
 
-<h3>
- {{i18n 'discourse_patrons.subscribe.title'}}
-</h3>
-
-<div class="discourse-patrons-section-columns">
-  <div class="section-column discourse-patrons-confirmation-billing">
-    <h4>{{model.group.full_name}}</h4>
-    <p>
-      {{{model.group.bio_cooked}}}
-    </p>
+<div class="container">
+  <div class="title-wrapper">
+    <h1>
+      {{i18n 'discourse_patrons.subscribe.title'}}
+    </h1>
   </div>
-  <div class="section-column">
-    {{combo-box valueAttribute="id" content=model.plans value=model.subscription.plan}}
 
-    {{#d-button
-      action="stripePaymentHandler"
-      class="btn btn-primary btn-payment btn-discourse-patrons"}}
-      {{i18n 'discourse_patrons.subscribe.buttons.subscribe'}}
-    {{/d-button}}
+  <hr>
 
-    <hr>
-
-    <h4>{{i18n 'discourse_patrons.subscribe.card.title'}}</h4>
-    {{subscribe-card cardElement=cardElement}}
-
-    <div id="discourse-patrons-subscribe-customer">
-      <h4>{{i18n 'discourse_patrons.subscribe.customer.title'}}</h4>
-      <div class="discourse-patrons-subscribe-customer-empty">
-        {{i18n 'discourse_patrons.subscribe.customer.empty'}}
-      </div>
-    </div>
-  </div>
+  {{outlet}}
 </div>

assets/javascripts/discourse/templates/patrons/subscribe/index.hbs

@@ -0,0 +1,17 @@
+
+
+{{#each model as |product|}}
+  <div>
+    <h2>{{product.name}}</h2>
+
+    <p>
+      {{product.description}}
+    </p>
+
+    <div class="pull-right">
+      {{#link-to "patrons.subscribe.show" product.id class="btn btn-primary"}}
+        {{i18n 'discourse_patrons.subscribe.title'}}
+      {{/link-to}}
+    </div>
+  </div>
+{{/each}}

assets/javascripts/discourse/templates/patrons/subscribe/show.hbs

@@ -0,0 +1,32 @@
+
+<div class="discourse-patrons-section-columns">
+  <div class="section-column discourse-patrons-confirmation-billing">
+    <h2>
+      {{model.product.name}}
+    </h2>
+    <p>
+      {{model.product.description}}
+    </p>
+  </div>
+  <div class="section-column">
+    {{combo-box valueAttribute="id" content=model.plans value=model.product.plan}}
+
+    {{#d-button
+      action="stripePaymentHandler"
+      class="btn btn-primary btn-payment btn-discourse-patrons"}}
+      {{i18n 'discourse_patrons.subscribe.buttons.subscribe'}}
+    {{/d-button}}
+
+    <hr>
+
+    <h4>{{i18n 'discourse_patrons.subscribe.card.title'}}</h4>
+    {{subscribe-card cardElement=cardElement}}
+
+    {{!-- <div id="discourse-patrons-subscribe-customer">
+      <h4>{{i18n 'discourse_patrons.subscribe.customer.title'}}</h4>
+      <div class="discourse-patrons-subscribe-customer-empty">
+        {{i18n 'discourse_patrons.subscribe.customer.empty'}}
+      </div>
+    </div> --}}
+  </div>
+</div>