From f5c86f3d975afe0173273c2a90b536fc2ae3eae3 Mon Sep 17 00:00:00 2001
From: Herculino Trotta <netotrotta@gmail.com>
Date: Sat, 8 Feb 2025 11:42:46 -0300
Subject: [PATCH] feat: account and currency cards will no longer display
 unneeded zeros, only for totals

---
 app/templates/cotton/ui/account_card.html  | 19 +++++++++++++++++--
 app/templates/cotton/ui/currency_card.html | 22 ++++++++++++++++++----
 2 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/app/templates/cotton/ui/account_card.html b/app/templates/cotton/ui/account_card.html
index e0e9775..c54111f 100644
--- a/app/templates/cotton/ui/account_card.html
+++ b/app/templates/cotton/ui/account_card.html
@@ -15,6 +15,7 @@
         <div class="tw-text-gray-400">{% translate 'projected income' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
+      {% if account.income_projected != 0 %}
       <div class="text-end font-monospace tw-text-green-400">
         <c-amount.display
             :amount="account.income_projected"
@@ -22,6 +23,9 @@
             :suffix="account.currency.suffix"
             :decimal_places="account.currency.decimal_places"></c-amount.display>
       </div>
+      {% else %}
+        <div class="text-end font-monospace">-</div>
+      {% endif %}
     </div>
     {% if account.exchanged and account.exchanged.income_projected %}
       <div class="text-end font-monospace tw-text-gray-500">
@@ -38,6 +42,7 @@
       </div>
       <div class="dotted-line flex-grow-1"></div>
       <div>
+        {% if account.expense_projected != 0 %}
         <div class="text-end font-monospace tw-text-red-400">
           <c-amount.display
               :amount="account.expense_projected"
@@ -45,6 +50,9 @@
               :suffix="account.currency.suffix"
               :decimal_places="account.currency.decimal_places"></c-amount.display>
         </div>
+        {% else %}
+          <div class="text-end font-monospace">-</div>
+        {% endif %}
       </div>
     </div>
     {% if account.exchanged and account.exchanged.expense_projected %}
@@ -86,6 +94,7 @@
         <div class="tw-text-gray-400">{% translate 'current income' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
+      {% if account.income_current != 0 %}
       <div class="text-end font-monospace tw-text-green-400">
         <c-amount.display
             :amount="account.income_current"
@@ -93,6 +102,9 @@
             :suffix="account.currency.suffix"
             :decimal_places="account.currency.decimal_places"></c-amount.display>
       </div>
+      {% else %}
+        <div class="text-end font-monospace">-</div>
+      {% endif %}
     </div>
     {% if account.exchanged and account.exchanged.income_current %}
       <div class="text-end font-monospace tw-text-gray-500">
@@ -108,6 +120,7 @@
         <div class="tw-text-gray-400">{% translate 'current expenses' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
+      {% if account.expense_current != 0 %}
       <div class="text-end font-monospace tw-text-red-400">
         <c-amount.display
             :amount="account.expense_current"
@@ -115,6 +128,9 @@
             :suffix="account.currency.suffix"
             :decimal_places="account.currency.decimal_places"></c-amount.display>
       </div>
+      {% else %}
+        <div class="text-end font-monospace">-</div>
+      {% endif %}
     </div>
     {% if account.exchanged and account.exchanged.expense_current %}
       <div class="text-end font-monospace tw-text-gray-500">
@@ -130,8 +146,7 @@
         <div class="tw-text-gray-400">{% translate 'current total' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
-      <div
-          class="text-end font-monospace">
+      <div class="text-end font-monospace">
         <c-amount.display
             :amount="account.total_current"
             :prefix="account.currency.prefix"
diff --git a/app/templates/cotton/ui/currency_card.html b/app/templates/cotton/ui/currency_card.html
index e748883..e30ea3b 100644
--- a/app/templates/cotton/ui/currency_card.html
+++ b/app/templates/cotton/ui/currency_card.html
@@ -10,6 +10,7 @@
         <div class="tw-text-gray-400">{% translate 'projected income' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
+      {% if currency.income_projected != 0 %}
       <div class="text-end font-monospace tw-text-green-400">
         <c-amount.display
             :amount="currency.income_projected"
@@ -17,6 +18,9 @@
             :suffix="currency.currency.suffix"
             :decimal_places="currency.currency.decimal_places"></c-amount.display>
       </div>
+      {% else %}
+      <div class="text-end font-monospace">-</div>
+      {% endif %}
     </div>
     {% if currency.exchanged and currency.exchanged.income_projected %}
       <div class="text-end font-monospace tw-text-gray-500">
@@ -33,6 +37,7 @@
       </div>
       <div class="dotted-line flex-grow-1"></div>
       <div>
+        {% if currency.expense_projected != 0 %}
         <div class="text-end font-monospace tw-text-red-400">
           <c-amount.display
               :amount="currency.expense_projected"
@@ -40,6 +45,9 @@
               :suffix="currency.currency.suffix"
               :decimal_places="currency.currency.decimal_places"></c-amount.display>
         </div>
+        {% else %}
+          <div class="text-end font-monospace">-</div>
+        {% endif %}
       </div>
     </div>
     {% if currency.exchanged and currency.exchanged.expense_projected %}
@@ -56,8 +64,7 @@
         <div class="tw-text-gray-400">{% translate 'projected total' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
-      <div
-          class="text-end font-monospace">
+      <div class="text-end font-monospace">
         <c-amount.display
             :amount="currency.total_projected"
             :prefix="currency.currency.prefix"
@@ -81,6 +88,7 @@
         <div class="tw-text-gray-400">{% translate 'current income' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
+      {% if currency.income_current != 0 %}
       <div class="text-end font-monospace tw-text-green-400">
         <c-amount.display
             :amount="currency.income_current"
@@ -88,6 +96,9 @@
             :suffix="currency.currency.suffix"
             :decimal_places="currency.currency.decimal_places"></c-amount.display>
       </div>
+      {% else %}
+        <div class="text-end font-monospace">-</div>
+      {% endif %}
     </div>
     {% if currency.exchanged and currency.exchanged.income_current %}
       <div class="text-end font-monospace tw-text-gray-500">
@@ -103,6 +114,7 @@
         <div class="tw-text-gray-400">{% translate 'current expenses' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
+      {% if currency.expense_current != 0 %}
       <div class="text-end font-monospace tw-text-red-400">
         <c-amount.display
             :amount="currency.expense_current"
@@ -110,6 +122,9 @@
             :suffix="currency.currency.suffix"
             :decimal_places="currency.currency.decimal_places"></c-amount.display>
       </div>
+      {% else %}
+        <div class="text-end font-monospace">-</div>
+      {% endif %}
     </div>
     {% if currency.exchanged and currency.exchanged.expense_current %}
       <div class="text-end font-monospace tw-text-gray-500">
@@ -125,8 +140,7 @@
         <div class="tw-text-gray-400">{% translate 'current total' %}</div>
       </div>
       <div class="dotted-line flex-grow-1"></div>
-      <div
-          class="text-end font-monospace">
+      <div class="text-end font-monospace">
         <c-amount.display
             :amount="currency.total_current"
             :prefix="currency.currency.prefix"