From 5f626b9daf84f09507b67a1929675d95d59d6d75 Mon Sep 17 00:00:00 2001
From: Santiago Lamora <slamora@users.noreply.github.com>
Date: Wed, 4 Dec 2019 11:45:09 +0100
Subject: [PATCH] Render mailbox usage progress bar.

---
 musician/models.py                    |  7 ++++++-
 musician/templates/musician/mail.html | 15 ++++++++++++++-
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/musician/models.py b/musician/models.py
index 06eb35c..7544360 100644
--- a/musician/models.py
+++ b/musician/models.py
@@ -136,7 +136,12 @@ class MailService(OrchestraModel):
         if self.type == self.FORWARD:
             return self.data['forward']
         # TODO(@slamora) retrieve mailbox usage
-        return {'usage': 0, 'total': 213}
+        return {
+            'usage': 250,
+            'total': 500,
+            'unit': 'MB',
+            'percent': 50,
+        }
 
 
 class MailinglistService(OrchestraModel):
diff --git a/musician/templates/musician/mail.html b/musician/templates/musician/mail.html
index 000530e..622fdc1 100644
--- a/musician/templates/musician/mail.html
+++ b/musician/templates/musician/mail.html
@@ -26,7 +26,20 @@
             <td>{{ obj.mail_address }}</td>
             <td>{{ obj.aliases|join:" , " }}</td>
             <td>{{ obj.type|capfirst }}</td>
-            <td>{{ obj.type_detail }}</td>
+            <td>
+                {% if obj.type == 'mailbox' %}
+                {% with obj.type_detail as detail %}
+                <div class="text-center">
+                    {{ detail.usage }} of {{ detail.total }}{{ detail.unit }}
+                </div>
+                <div class="progress">
+                    <div class="progress-bar bg-secondary w-{{ detail.percent }}" role="progressbar" aria-valuenow="{{ detail.usage }}" aria-valuemin="0" aria-valuemax="{{ detail.total }}"></div>
+                </div>
+                {% endwith %}
+                {% else %}
+                {{ obj.type_detail }}
+                {% endif %}
+            </td>
         </tr>
         {% endfor %}
     </tbody>