Merge pull request #12 from JoaquinPar/feature/progressBar

Progress bar calculations added, displaying and updating the database
This commit is contained in:
Nícolas Agostini authored and GitHub committed 2025-05-08 20:10:37 -07:00
commit 1ddb6a9900
4 files changed
+78 -12

No files matched your search

+28 -7
View File
@@ -1,4 +1,5 @@
const getRates = require("../util/exchangeRate"); const getRates = require("../util/exchangeRate");
const { calculatePlanProgress, updatePlanProgressInDB } = require("../util/calculations");
const status = require("../util/statuses"); const status = require("../util/statuses");
const ObjectId = require('mongodb').ObjectId; const ObjectId = require('mongodb').ObjectId;
const session = require("express-session"); const session = require("express-session");
@@ -89,11 +90,21 @@ module.exports = (middleware, users, plans, assets) => {
router.get('/plans', async (req, res) => { router.get('/plans', async (req, res) => {
try { try {
// console.log(new ObjectId(req.session.user._id)); // console.log(new ObjectId(req.session.user._id));
const userPlans = await plans.find({userId: new ObjectId(req.session.user._id) }).toArray(); const userPlansFromDB = await plans.find({userId: new ObjectId(req.session.user._id) }).toArray();
// console.log(userPlans); // 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', { res.render('plans', {
user: req.session.user, user: req.session.user,
plans: userPlans, plans: updatedUserPlans, // Send the most up-to-date plans
geoData: req.session.geoData geoData: req.session.geoData
}); });
} catch (err) { } catch (err) {
@@ -107,7 +118,8 @@ module.exports = (middleware, users, plans, assets) => {
try { try {
const planId = req.params.id; const planId = req.params.id;
let userAssets = await assets.find({ userId: new ObjectId(req.session.user._id) }).toArray();
if (!ObjectId.isValid(planId)) { if (!ObjectId.isValid(planId)) {
req.session.errMessage = "Invalid plan ID format."; req.session.errMessage = "Invalid plan ID format.";
@@ -122,10 +134,19 @@ module.exports = (middleware, users, plans, assets) => {
return res.status(status.NotFound).redirect('/plans'); return res.status(status.NotFound).redirect('/plans');
} }
// console.log("Found plan:", plan); // 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', { res.render('planDetail', {
user: req.session.user, user: req.session.user,
plan: plan, plan: plan, // This plan object will have the progress from the database
geoData: req.session.geoData geoData: req.session.geoData,
assets: userAssets,
}); });
} catch (err) { } catch (err) {
@@ -174,7 +195,7 @@ module.exports = (middleware, users, plans, assets) => {
retirementExpenses: value.retirementExpenses, retirementExpenses: value.retirementExpenses,
retirementAssets: value.retirementAssets, retirementAssets: value.retirementAssets,
retirementLiabilities: value.retirementLiabilities, retirementLiabilities: value.retirementLiabilities,
progress: "0%" progress: "0"
}; };
try{ try{
+45
View File
@@ -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 };
+4 -4
View File
@@ -12,10 +12,10 @@
<div> <div>
<div class="flex justify-between mb-1"> <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">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>
<div class="w-full bg-gray-200 rounded-full h-3 dark:bg-gray-700"> <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>
</div> </div>
@@ -25,11 +25,11 @@
<div class="grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-4"> <div class="grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-4">
<div> <div>
<label class="block text-sm font-medium text-gray-600 dark:text-gray-400">Number of Assets:</label> <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>
<div> <div>
<label class="block text-sm font-medium text-gray-600 dark:text-gray-400">Total Value:</label> <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> </div>
</div> </div>
+1 -1
View File
@@ -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"> <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> <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="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> </div>
<p class="font-normal text-gray-700 dark:text-gray-400"><%= plan.description %></p> <p class="font-normal text-gray-700 dark:text-gray-400"><%= plan.description %></p>
</a> </a>