From dbd56cdc0621d1d383051c1d3deb161bf9d779fc Mon Sep 17 00:00:00 2001
From: Olivia Mestre Llobell <59211313+BYolivia@users.noreply.github.com>
Date: Fri, 23 Jan 2026 19:52:47 +0100
Subject: [PATCH] Add dashboard component and integrate into dashboard page;
 enable DEV_MODE for testing

---
 src/components/Login.js     |  2 +-
 src/components/dashboard.js | 11 +++++++++++
 src/pages/DashboardPage.js  |  6 +++++-
 src/router.js               |  2 +-
 4 files changed, 18 insertions(+), 3 deletions(-)
 create mode 100644 src/components/dashboard.js

diff --git a/src/components/Login.js b/src/components/Login.js
index 51222c0..7828c48 100644
--- a/src/components/Login.js
+++ b/src/components/Login.js
@@ -2,7 +2,7 @@ export function renderLogin(onLogin) {
   const loginContainer = document.createElement('div');
   loginContainer.className = 'login-container';
 
-  loginContainer.innerHTML = `
+  loginContainer.innerHTML = /*html*/`
     <div class="login-card">
       <h2 class="login-title">Iniciar Sesión</h2>
       <form id="login-form">
diff --git a/src/components/dashboard.js b/src/components/dashboard.js
new file mode 100644
index 0000000..3dfdb73
--- /dev/null
+++ b/src/components/dashboard.js
@@ -0,0 +1,11 @@
+export function renderDashboard() {
+  const container = document.createElement('div');
+  container.className = 'dashboard-container';
+
+  container.innerHTML = /*html*/`
+    <h1>Welcome to the Dashboard</h1>
+    <p>This is the main dashboard page.</p>
+  `;
+
+  return container;
+}
\ No newline at end of file
diff --git a/src/pages/DashboardPage.js b/src/pages/DashboardPage.js
index eca570f..fc0d466 100644
--- a/src/pages/DashboardPage.js
+++ b/src/pages/DashboardPage.js
@@ -1,4 +1,5 @@
 import { auth } from '../services/auth.js';
+import { renderDashboard as renderDashboardComponent } from '../components/dashboard.js';
 
 export function renderDashboard() {
   const user = auth.getUser();
@@ -11,10 +12,13 @@ export function renderDashboard() {
       <button id="logout-button" class="logout-button">Cerrar Sesión</button>
     </div>
     <div class="dashboard-content">
-      <p>Dashboard protegido</p>
     </div>
   `;
 
+  // Agregar el componente dashboard al contenido
+  const contentDiv = container.querySelector('.dashboard-content');
+  contentDiv.appendChild(renderDashboardComponent());
+
   container.querySelector('#logout-button').addEventListener('click', () => {
     auth.logout();
     window.location.hash = '#login';
diff --git a/src/router.js b/src/router.js
index a5f7380..142b3f6 100644
--- a/src/router.js
+++ b/src/router.js
@@ -4,7 +4,7 @@ import { createSidebar } from './components/Sidebar.js';
 import { getAvailablePages, getPageByRoute } from './pages/pagesRegistry.js';
 
 // 🔧 Modo DEV: cambiar a false para activar login
-const DEV_MODE = false;
+const DEV_MODE = true;
 
 export function initRouter() {
   const app = document.querySelector('#app');