added auth

2 files changed, 68 insertions, 58 deletions

diff --git a/backend/index.js b/backend/index.js
index 670927f..9dae733 100644
--- a/backend/index.js
+++ b/backend/index.js
@@ -1,5 +1,5 @@
-const expres = require('express');
-const bodyParse = require('body-parser');
+const express = require('express');
+const bodyParser = require('body-parser');
 const cors = require('cors');
 const bcrypt = require('bcryptjs');
 const jwt = require('jsonwebtoken');
@@ -7,37 +7,37 @@ const jwt = require('jsonwebtoken');
 const app = express();
 const PORT = 5000;
 
-// middleware
+// Middleware
 app.use(bodyParser.json());
 app.use(cors());
 
-// dummy user data
-const user = [
-    {
-        id: 1,
-        username: 'admin',
-        password: '$2a$10$QWJkLkFgD1kz6X.0Q1jDg.2aH3eRJ/Qnl72sDgB5DlQvPvFjsKFDi' //hashed password for 'password123'
-    },
+// Dummy user data
+const users = [
+  {
+    id: 1,
+    username: 'admin',
+    password: '$2a$10$QWJkLkFgD1kz6X.0Q1jDg.2aH3eRJ/Qnl72sDgB5DlQvPvFjsKFDi', // hashed password for 'password123'
+  },
 ];
 
-// login route
+// Login route
 app.post('/login', async (req, res) => {
-    const { username, password } = req.body;
+  const { username, password } = req.body;
 
-    const user = users.find((user) => user.username === username);
-    if (!user) {
-        return res.status(401).json({ message: 'Invalid credentials'});
-    }
+  const user = users.find((user) => user.username === username);
+  if (!user) {
+    return res.status(401).json({ message: 'Invalid credentials' });
+  }
 
-    const isPasswordValid = await bcrypt.compare(password, user.password);
-    if (!isPasswordValid) {
-        return res.status(401).json({ message: 'Invalid credentials'});
-    }
+  const isPasswordValid = await bcrypt.compare(password, user.password);
+  if (!isPasswordValid) {
+    return res.status(401).json({ message: 'Invalid credentials' });
+  }
 
-    const token = jwt.sign({ id: user.id }, 'your_jwt_secret', { expiresIn: '1h' });
-    res.json({ token });
+  const token = jwt.sign({ id: user.id }, 'your_jwt_secret', { expiresIn: '1h' });
+  res.json({ token });
 });
 
 app.listen(PORT, () => {
-    console.log(`Server running on http://localhost:${PORT}`);
-});
\ No newline at end of file
+  console.log(`Server running on http://localhost:${PORT}`);
+});
diff --git a/src/components/Login.js b/src/components/Login.js
index 620ece0..1b0a9ed 100644
--- a/src/components/Login.js
+++ b/src/components/Login.js
@@ -2,42 +2,52 @@ import React, { useState } from 'react';
 import axios from 'axios';
 
 function Login() {
-    const [username, setUsername] = useState('');
-    const [password, setPassword] = useState('');
-    const [error, setError] = useState('');
+  const [username, setUsername] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState('');
 
-    const handleSubmit = async (event) => {
-        event.preventDefault();
-        try {
-            const response = await axios.post('http://localhost:5000/login', {
-                username, 
-                password,
-            });
-            console.log(response.data);
-            // handle successful login, e.g., redirect to admin panel
-        } catch (error) {
-            setError('Invalid credentialas');
-            console.error('Error logging in', error);
-        }
-    };
+  const handleSubmit = async (event) => {
+    event.preventDefault();
+    try {
+      const response = await axios.post('http://localhost:5000/login', {
+        username,
+        password,
+      });
+      console.log(response.data);
+      // handle successful login, e.g., redirect to admin panel
+    } catch (error) {
+      setError('Invalid credentials');
+      console.error('Error logging in', error);
+    }
+  };
 
-    return (
-        <div className="Login">
-            <h2>Login</h2>
-            {error && <p style={{ color: 'red' }}>{error}</p>}
-            <form onSubmit={handleSubmit}>
-                <div>
-                    <lable>Username:</lable>
-                    <input type="text" value={username} onChange={(e) => setUsername(e.target.value)} required />
-                </div>
-                <div>
-                    <lable>Password:</lable>
-                    <input type="password" value={password} onChange={(e) => setPassword(e.target.value)} required />
-                </div>
-                <button type="submit">Login</button>
-            </form>
+  return (
+    <div className="Login">
+      <h2>Login</h2>
+      {error && <p style={{ color: 'red' }}>{error}</p>}
+      <form onSubmit={handleSubmit}>
+        <div>
+          <label>Username:</label>
+          <input
+            type="text"
+            value={username}
+            onChange={(e) => setUsername(e.target.value)}
+            required
+          />
         </div>
-    );
+        <div>
+          <label>Password:</label>
+          <input
+            type="password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            required
+          />
+        </div>
+        <button type="submit">Login</button>
+      </form>
+    </div>
+  );
 }
 
-export default Login;
\ No newline at end of file
+export default Login;