Merge pull request #114 from mdwiltfong/mdwiltfong/issue106

Mdwiltfong/issue106

app.py

@@ -195,7 +195,7 @@ def handle_quote():
             payment_method_types=["bancontact", "card", "ideal"],
             stripe_account=session["account_id"]
             )
-
+        session["setupIntent_id"]=setupIntent["id"]
 
         session["client_secret"]=setupIntent['client_secret']
     except Exception as e:
@@ -220,11 +220,15 @@ def checkout():
         session["quote_id"],
         stripe_account=session["account_id"]
         )
-    stripe.Invoice.finalize_invoice(
-        quoteResp["invoice"],
-        auto_advance=True,
+    setup_intent=stripe.SetupIntent.retrieve(session["setupIntent_id"],stripe_account=session["account_id"])
+
+    stripe.Customer.modify(
+        session["student_id"],
+        invoice_settings={
+            "default_payment_method":setup_intent.payment_method
+        },
         stripe_account=session["account_id"]
-        )
+    )
     return redirect("/")
 
 @app.route("/teacher/<account_id>/profile",methods=["GET","POST"])

static/checkout.js

@@ -1,28 +1,12 @@
 let stripe, clientSecret, elements, cardElement;
+const DOMAIN = window.location.href;
 window.addEventListener("DOMContentLoaded", () => {
   getConfig().then(() => {
     const appearance = {
-      iconStyle: "solid",
-      style: {
-        base: {
-          iconColor: "#fff",
-          color: "#fff",
-          fontWeight: 400,
-          fontFamily: "Helvetica Neue, Helvetica, Arial, sans-serif",
-          fontSize: "16px",
-          fontSmoothing: "antialiased",
-
-          "::placeholder": {
-            color: "#BFAEF6",
-          },
-          ":-webkit-autofill": {
-            color: "white",
-          },
-        },
-        invalid: {
-          iconColor: "#FFC7EE",
-          color: "#FFC7EE",
-        },
+      theme: "stripe",
+      variables: {
+        colorText: "#cdd0f8",
+        colorDanger: "#16db93",
       },
     };
 
@@ -47,7 +31,7 @@ const setMessage = (message) => {
   const messageDiv = document.querySelector("#messages");
   if (message.error) {
     messageDiv.className += " w-25 alert alert-danger";
-    messageDiv.innerHTML += message.error.message;
+    messageDiv.innerHTML += message.error.type;
   } else {
     messageDiv.className = "w-25 alert alert-success";
     messageDiv.innerHTML += message;
@@ -61,7 +45,7 @@ form.addEventListener("submit", async (e) => {
     .confirmSetup({
       elements,
       confirmParams: {
-        return_url: "/checkout_successful",
+        return_url: new URL("/checkout_successful", DOMAIN).toString(),
       },
     })
     .then((result) => {

templates/invoice_form.html

@@ -27,8 +27,11 @@ <h1 class="display-1 text-center">Send a Quote</h1>
                 </div>
 
                 {% endfor %}
-                <button type="submit" class="btn btn-success btn-lg">Submit</button>
-                <a href="/teacher/{{teacher.account_id}}/profile" class="btn btn-danger btn-lg">Cancel</a>
+                <div class="mt-3">
+                    <button type="submit" class="btn btn-success btn-lg">Submit</button>
+                    <a href="/teacher/{{teacher.account_id}}/profile" class="btn btn-danger btn-lg">Cancel</a>
+
+                </div>
             </form>
         </div>
     </div>

templates/teacher_profile.html

@@ -83,9 +83,18 @@ <h6>Send another <a href="/teacher/invoice">quote</a></h6>
                         </div>
                     </li>
                     {% else %}
-                    <li class="list-group-item">{{student.name}} ({{student.email}}) <div
-                            class="badge alert-primary d-inline">Enrollment:
-                            {{student.subscription_status}}</div>
+                    <li class="list-group-item">
+                        {{student.name}} ({{student.email}})
+                        {% if student.subscription_status == 'active' %}
+                        <div class="badge alert-primary d-inline">
+                            Enrollment:{{student.subscription_status}}
+                        </div>
+                        {% else %}
+                        <div class="badge alert-danger d-inline">
+                            Enrollment:{{student.subscription_status}}
+                        </div>
+                        {% endif %}
+
                     </li>
 
                     {% endif %}