FEATURE: Add new stripe based pricing table

This commit adds the new stripe based pricing table.
If the user is logged in, the email field will be prepopulated with the users email.

The pricing table can be configured in the stripe dashboard.

Once the discourse_subscriptions_pricing_table setting is filled with the pricing table embed code from the stripe dashboard,
the pricing table will be displayed on /subscriptions

For more details see https://stripe.com/docs/payments/checkout/pricing-table

assets/javascripts/discourse/controllers/subscriptions.js

@@ -0,0 +1,35 @@
+import Controller from "@ember/controller";
+import Ember from 'ember';
+import I18n from "I18n";
+
+export default Controller.extend({
+    init() {
+        // Perform any initialization logic here
+        this._super(...arguments);
+        // Additional custom initialization code
+        if(this.currentUser){
+            this.currentUser.checkEmail().then((r)=>this.set('email',this.currentUser.email))
+        }
+
+      },
+      pricingTable: Ember.computed('email', function() {
+        try{
+            const pricing_table_info = JSON.parse(this.siteSettings.discourse_subscriptions_pricing_table)
+            if(this.currentUser){
+                return`<stripe-pricing-table 
+                pricing-table-id="${pricing_table_info.pricingTableId}"
+                publishable-key="${pricing_table_info.publishableKey}"
+                customer-email="${this.email}"></stripe-pricing-table>`;
+            } else {
+                return`<stripe-pricing-table 
+                pricing-table-id="${pricing_table_info.pricingTableId}"
+                publishable-key="${pricing_table_info.publishableKey}"
+                ></stripe-pricing-table>`;
+            }
+
+        
+        } catch(error){
+            return I18n.t("discourse_subscriptions.subscribe.no_products")
+        }
+      }),
+});

assets/javascripts/discourse/initializers/setup-subscriptions.js

@@ -12,7 +12,7 @@ export default {
         api.addNavigationBarItem({
           name: "subscribe",
           displayName: I18n.t("discourse_subscriptions.navigation.subscribe"),
-          href: "/s",
+          href: "/subscriptions",
         });
       }
 
@@ -23,6 +23,30 @@ export default {
           href: `/u/${user.username}/billing/subscriptions`,
           content: "Billing",
         });
+        
+        if(user.admin){
+          api.modifyClassStatic('model:site-setting', {
+               pluginId: 'discourse-subscriptions',
+               update(key, value, opts = {}) {
+                if(key ==="discourse_subscriptions_pricing_table"){
+                  const inputString = value;
+                  // Extract pricing-table-id
+                  const pricingTableIdRegex = /pricing-table-id="([^"]+)"/;
+                  const pricingTableIdMatch = inputString.match(pricingTableIdRegex);
+                  const pricingTableId = pricingTableIdMatch ? pricingTableIdMatch[1] : null;
+      
+                  // Extract publishable-key
+                  const publishableKeyRegex = /publishable-key="([^"]+)"/;
+                  const publishableKeyMatch = inputString.match(publishableKeyRegex);
+                  const publishableKey = publishableKeyMatch ? publishableKeyMatch[1] : null;
+                  if(pricingTableId && publishableKey){
+                    value = JSON.stringify({pricingTableId,publishableKey})
+                  }
+                }
+                this._super(key, value, opts);
+              }
+             });
+        }
       }
     });
   },

assets/javascripts/discourse/subscriptions-route-map.js

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

assets/javascripts/discourse/templates/subscriptions.hbs

@@ -0,0 +1,3 @@
+<div class="container">
+{{{pricingTable}}}
+</div>