Merge pull request #12 from JoaquinPar/feature/progressBar

Progress bar calculations added, displaying and updating the database

src/router/user.js

@@ -1,4 +1,5 @@
 const getRates = require("../util/exchangeRate");
+const { calculatePlanProgress, updatePlanProgressInDB } = require("../util/calculations");
 const status = require("../util/statuses");
 const ObjectId = require('mongodb').ObjectId;
 const session = require("express-session");
@@ -89,11 +90,21 @@ module.exports = (middleware, users, plans, assets) => {
     router.get('/plans', async (req, res) => {
         try {
             // console.log(new ObjectId(req.session.user._id));
-            const userPlans = await plans.find({userId: new ObjectId(req.session.user._id) }).toArray();
-            // console.log(userPlans);
+            const userPlansFromDB = await plans.find({userId: new ObjectId(req.session.user._id) }).toArray();
+            // console.log(userPlansFromDB);
+            
+            // Use a for...of loop for proper async/await behavior in series for updates
+            for (const plan of userPlansFromDB) {
+                const percentage = await calculatePlanProgress(plan, assets, req.session.user._id);
+                await updatePlanProgressInDB(plan._id, percentage, plans); // Pass the 'plans' collection
+            }
+            
+            // Re-fetch plans to get updated progress for rendering
+            const updatedUserPlans = await plans.find({ userId: new ObjectId(req.session.user._id) }).toArray();
+
             res.render('plans', {
                 user: req.session.user,
-                plans: userPlans,
+                plans: updatedUserPlans, // Send the most up-to-date plans
                 geoData: req.session.geoData
             });
         } catch (err) {
@@ -107,7 +118,8 @@ module.exports = (middleware, users, plans, assets) => {
     
         try {
             const planId = req.params.id;
-
+            let userAssets = await assets.find({ userId: new ObjectId(req.session.user._id) }).toArray();
+        
             
             if (!ObjectId.isValid(planId)) {
                 req.session.errMessage = "Invalid plan ID format.";
@@ -122,10 +134,19 @@ module.exports = (middleware, users, plans, assets) => {
                 return res.status(status.NotFound).redirect('/plans');
             }
             // console.log("Found plan:", plan);
+            
+            // The plan.progress should be up-to-date from the database as it was updated in the /plans route
+            // or when assets/plans are modified. If an immediate recalculation for this specific view is absolutely needed,
+            // (e.g., if assets were modified without an immediate plan progress update elsewhere),
+            // you could do it here:
+            // const currentProgress = await calculatePlanProgress(plan, assets, req.session.user._id);
+            // plan.progress = currentProgress; // This would only update the 'plan' object for this render, not in DB
+
             res.render('planDetail', { 
                 user: req.session.user,
-                plan: plan,
-                geoData: req.session.geoData
+                plan: plan, // This plan object will have the progress from the database
+                geoData: req.session.geoData,
+                assets: userAssets,
             });
     
         } catch (err) {
@@ -174,7 +195,7 @@ module.exports = (middleware, users, plans, assets) => {
             retirementExpenses: value.retirementExpenses,
             retirementAssets: value.retirementAssets,
             retirementLiabilities: value.retirementLiabilities,
-            progress: "0%"
+            progress: "0"
         };
 
         try{

src/util/calculations.js

@@ -0,0 +1,45 @@
+const ObjectId = require('mongodb').ObjectId;
+
+async function calculatePlanProgress(plans, assets, userId) {
+    if (!plans || typeof plans.retirementAssets === 'undefined') {
+        console.error("Invalid plan document provided to calculatePlanProgress:", plans);
+        return 0;
+    }
+    if (!assets || typeof assets.find !== 'function') {
+        console.error("Invalid assetsCollection provided to calculatePlanProgress");
+        return 0;
+    }
+
+    try {
+        const userAssets = await assets.find({ userId: new ObjectId(userId) }).toArray();
+        const totalUserAssetValue = userAssets.reduce((total, asset) => total + asset.value, 0);
+        let percentage = 0;
+
+        if (plans.retirementAssets > 0) {
+            percentage = (totalUserAssetValue / plans.retirementAssets) * 100;
+        }
+        return percentage;
+    } catch (err) {
+        console.error("Error in calculatePlanProgress:", err);
+        return 0;
+    }
+}
+
+async function updatePlanProgressInDB(planId, percentage, plans) {
+    if (!plans || typeof plans.updateOne !== 'function') {
+        console.error("Error with the plans collection");
+        return;
+    }
+    if (typeof percentage !== 'number' || isNaN(percentage)) {
+        console.error(`Error with the percentage: ${percentage}`);
+        return;
+    }
+
+    try {
+        await plans.updateOne({ _id: new ObjectId(planId) }, { $set: { progress: parseFloat(percentage.toFixed(2)) } });
+    } catch (err) {
+        console.error("Error in updatePlanProgressInDB:", err);
+    }
+}
+
+module.exports = { calculatePlanProgress, updatePlanProgressInDB };

src/views/planDetail.ejs

@@ -12,10 +12,10 @@
         <div>
             <div class="flex justify-between mb-1">
                 <span class="text-sm font-medium text-blue-700 dark:text-blue-400">Progress</span>
-                <span class="text-sm font-medium text-blue-700 dark:text-blue-400"><%= plan.progress %></span>
+                <span class="text-sm font-medium text-blue-700 dark:text-blue-400"><%= plan.progress %>%</span>
             </div>
             <div class="w-full bg-gray-200 rounded-full h-3 dark:bg-gray-700">
-                <div class="bg-blue-600 h-3 rounded-full dark:bg-blue-500" style="width: <%= plan.progress %>;"></div>
+                <div class="bg-blue-600 h-3 rounded-full dark:bg-blue-500" style="width: <%= plan.progress %>%;"></div>
             </div>
         </div>
 
@@ -25,11 +25,11 @@
             <div class="grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-4">
                 <div>
                     <label class="block text-sm font-medium text-gray-600 dark:text-gray-400">Number of Assets:</label>
-                    <p class="mt-1 text-md text-gray-900 dark:text-white">16 MOCK</p>
+                    <p class="mt-1 text-md text-gray-900 dark:text-white"><%= assets.length %></p>
                 </div>
                 <div>
                     <label class="block text-sm font-medium text-gray-600 dark:text-gray-400">Total Value:</label>
-                    <p class="mt-1 text-md text-gray-900 dark:text-white">$165,000 MOCK</p>
+                    <p class="mt-1 text-md text-gray-900 dark:text-white"><%= assets.reduce((total, asset) => total + asset.value, 0) %></p>
                 </div>
             </div>
         </div>

src/views/plans.ejs

@@ -11,7 +11,7 @@
             <a href="/plans/<%= plan._id %>" class="block max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow-sm hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700">
                 <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white"><%= plan.name %></h5>
                 <div class="w-full bg-gray-200 rounded-full h-2.5 mb-4 dark:bg-gray-700">
-                    <div class="bg-green-600 h-2.5 rounded-full dark:bg-green-500" style="width: <%= plan.progress %> "></div>
+                    <div class="bg-green-600 h-2.5 rounded-full dark:bg-green-500" style="width: <%= plan.progress %>%;"></div>
                 </div>
                 <p class="font-normal text-gray-700 dark:text-gray-400"><%= plan.description %></p>
             </a>