Merge branch 'dev' into feature/questions

app.js

@@ -3,8 +3,10 @@ const MongoStore = require("connect-mongo");
 const session = require("express-session");
 const express = require('express');
 const path = require('path');
+const joi = require('joi'); 
 require('dotenv').config();
 
+
 const app = express();
 const port = process.env.PORT || 3000;
 
@@ -18,7 +20,7 @@ app.use(session({
     store: MongoStore.create({ mongoUrl: `${mongoURI}${database}`, crypto: { secret: secret } }),
     resave: true,
     saveUninitialized: false,
-    cookie: { maxAge: 60000 },
+    cookie: { maxAge: 3600000 },
 }));
 
 app.set('view engine', 'ejs');
@@ -75,7 +77,7 @@ initDatabase().then(() => {
 
     // Import middleware & apply to user routes
     const middleware = require("./src/auth/middleware")(users);
-    app.use(require('./src/router/user')(middleware));
+    app.use(require('./src/router/user')(middleware, users));
 
     // 404 handler
     app.get('/*splat', (req, res) => {

src/auth/authentication.js

@@ -3,6 +3,9 @@ const bcrypt = require('bcrypt');
 const joi = require("joi");
 const salt = 12;
 
+const middleware = require("./middleware");
+
+
 module.exports = (users) => {
     const router = require("express").Router();
 
@@ -14,11 +17,6 @@ module.exports = (users) => {
     
     router.post("/login", async (req, res) => {
       
-        if (req.session.authenticated) {
-            res.redirect("/home");
-            return res.status(status.Ok);        
-        }
-
         const credentialSchema = joi.object({
             email: joi.string().email().required(),
             password: joi.string().max(20).required(),
@@ -45,9 +43,10 @@ module.exports = (users) => {
                 return res.redirect("/login");
             }
 
+            console.log("User logged in successfully");
+            console.log("User email: " + req.body.email);
             req.session.authenticated = true;
             req.session.email = req.body.email;
-
             req.session.errMessage = "";
             res.redirect("/home");
             return res.status(status.Ok);

src/auth/middleware.js

@@ -1,4 +1,5 @@
 const status = require("../util/statuses");
+const session = require("express-session");
 
 /**
  * createMiddleware returns a middleware function for express.

src/router/user.js

@@ -1,6 +1,7 @@
 const status = require("../util/statuses");
+const joi = require("joi");
 
-module.exports = (middleware) => {
+module.exports = (middleware, users) => {
     const router = require("express").Router();
     
     router.use(middleware);
@@ -35,6 +36,78 @@ module.exports = (middleware) => {
         return res.status(status.Ok);
     });
 
+    router.get('/questionnaire', (req, res) => {
+        const errMessage = req.session.errMessage;
+        req.session.errMessage = ""; 
+        res.render('questionnaire', { user: req.user, errMessage: errMessage });
+    });
+
+    router.post('/questionnaire', (req, res) => {
+        console.log("Questionnaire POST body:", req.body);
+    
+        const questionnaireSchema = joi.object({
+            dob: joi.date().required(),
+            education: joi.string().valid('primary', 'secondary', 'tertiary', 'postgraduate').required(),
+            maritalStatus: joi.string().valid('single', 'married', 'divorced', 'widowed').required(),
+            income: joi.number().min(0).required(),
+            expenses: joi.number().min(0).required(),
+            assets: joi.number().min(0).required(),
+            liabilities: joi.number().min(0).required(),
+            retirementAge: joi.number().min(18).max(120).required(),
+            retirementExpenses: joi.number().min(0).required(),
+            retirementAssets: joi.number().min(0).required(),
+            retirementLiabilities: joi.number().min(0).required(),
+        });
+    
+        const validationOptions = { convert: true, abortEarly: false }; 
+        const { error, value } = questionnaireSchema.validate(req.body, validationOptions);
+    
+        if (error) { 
+            console.error("Questionnaire validation error:", error.details);
+            req.session.errMessage = "Invalid input: " + error.details.map(d => d.message.replace(/"/g, '')).join(', '); 
+            res.status(status.BadRequest).redirect("/questionnaire"); 
+            return; 
+        }
+    
+        users.updateOne( 
+            { email: req.session.email }, 
+            { 
+                $set: { 
+                    financialData: true, 
+                    dob: value.dob,
+                    education: value.education,
+                    maritalStatus: value.maritalStatus,
+                    income: value.income,
+                    expenses: value.expenses,
+                    assets: value.assets,
+                    liabilities: value.liabilities,
+                    retirementAge: value.retirementAge,
+                    retirementExpenses: value.retirementExpenses,
+                    retirementAssets: value.retirementAssets,
+                    retirementLiabilities: value.retirementLiabilities,
+                } 
+            }
+        ).then((result) => { 
+            if (result.matchedCount === 0) {
+                console.log(`User not found during questionnaire update: ${req.session.email}`);
+                req.session.errMessage = "User session invalid. Please log in again."; 
+                res.status(status.NotFound).redirect("/login"); 
+                return;
+            }
+            if (result.modifiedCount === 0 && result.matchedCount === 1) {
+                console.log(`User questionnaire data unchanged (already up-to-date): ${req.session.email}`);
+            }
+        
+            req.session.errMessage = ""; 
+            res.status(status.Ok).redirect("/home"); 
+    
+        }).catch(err => { 
+            console.error("Error updating questionnaire in database:", err);
+            req.session.errMessage = "An error occurred while saving your information. Please try again.";
+            res.status(status.InternalServerError).redirect("/questionnaire"); 
+        });
+    });
+
     router.get('/logout', (req, res) => {
         req.session.destroy();
         return res.redirect('/login');

src/views/aboutUs.ejs

@@ -1,39 +1,56 @@
-<%- include("./partials/fileHeader") %>
+<html>
-<%- include("./partials/headerStart") %>
+    <head>
+        <title>RCalculator</title>
+        <link rel="icon" href="https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/png/rekor.png">
+        <link href="https://cdn.jsdelivr.net/npm/tailwindcss@3.3.2/dist/tailwind.min.css" rel="stylesheet">
+    </head>
+    <body class="bg-white dark:bg-gray-900">
+        <%- include("./partials/headerStart") %>
+        <main>
+            <section class="bg-white dark:bg-gray-900 py-12 md:py-20">
+                <div class="max-w-screen-lg mx-auto px-4 text-center">
+                    <h1 class="mb-4 text-4xl font-extrabold tracking-tight leading-none text-gray-900 md:text-5xl lg:text-6xl dark:text-white">About RCalculator</h1>
+                    <p class="mb-12 text-lg font-normal text-gray-500 lg:text-xl sm:px-16 dark:text-gray-400">Welcome to RCalculator, your partner in building a secure and fulfilling financial future.</p>
+                </div>
 
-<main>
+                <div class="max-w-screen-md mx-auto px-4">
-    <section class="bg-white dark:bg-gray-900 py-12 md:py-20">
+                    <h2 class="mb-4 text-3xl font-bold tracking-tight text-gray-900 dark:text-white text-center">Our Mission</h2>
-        <div class="max-w-screen-lg mx-auto px-4 text-center">
+                    <p class="mb-6 font-normal text-gray-600 dark:text-gray-400 text-lg text-center">
-            <h1 class="mb-4 text-4xl font-extrabold tracking-tight leading-none text-gray-900 md:text-5xl lg:text-6xl dark:text-white">About RCalculator</h1>
+                        Our mission is to empower you with the tools and insights needed to take control of your long-term financial goals.
-            <p class="mb-12 text-lg font-normal text-gray-500 lg:text-xl sm:px-16 dark:text-gray-400">Welcome to RCalculator, your partner in building a secure and fulfilling financial future.</p>
+                    </p>
-        </div>
+                    <div class="prose lg:prose-lg dark:prose-invert mx-auto text-gray-600 dark:text-gray-400">
-
+                        <p class="mb-4">
-        <div class="max-w-screen-md mx-auto px-4">
+                            We believe that planning for your desired future, especially retirement, shouldn't be daunting. It doesn't matter what your current age or career status is – starting now is what counts.
-            <h2 class="mb-4 text-3xl font-bold tracking-tight text-gray-900 dark:text-white text-center">Our Mission</h2>
+                        </p>
-            <p class="mb-6 font-normal text-gray-600 dark:text-gray-400 text-lg text-center">
+                        <p class="mb-4">
-                Our mission is to empower you with the tools and insights needed to take control of your long-term financial goals.
+                            At RCalculator, we help you trace a personalized plan that suits your unique aspirations. We provide clear, actionable advice and projections to guide you on how to get there, whether you're just starting your career, mid-way through, or nearing retirement.
-            </p>
+                        </p>
-            <div class="prose lg:prose-lg dark:prose-invert mx-auto text-gray-600 dark:text-gray-400">
+                        <p>
-                <p class="mb-4">
+                            Let us help you navigate the path to financial independence and achieve the retirement lifestyle you envision.
-                    We believe that planning for your desired future, especially retirement, shouldn't be daunting. It doesn't matter what your current age or career status is – starting now is what counts.
+                        </p>
-                </p>
+                    </div>
-                <p class="mb-4">
+                </div>
-                    At RCalculator, we help you trace a personalized plan that suits your unique aspirations. We provide clear, actionable advice and projections to guide you on how to get there, whether you're just starting your career, mid-way through, or nearing retirement.
+                <div class="flex flex-col space-y-4 sm:flex-row sm:justify-center sm:space-y-0">
-                </p>
+                    <a href="/login" class="inline-flex justify-center items-center mt-4 py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 dark:focus:ring-blue-900">
-                <p>
+                        Get started
-                    Let us help you navigate the path to financial independence and achieve the retirement lifestyle you envision.
+                        <svg class="w-3.5 h-3.5 ms-2 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                </p>
+                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                        </svg>
+                    </a>
+                </div>
+            </section>
+        </main>
+        <footer>
+            <div class="fixed bottom-0 left-0 z-50 hidden lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
+                <div class="container mx-auto">
+                    <p>&copy; 2025 RCalculator. All rights reserved.</p>
+                 </div>
             </div>
-        </div>
+        </footer>
-        <div class="flex flex-col space-y-4 sm:flex-row sm:justify-center sm:space-y-0">
+        <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
-            <a href="/signup" class="inline-flex justify-center items-center mt-4 py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 dark:focus:ring-blue-900">
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.min.js"></script>
-                Get started
+    </body>
-                <svg class="w-3.5 h-3.5 ms-2 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+</html>
-                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-            </a>
-        </div>
-    </section>
-</main>
 
-<%- include("./partials/footer") %>
+
+<!--fixed bottom-0 left-0 z-50 lg:hidden w-full h-16 bg-white border-t border-gray-200 dark:bg-gray-400-->

src/views/assets.ejs

@@ -1,9 +1,23 @@
-<%- include("./partials/fileHeader") %>
+<!DOCTYPE html>
-<%- include("./partials/header") %>
+<html lang="en">
-
+    <head>
-<main>
+        <meta charset="UTF-8">
-    The Assets Page
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-</main>
+        <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
-
+        <title>Document</title>
-<%- include("./partials/navBar") %>
+    </head>
-<%- include("./partials/footer") %>
+    <body>
+        <%- include("./partials/header") %>
+        <main>
+            The Assets Page
+        </main>
+        <footer>
+            <div class="fixed bottom-0 left-0 z-50 hidden lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
+                <div class="container mx-auto">
+                    <p>&copy; 2025 RCalculator. All rights reserved.</p>
+                </div>
+            </div>
+            <%- include("./partials/navBar") %>
+        </footer>
+    </body>
+</html>

src/views/home.ejs

@@ -1,10 +1,30 @@
-<%- include("./partials/fileHeader") %>
+<!DOCTYPE html>
-<%- include("./partials/header") %>
+<html lang="en">
 
-<main>
+<head>
-    Welcome: <%= user.email %>
+    <meta charset="UTF-8">
-    The Dashboard Page
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-</main>
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+    <title>Document</title>
+</head>
 
-<%- include("./partials/navBar") %>
+<body>
-<%- include("./partials/footer") %>
+    <main>
+        <%- include("./partials/header") %>
+        Welcome: <%= user.email %>
+        The Dashboard Page
+        <% if(user.authenticated) { %>
+            <%= user.email %>
+            <%= user.errMessage %>
+        <% } %>
+    </main>
+    <footer>
+        <div class="fixed bottom-0 left-0 z-50 sm:hidden lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
+            <div class="container mx-auto">
+                <p>&copy; 2025 RCalculator. All rights reserved.</p>
+             </div>
+        </div>
+    </footer>
+</body>
+
+</html>

src/views/index.ejs

@@ -1,9 +1,23 @@
-<%- include("./partials/fileHeader") %>
+<!DOCTYPE html>
-<%- include("./partials/header") %>
+<html lang="en">
 
-<main>
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+    <title>Document</title>
+</head>
+
+<body>
     The Index Page
-</main>
+    <footer>
+        <div class="fixed bottom-0 left-0 z-50 sm:hidden lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
+            <div class="container mx-auto">
+                <p>&copy; 2025 RCalculator. All rights reserved.</p>
+             </div>
+        </div>
+        <%- include("./partials/navBar") %>
+    </footer>
+</body>
 
-<%- include("./partials/navBar") %>
+</html>
-<%- include("./partials/footer") %>

src/views/landing.ejs

@@ -1,24 +1,38 @@
-<%- include("./partials/fileHeader") %>
+<html>
-<%- include("./partials/headerStart") %>
+    <head>
-
+        <title>RCalculator</title>
-<main>
+        <link rel="icon" href="https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/png/rekor.png">
-    <section class="bg-center bg-no-repeat bg-cover bg-[url('/images/bg1.jpg')] bg-gray-400 bg-blend-multiply">
+        <link href="https://cdn.jsdelivr.net/npm/tailwindcss@3.3.2/dist/tailwind.min.css" rel="stylesheet">
-        <div class="px-4 mx-auto max-w-screen-xl text-center py-24 lg:py-56">
+    </head>
-            <h1 class="mb-4 text-4xl font-extrabold tracking-tight leading-none text-white md:text-5xl lg:text-6xl">Plan now, live better.</h1>
+    <body class="bg-white dark:bg-gray-900">
-            <p class="mb-8 text-lg font-normal text-gray-300 lg:text-xl sm:px-16 lg:px-48">Planning your retirement is a crucial step towards financial security and a happy future.</p>
+        <%- include("./partials/headerStart") %>
-            <div class="flex flex-col space-y-4 sm:flex-row sm:justify-center sm:space-y-0">
+        <main>
-                <a href="/signup" class="inline-flex justify-center items-center py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 dark:focus:ring-blue-900">
+            <section class="bg-center bg-no-repeat bg-cover bg-[url('/images/bg1.jpg')] bg-gray-400 bg-blend-multiply">
-                    Get started
+                <div class="px-4 mx-auto max-w-screen-xl text-center py-24 lg:py-56">
-                    <svg class="w-3.5 h-3.5 ms-2 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                    <h1 class="mb-4 text-4xl font-extrabold tracking-tight leading-none text-white md:text-5xl lg:text-6xl">Plan now, live better.</h1>
-                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    <p class="mb-8 text-lg font-normal text-gray-300 lg:text-xl sm:px-16 lg:px-48">Planning your retirement is a crucial step towards financial security and a happy future.</p>
-                    </svg>
+                    <div class="flex flex-col space-y-4 sm:flex-row sm:justify-center sm:space-y-0">
-                </a>
+                        <a href="/login" class="inline-flex justify-center items-center py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 dark:focus:ring-blue-900">
-                <a href="/aboutUs" class="inline-flex justify-center hover:text-gray-900 items-center py-3 px-5 sm:ms-4 text-base font-medium text-center text-white rounded-lg border border-white hover:bg-gray-100 focus:ring-4 focus:ring-gray-400">
+                            Get started
-                    Learn more
+                            <svg class="w-3.5 h-3.5 ms-2 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                </a>  
+                                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                            </svg>
+                        </a>
+                        <a href="/aboutUs" class="inline-flex justify-center hover:text-gray-900 items-center py-3 px-5 sm:ms-4 text-base font-medium text-center text-white rounded-lg border border-white hover:bg-gray-100 focus:ring-4 focus:ring-gray-400">
+                            Learn more
+                        </a>  
+                    </div>
+                </div>
+            </section>
+        </main>
+        <footer>
+            <div class="fixed bottom-0 left-0 z-50 sm:hidden lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
+                <div class="container mx-auto">
+                    <p>&copy; 2025 RCalculator. All rights reserved.</p>
+                 </div>
             </div>
-        </div>
+        </footer>
-    </section>
+        <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
-</main>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.min.js"></script>
-
+    </body>
-<%- include("./partials/footer") %>
+</html>

src/views/login.ejs

@@ -1,7 +1,19 @@
-<%- include("./partials/fileHeader") %>
+<!DOCTYPE html>
+<html lang="en">
 
-<main>
+<head>
-    <div class="flex justify-center items-center h-screen">
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Login Page</title>
+    <link rel="stylesheet" href="/static/css/style.css" <link rel="stylesheet" href="/static/css/style.css">
+    <link rel="stylesheet" href="/static/css/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
+    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@3.3.2/dist/tailwind.min.css" rel="stylesheet">
+</head>
+
+<body>
+    <div class="flex justify-center items-center h-screen bg-gray-700">
         <form action="/login" method="POST">
             <div class="w-96 p-6 shadow-1g bg-white rounded-md">
                 <h1 class="text-3xl block text-center font-semibold"> Login </h1>
@@ -39,6 +51,7 @@
             </div>
         </form>
     </div>
-</main>
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+</body>
 
-<%- include("./partials/footer") %>
+</html>

src/views/more.ejs

@@ -1,10 +1,25 @@
-<%- include("./partials/fileHeader") %>
+<!DOCTYPE html>
-<%- include("./partials/header") %>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+    <title>Document</title>
+</head>
 
-<main>
+<body>
-    The More Page
+    <%- include("./partials/header") %>
-</main>
+    <main>
-
+        The More Page
-<%- include("./partials/navBar") %>
+    </main>
-<%- include("./partials/footer") %>
+    <footer>
+        <div class="fixed bottom-0 left-0 z-50 sm:hidden lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
+            <div class="container mx-auto">
+                <p>&copy; 2025 RCalculator. All rights reserved.</p>
+             </div>
+        </div>
+        <%- include("./partials/navBar") %>
+    </footer>
+</body>
 
+</html>

src/views/partials/fileHeader.ejs

@@ -1,10 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta charset="utf-8">
-        <meta http-equiv="X-UA-Compatible" content="IE=edge">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
-        <title>RCalculator</title>
-    </head>
-    <body class="bg-white dark:bg-gray-900">

src/views/partials/footer.ejs

@@ -1,10 +0,0 @@
-
-<footer>
-    <div class="fixed bottom-0 left-0 z-50 hidden lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
-        <div class="container mx-auto">
-            <p>&copy; 2025 RCalculator. All rights reserved.</p>
-            </div>
-    </div>
-</footer>
-</body>
-</html>

src/views/partials/headerStart.ejs

@@ -20,7 +20,7 @@
                         <a href="/" class="block py-2 px-3 lg:p-0 text-gray-900 rounded hover:bg-gray-100 lg:hover:bg-transparent lg:border-0 lg:hover:text-blue-700 dark:text-white lg:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white lg:dark:hover:bg-transparent">Home</a>
                     </li>
                     <li>
-                        <a href="/login" class="block py-2 px-3 lg:p-0 text-gray-900 rounded hover:bg-gray-100 lg:hover:bg-transparent lg:border-0 lg:hover:text-blue-700 dark:text-white lg:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white lg:dark:hover:bg-transparent">Login</a>
+                        <a href="/aboutUs" class="block py-2 px-3 lg:p-0 text-gray-900 rounded hover:bg-gray-100 lg:hover:bg-transparent lg:border-0 lg:hover:text-blue-700 dark:text-white lg:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white lg:dark:hover:bg-transparent">About Us</a>
                     </li>
                     <li>
                         <a href="mailto:rcalculator@gmail.com" class="block py-2 px-3 lg:p-0 text-gray-900 rounded hover:bg-gray-100 lg:hover:bg-transparent lg:border-0 lg:hover:text-blue-700 dark:text-white lg:dark:hover:text-blue-500 dark:hover:bg-gray-700 dark:hover:text-white lg:dark:hover:bg-transparent">Contact us</a>

src/views/partials/navBar.ejs

@@ -27,3 +27,4 @@
         </a>
     </div>
 </div>
+

src/views/plans.ejs

@@ -1,9 +1,26 @@
-<%- include("./partials/fileHeader") %>
+<!DOCTYPE html>
-<%- include("./partials/header") %>
+<html lang="en">
 
-<main>
+<head>
-    The Plans Page
+    <meta charset="UTF-8">
-</main>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+    <title>Document</title>
+</head>
 
-<%- include("./partials/navBar") %>
+<body>
-<%- include("./partials/footer") %>
+    <%- include("./partials/header") %>
+    <main>
+        The Plans Page
+    </main>
+    <footer>
+        <div class="fixed bottom-0 left-0 z-50 sm:hidden lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
+            <div class="container mx-auto">
+                <p>&copy; 2025 RCalculator. All rights reserved.</p>
+             </div>
+        </div>
+        <%- include("./partials/navBar") %>
+    </footer>
+</body>
+
+</html>

src/views/questionnaire.ejs

@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+    <title>Document</title>
+</head>
+
+<body>
+    <%- include("./partials/header") %>
+    <main class="container mx-auto p-4">
+        <h2 class="text-xl font-semibold mb-4">Welcome: <%= user.email %></h2>
+        <div class="max-w-md mx-auto bg-white p-8 mb-10 rounded-lg shadow-md">
+            <h3 class="text-lg font-medium mb-6">Financial Questionnaire</h3>
+            <form action="/questionnaire" method="post" class="space-y-4">
+                <div>
+                    <label for="dob" class="block text-sm font-medium text-gray-700">Date of Birth</label>
+                    <input type="date" name="dob" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+                <div>
+                    <label for="education" class="block text-sm font-medium text-gray-700">Education</label>
+                    <select name="education" id="education" class="mt-1 block w-full px-3 py-2 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                        <option value="primary">Primary (Elementary)</option>
+                        <option value="secondary">Secondary (High School)</option>
+                        <option value="tertiary">Tertiary (College/University)</option>
+                        <option value="postgraduate">Postgraduate (Master's/PhD)</option>
+                    </select>
+                </div>
+                <div>
+                    <label class="block text-sm font-medium text-gray-700">Marital Status</label>
+                    <div class="mt-1 space-x-4">
+                        <label class="inline-flex items-center">
+                            <input type="radio" name="maritalStatus" value="single" class="form-radio h-4 w-4 text-indigo-600 border-gray-300 focus:ring-indigo-500">
+                            <span class="ml-2 text-sm text-gray-700">Single</span>
+                        </label>
+                        <label class="inline-flex items-center">
+                            <input type="radio" name="maritalStatus" value="married" class="form-radio h-4 w-4 text-indigo-600 border-gray-300 focus:ring-indigo-500">
+                             <span class="ml-2 text-sm text-gray-700">Married</span>
+                        </label>
+                         <label class="inline-flex items-center">
+                            <input type="radio" name="maritalStatus" value="divorced" class="form-radio h-4 w-4 text-indigo-600 border-gray-300 focus:ring-indigo-500">
+                             <span class="ml-2 text-sm text-gray-700">Divorced</span>
+                        </label>
+                         <label class="inline-flex items-center">
+                            <input type="radio" name="maritalStatus" value="widowed" class="form-radio h-4 w-4 text-indigo-600 border-gray-300 focus:ring-indigo-500">
+                             <span class="ml-2 text-sm text-gray-700">Widowed</span>
+                        </label>
+                    </div>
+                </div>
+                
+                <div>
+                    <label for="income" class="block text-sm font-medium text-gray-700">Annual Gross Income</label>
+                    <input type="number" name="income" min="0" placeholder="e.g., 50000" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+                
+                <div>
+                    <label for="expenses" class="block text-sm font-medium text-gray-700">Monthly Expenses</label>
+                    <input type="number" name="expenses" min="0" placeholder="e.g., 2000" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+                
+                <div>
+                    <label for="assets" class="block text-sm font-medium text-gray-700">Net Worth</label>
+                    <input type="number" name="assets" min="0" placeholder="Estimated Net Worth" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+                
+                <div>
+                    <label for="liabilities" class="block text-sm font-medium text-gray-700">Liabilities</label>
+                    <input type="number" name="liabilities" min="0" placeholder="Estimated Liabilities" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+            
+                <div>
+                    <label for="retirementAge" class="block text-sm font-medium text-gray-700">Desired Retirement Age</label>
+                    <input type="number" name="retirementAge" placeholder="e.g., 65" min="18" max="120" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+
+                <div>
+                    <label for="retirementExpenses" class="block text-sm font-medium text-gray-700">Estimated Monthly Retirement Expenses</label>
+                    <input type="number" name="retirementExpenses" min="0" placeholder="e.g., 3000" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+
+                <div>
+                    <label for="retirementAssets" class="block text-sm font-medium text-gray-700">Estimated Retirement Assets</label>
+                    <input type="number" name="retirementAssets" min="0" placeholder="e.g., 500000" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+
+                <div>
+                    <label for="retirementLiabilities" class="block text-sm font-medium text-gray-700">Estimated Retirement Liabilities</label>
+                    <input type="number" name="retirementLiabilities" min="0" placeholder="e.g., 50000" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+                </div>
+                
+                <div>
+                    <button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">Submit Questionnaire</button>
+                </div>
+            </form>
+        </div>
+    </main>
+    <footer>
+        <div class="fixed bottom-0 left-0 z-50 sm:hidden mt-5 lg:block w-full h-16 bg-gray-100 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 p-6 text-center text-gray-500 dark:text-gray-400 text-sm">
+            <div class="container mx-auto">
+                <p>&copy; 2025 RCalculator. All rights reserved.</p>
+             </div>
+        </div>
+    </footer>
+</body>
+
+</html>

src/views/signup.ejs

@@ -1,8 +1,19 @@
-<%- include("./partials/fileHeader") %>
+<!DOCTYPE html>
-<%- include("./partials/headerStart") %>
+<html lang="en">
 
-<main>
+<head>
-    <div class="flex justify-center items-center h-screen">
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Signup</title>
+    <link rel="stylesheet" href="/static/css/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
+        integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
+        crossorigin="anonymous" referrerpolicy="no-referrer" />
+</head>
+
+<body>
+    <div class="flex justify-center items-center h-screen bg-gray-700">
         <form action="/signup" method="POST">
             <div class="w-96 p-6 shadow-1g bg-white rounded-md">
                 <h1 class="text-3xl block text-center font-semibold"> Signup </h1>
@@ -35,6 +46,7 @@
             </div>
         </form>
     </div>
-</main>
+    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
+</body>
 
-<%- include("./partials/footer") %>
+</html>

src/views/template.ejs

@@ -1,9 +0,0 @@
-<%- include("./partials/fileHeader") %>
-<%- include("./partials/header") %>
-
-<main>
-    <!-- Your content here -->
-</main>
-
-<%- include("./partials/navBar") %>
-<%- include("./partials/footer") %>