From 97544ac7605fbb5072be745cda372c954342f3b4 Mon Sep 17 00:00:00 2001
From: Son NK <nguyenkims@hotmail.com>
Date: Sat, 25 Apr 2020 13:38:05 +0200
Subject: [PATCH] Update mailbox using ajax

refactor: return Mailbox in User.mailboxes()
---
 app/api/views/alias.py                       |  1 -
 app/dashboard/templates/dashboard/index.html | 44 +++++++++++++++++---
 app/dashboard/views/custom_alias.py          |  2 +-
 app/models.py                                |  7 ++--
 server.py                                    |  9 ++--
 5 files changed, 49 insertions(+), 14 deletions(-)

diff --git a/app/api/views/alias.py b/app/api/views/alias.py
index f8a067ec..e89b2895 100644
--- a/app/api/views/alias.py
+++ b/app/api/views/alias.py
@@ -245,7 +245,6 @@ def update_alias(alias_id):
     if alias.user_id != user.id:
         return jsonify(error="Forbidden"), 403
 
-
     changed = False
     if "note" in data:
         new_note = data.get("note")
diff --git a/app/dashboard/templates/dashboard/index.html b/app/dashboard/templates/dashboard/index.html
index 0680c5bd..7fdd74f6 100644
--- a/app/dashboard/templates/dashboard/index.html
+++ b/app/dashboard/templates/dashboard/index.html
@@ -222,10 +222,11 @@
                 <div class="small-text mt-2">Current mailbox</div>
                 <div class="d-flex">
                   <div class="flex-grow-1 mr-2">
-                    <select class="form-control form-control-sm custom-select" name="mailbox">
+                    <select id="mailbox-{{ alias.id }}"
+                        class="form-control form-control-sm custom-select" name="mailbox">
                       {% for mailbox in mailboxes %}
-                        <option value="{{ mailbox }}" {% if mailbox == alias_info.mailbox.email %} selected {% endif %}>
-                          {{ mailbox }}
+                        <option value="{{ mailbox.id }}" {% if mailbox.id == alias_info.mailbox.id %} selected {% endif %}>
+                          {{ mailbox.email }}
                         </option>
                       {% endfor %}
                     </select>
@@ -235,9 +236,10 @@
                     <input type="hidden" name="form-name" value="set-mailbox">
                     <input type="hidden" name="alias-id" value="{{ alias.id }}">
 
-                    <button class="btn btn-sm btn-outline-info w-100">
+                    <a data-alias="{{ alias.id }}"
+                        class="save-mailbox btn btn-sm btn-outline-info w-100">
                       Update
-                    </button>
+                    </a>
                   </div>
 
                 </div>
@@ -487,5 +489,37 @@
       }
 
     })
+
+    $(".save-mailbox").on("click", async function () {
+      let aliasId = $(this).data("alias");
+      let mailbox_id = $(`#mailbox-${aliasId}`).val();
+
+      try {
+        let res = await fetch(`/api/aliases/${aliasId}`, {
+          method: "PUT",
+          headers: {
+            "Content-Type": "application/json",
+          },
+          body: JSON.stringify({
+            mailbox_id: mailbox_id,
+          }),
+        });
+
+        if (res.ok) {
+          toastr.success(`Mailbox Updated`);
+        } else {
+          toastr.error("Sorry for the inconvenience! Could you refresh the page & retry please?", "Unknown Error");
+          // reset to the original value
+          var oldValue = !$(this).prop("checked");
+          $(this).prop("checked", oldValue);
+        }
+      } catch (e) {
+        toastr.error("Sorry for the inconvenience! Could you refresh the page & retry please?", "Unknown Error");
+        // reset to the original value
+        var oldValue = !$(this).prop("checked");
+        $(this).prop("checked", oldValue);
+      }
+
+    })
   </script>
 {% endblock %}
diff --git a/app/dashboard/views/custom_alias.py b/app/dashboard/views/custom_alias.py
index 3ec3d072..7330a892 100644
--- a/app/dashboard/views/custom_alias.py
+++ b/app/dashboard/views/custom_alias.py
@@ -40,7 +40,7 @@ def custom_alias():
             )
         )
 
-    mailboxes = current_user.mailboxes()
+    mailboxes = [mb.email for mb in current_user.mailboxes()]
 
     if request.method == "POST":
         alias_prefix = request.form.get("prefix")
diff --git a/app/models.py b/app/models.py
index 03ecbc1b..1258929d 100644
--- a/app/models.py
+++ b/app/models.py
@@ -2,6 +2,7 @@ import enum
 import random
 import uuid
 from email.utils import formataddr
+from typing import List
 
 import arrow
 import bcrypt
@@ -357,12 +358,12 @@ class User(db.Model, ModelMixin, UserMixin):
     def verified_custom_domains(self):
         return CustomDomain.query.filter_by(user_id=self.id, verified=True).all()
 
-    def mailboxes(self) -> [str]:
-        """list of mailbox emails that user own"""
+    def mailboxes(self) -> List["Mailbox"]:
+        """list of mailbox that user own"""
         mailboxes = []
 
         for mailbox in Mailbox.query.filter_by(user_id=self.id, verified=True):
-            mailboxes.append(mailbox.email)
+            mailboxes.append(mailbox)
 
         return mailboxes
 
diff --git a/server.py b/server.py
index e252217f..736e155a 100644
--- a/server.py
+++ b/server.py
@@ -160,11 +160,12 @@ def fake_data():
     m1 = Mailbox.create(user_id=user.id, email="m1@cd.ef", verified=True)
     db.session.commit()
 
-    user.default_mailbox_id = m1.id
-
     Alias.create_new(user, "e1@", mailbox_id=m1.id)
-    for i in range(10):
-        Alias.create_new(user, f"e{i}@", mailbox_id=m1.id)
+    for i in range(30):
+        if i % 2 == 0:
+            Alias.create_new(user, f"e{i}@", mailbox_id=m1.id)
+        else:
+            Alias.create_new(user, f"e{i}@")
 
     CustomDomain.create(user_id=user.id, domain="ab.cd", verified=True)
     CustomDomain.create(