fix login handleSubmit and redirect to welcome

cypress/e2e/login.cy.js

@@ -1,2 +1,11 @@
-describe('Login Component', () => {
-}) 
+describe("Login Component", () => {
+  it("should login successfully and redirect to welcome page", () => {
+    cy.visit("/");
+
+    cy.get('input[name="name"]').type("Vimal K Manoj");
+    cy.get('input[name="password"]').type("password123");
+    cy.get('button[type="submit"]').click();
+
+    cy.contains("Welcome, Vimal K Manoj!").should("exist");
+  });
+});

src/components/LoginForm.css

@@ -32,6 +32,7 @@
 }
 
 .form-group input {
+  box-sizing: border-box;
   width: 100%;
   padding: 0.75rem;
   border: 1px solid #ddd;
@@ -64,4 +65,4 @@
 .login-button:focus {
   outline: none;
   box-shadow: 0 0 0 2px rgba(0, 102, 204, 0.2);
-} 
+}

src/components/LoginForm.js

@@ -1,23 +1,29 @@
-import React, { useState } from 'react';
-import './LoginForm.css';
+import React, { useState } from "react";
+import "./LoginForm.css";
 
 function LoginForm({ onLogin }) {
   const [formData, setFormData] = useState({
-    name: '',
-    password: ''
+    name: "",
+    password: "",
   });
 
   const handleChange = (e) => {
     const { name, value } = e.target;
-    setFormData(prevState => ({
+    setFormData((prevState) => ({
       ...prevState,
-      [name]: value
+      [name]: value,
     }));
   };
 
+  // Added this handle submit for redirecting to welcome page
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    onLogin(formData);
+  };
+
   return (
     <div className="login-form-container">
-      <form className="login-form">
+      <form className="login-form" onSubmit={handleSubmit}>
         <h2>Login</h2>
         <div className="form-group">
           <label htmlFor="name">Name:</label>
@@ -49,4 +55,4 @@ function LoginForm({ onLogin }) {
   );
 }
 
-export default LoginForm; 
+export default LoginForm;