From a8a3382f158248d3a626343d6f1f2c34b176333d Mon Sep 17 00:00:00 2001
From: Yapollon <yasschueler@gmail.com>
Date: Fri, 1 Mar 2024 07:53:47 +0100
Subject: [PATCH] Habit Streak Update++

---
 app.py                                |  1 +
 templates/components/habit_lists.html |  2 +-
 templates/components/scripts.html     | 11 ++++++++---
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/app.py b/app.py
index 0c4bac8..235af52 100644
--- a/app.py
+++ b/app.py
@@ -428,6 +428,7 @@ def check_habit():
         "habitId": habit_id,
         "unchecked": not delete_tracking,
         "percentage": habit.percentage,
+        "streak": habit.streak
     }
 
 
diff --git a/templates/components/habit_lists.html b/templates/components/habit_lists.html
index 93601a5..96f997f 100644
--- a/templates/components/habit_lists.html
+++ b/templates/components/habit_lists.html
@@ -121,7 +121,7 @@
                     </div>
 
                     <!-- Streak -->
-                    <div class="col-2" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis">
+                    <div class="col-2" id="streak-{{ habit.id }}" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis">
                         {% if not habit.streak == 0 %}
                         {{ habit.streak }} 🔥
                         {% endif %}
diff --git a/templates/components/scripts.html b/templates/components/scripts.html
index 02d18ab..6bc6dcb 100644
--- a/templates/components/scripts.html
+++ b/templates/components/scripts.html
@@ -4,7 +4,7 @@
                 var progressBar = document.getElementById("progress-bar-" + habitId);
                 var habitBlock = document.getElementById("habit-" + habitId);
 
-                if (percentage == 100) {
+                if (percentage === 100) {
                     progressBar.style.backgroundColor = "green";
                     habitBlock.classList.add("animate-bounce");
                     setTimeout(function () {
@@ -33,11 +33,16 @@
                     // Handle the success response if needed
                     console.log(response.data);
 
+
                     // Set the percentage of the habit. percentage received as integer
-                    var percentage = response.data.percentage;
-                    var progressBar = document.getElementById("progress-bar-" + habitId);
+                    const percentage = response.data.percentage;
+                    const progressBar = document.getElementById("progress-bar-" + habitId);
                     progressBar.style.width = percentage + "%";
                     checkCompletionAndAnimate(habitId, percentage);
+
+                    const streak = response.data.streak;
+                    const streakSymbol = document.getElementById("streak-" + habitId);
+                    streakSymbol.innerText = streak > 0 ? streak.toString() + " 🔥" : "";
                 }).catch(function (error) {
                     // Handle the error if needed
                     console.error('Error:', error);