From 6ec99a729f418e3a1c31221db000cffc0cc29a80 Mon Sep 17 00:00:00 2001
From: rafael <rafaelminaya20@hotmail.com>
Date: Thu, 20 Nov 2025 20:06:02 -0400
Subject: [PATCH] Add "Nueva Solicitud" page and update navigation to support
 new view

Introduced the `NewRequestPage` component for creating and saving HTTP requests. Updated navigation and dynamic header title logic to include the new "create" view. Adjusted `App.js` to handle the new view state and display `NewRequestPage`.
---
 src/App.js                                | 11 +++++++--
 src/components/Requests/NewRequestPage.js | 27 +++++++++++++++++++++++
 2 files changed, 36 insertions(+), 2 deletions(-)
 create mode 100644 src/components/Requests/NewRequestPage.js

diff --git a/src/App.js b/src/App.js
index f51dcc8..3977640 100644
--- a/src/App.js
+++ b/src/App.js
@@ -5,10 +5,11 @@ import { DashboardCards } from './components/Dashboard';
 import RequestTable from './components/Requests/RequestTable';
 import RequestForm from './components/Requests/RequestForm';
 import ScheduledPage from './components/Scheduled/ScheduledPage';
+import NewRequestPage from './components/Requests/NewRequestPage';
 
 function App() {
   const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
-  const [activeView, setActiveView] = useState('dashboard'); // 'dashboard' | 'scheduled'
+  const [activeView, setActiveView] = useState('dashboard'); // 'dashboard' | 'scheduled' | 'create'
 
   const handleToggleMobileMenu = () => setIsMobileMenuOpen(!isMobileMenuOpen);
   const handleNavigate = (key) => {
@@ -16,7 +17,11 @@ function App() {
     setIsMobileMenuOpen(false);
   };
 
-  const headerTitle = activeView === 'scheduled' ? 'Solicitudes Programadas' : 'Dashboard';
+  const headerTitle = activeView === 'scheduled'
+    ? 'Solicitudes Programadas'
+    : activeView === 'create'
+    ? 'Nueva Solicitud'
+    : 'Dashboard';
 
   return (
     <div className="container">
@@ -30,6 +35,8 @@ function App() {
         <Header title={headerTitle} />
         {activeView === 'scheduled' ? (
           <ScheduledPage />
+        ) : activeView === 'create' ? (
+          <NewRequestPage />
         ) : (
           <section className="content-wrapper">
             <DashboardCards />
diff --git a/src/components/Requests/NewRequestPage.js b/src/components/Requests/NewRequestPage.js
new file mode 100644
index 0000000..8082bf6
--- /dev/null
+++ b/src/components/Requests/NewRequestPage.js
@@ -0,0 +1,27 @@
+import React from 'react';
+import '../../styles/components.css';
+import RequestForm from './RequestForm';
+
+const NewRequestPage = () => {
+  return (
+    <section className="content-wrapper">
+      <div className="card" style={{ marginBottom: 24 }}>
+        <div className="form-header">
+          <h3>
+            <i className="fas fa-paper-plane"></i>
+            Nueva Solicitud
+          </h3>
+        </div>
+        <p style={{ color: 'var(--gray)' }}>
+          Crea y guarda una nueva solicitud HTTP para ejecutar ahora o más tarde.
+        </p>
+      </div>
+
+      <div className="content-grid">
+        <RequestForm />
+      </div>
+    </section>
+  );
+};
+
+export default NewRequestPage;