From 8b8b0f1b96d04f04d2f19aa448afaf55ef7955f5 Mon Sep 17 00:00:00 2001
From: MathewFrancis <mathewfvv@gmail.com>
Date: Tue, 27 May 2025 17:38:30 +0530
Subject: [PATCH] User login with secure JWT cookie return

---
 .../src/components/login-logout/logIn.jsx     | 15 ++++++++++++-
 .../reactcezenpbx/src/http_routs/userHttp.js  | 21 ++++++++++++++++++-
 2 files changed, 34 insertions(+), 2 deletions(-)

diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/login-logout/logIn.jsx b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/login-logout/logIn.jsx
index f222f4e..2147351 100644
--- a/MySQL_conf_pbx/test1/reactcezenpbx/src/components/login-logout/logIn.jsx
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/components/login-logout/logIn.jsx
@@ -1,8 +1,21 @@
+import { userLogin } from "../../http_routs/userHttp";
+
 export default function LogIn() {
+  function logInFunction(event) {
+    event.preventDefault();
+
+    console.log("Log In");
+    const formData = new FormData(event.target);
+    const data = Object.fromEntries(formData.entries());
+
+    console.log(data);
+    userLogin(data.user_name, data.password);
+  }
+
   return (
     <div className="LHS">
       <h2>Log In</h2>
-      <form>
+      <form onSubmit={logInFunction}>
         <div className="form-elements">
           <div>
             <label>user name</label>
diff --git a/MySQL_conf_pbx/test1/reactcezenpbx/src/http_routs/userHttp.js b/MySQL_conf_pbx/test1/reactcezenpbx/src/http_routs/userHttp.js
index 0881167..034dc7b 100644
--- a/MySQL_conf_pbx/test1/reactcezenpbx/src/http_routs/userHttp.js
+++ b/MySQL_conf_pbx/test1/reactcezenpbx/src/http_routs/userHttp.js
@@ -26,8 +26,27 @@ export async function createUserNewAdmin(signUpObject = {}) {
 }
 
 /**
- * this method is used to log-in
+ * this function is used to log-in
  * it uses the basic auth log-in technique
  * if successful a JWT token will be returned from the backend
  * use the JWT token for every subsequent request
  */
+
+//user login data
+export async function userLogin(username, password) {
+  //make an http get request for userLogin login
+
+  const loginResp = await fetch(`${socket}/open/login`, {
+    method: `GET`,
+    headers: basicAuthCredentialsBuilder(username, password),
+    credentials: "include", // <-- VERY IMPORTANT
+  });
+}
+
+//common basic auth header builder
+function basicAuthCredentialsBuilder(username, password) {
+  //builds the appropriate format for basic auth
+  return {
+    Authorization: "Basic " + window.btoa(username + ":" + password),
+  };
+}