Compare commits
4 Commits
Author | SHA1 | Date | |
---|---|---|---|
9241257d30 | |||
6a8d13b69b | |||
7abed30091 | |||
850c475329 |
110
backend/routes/api.js
Normal file
110
backend/routes/api.js
Normal file
@@ -0,0 +1,110 @@
|
|||||||
|
import express from "express";
|
||||||
|
import {
|
||||||
|
loginUser,
|
||||||
|
createUser,
|
||||||
|
updateUser,
|
||||||
|
deleteUser,
|
||||||
|
getAllUsers,
|
||||||
|
} from "../services/database.js";
|
||||||
|
import { generateToken, authenticate } from "../services/tokenService.js";
|
||||||
|
|
||||||
|
const router = express.Router();
|
||||||
|
|
||||||
|
router.post("/login", async (req, res) => {
|
||||||
|
try {
|
||||||
|
const result = await loginUser(req.body.username, req.body.password);
|
||||||
|
if (result.success && result.user.role === "admin") {
|
||||||
|
const userToken = await generateToken({
|
||||||
|
role: result.user.role,
|
||||||
|
username: result.user.username,
|
||||||
|
});
|
||||||
|
console.log("User token generated: ", userToken);
|
||||||
|
res.status(200).json({
|
||||||
|
success: true,
|
||||||
|
message: "Login successful",
|
||||||
|
token: userToken,
|
||||||
|
...result,
|
||||||
|
});
|
||||||
|
} else if (result.success && result.user.role === "user") {
|
||||||
|
res.status(403).json(result, { message: "You are not an Admin!" }); // Event Handler is in LoginCard.tsx - there is defined what happens when the status is 403
|
||||||
|
} else {
|
||||||
|
res.status(401).json(result, { message: "Invalid credentials" }); // Event Handler is in LoginCard.tsx - there is defined what happens when the status is 401
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.error("Error logging in:", err);
|
||||||
|
res.status(500).json({ success: false, message: "Internal server error" });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
router.get("/getAllUsers", authenticate, async (req, res) => {
|
||||||
|
if (req.user.role === "admin") {
|
||||||
|
getAllUsers()
|
||||||
|
.then((users) => {
|
||||||
|
res.status(200).json(users);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error("Error fetching users:", err);
|
||||||
|
res
|
||||||
|
.status(500)
|
||||||
|
.json({ success: false, message: "Internal server error" });
|
||||||
|
});
|
||||||
|
console.log("Fetched all users successfully");
|
||||||
|
} else if (req.user.role === "user") {
|
||||||
|
res.status(403).json({ success: false, message: "Access denied" });
|
||||||
|
console.log("Access denied for user role");
|
||||||
|
} else {
|
||||||
|
res.status(500).json({ success: false, message: "Server error" });
|
||||||
|
console.log("Server error while fetching users");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
router.post("/deleteUser", authenticate, async (req, res) => {
|
||||||
|
if (req.user.role === "admin") {
|
||||||
|
deleteUser(req.body.id)
|
||||||
|
.then((result) => {
|
||||||
|
if (result.success) {
|
||||||
|
res.status(200).json(result);
|
||||||
|
} else {
|
||||||
|
throw new Error("Failed to delete user");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error("Error deleting user:", err);
|
||||||
|
res
|
||||||
|
.status(500)
|
||||||
|
.json({ success: false, message: "Internal server error" });
|
||||||
|
});
|
||||||
|
console.log("User deleted successfully");
|
||||||
|
} else {
|
||||||
|
console.log("Access denied for user role");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
router.post("/updateUser", authenticate, async (req, res) => {
|
||||||
|
if (req.user.role === "admin") {
|
||||||
|
updateUser(
|
||||||
|
req.body.username,
|
||||||
|
req.body.first_name,
|
||||||
|
req.body.last_name,
|
||||||
|
req.body.password,
|
||||||
|
req.body.email,
|
||||||
|
req.body.id
|
||||||
|
)
|
||||||
|
.then((result) => {
|
||||||
|
if (result.success) {
|
||||||
|
res.status(200).json(result);
|
||||||
|
} else {
|
||||||
|
throw new Error("Failed to update user");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error("Error updating user:", err);
|
||||||
|
res
|
||||||
|
.status(500)
|
||||||
|
.json({ success: false, message: "Internal server error" });
|
||||||
|
});
|
||||||
|
console.log("User updated successfully");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
export default router;
|
@@ -3,15 +3,8 @@ import express from "express";
|
|||||||
import cors from "cors";
|
import cors from "cors";
|
||||||
const app = express();
|
const app = express();
|
||||||
const port = 5002;
|
const port = 5002;
|
||||||
import {
|
|
||||||
loginUser,
|
|
||||||
createUser,
|
|
||||||
updateUser,
|
|
||||||
deleteUser,
|
|
||||||
getAllUsers,
|
|
||||||
} from "./services/database.js";
|
|
||||||
import { generateToken, authenticate } from "./services/tokenService.js";
|
|
||||||
import cookieParser from "cookie-parser";
|
import cookieParser from "cookie-parser";
|
||||||
|
import router from "./routes/api.js";
|
||||||
|
|
||||||
//view engine ejs
|
//view engine ejs
|
||||||
app.set("view engine", "ejs");
|
app.set("view engine", "ejs");
|
||||||
@@ -20,102 +13,7 @@ app.use(express.json());
|
|||||||
app.use(cors());
|
app.use(cors());
|
||||||
app.use(cookieParser());
|
app.use(cookieParser());
|
||||||
|
|
||||||
app.post("/api/login", async (req, res) => {
|
app.use("/api", router);
|
||||||
try {
|
|
||||||
const result = await loginUser(req.body.username, req.body.password);
|
|
||||||
if (result.success && result.user.role === "admin") {
|
|
||||||
const userToken = await generateToken({
|
|
||||||
role: result.user.role,
|
|
||||||
username: result.user.username,
|
|
||||||
});
|
|
||||||
console.log("User token generated: ", userToken);
|
|
||||||
res.status(200).json({
|
|
||||||
success: true,
|
|
||||||
message: "Login successful",
|
|
||||||
token: userToken,
|
|
||||||
...result,
|
|
||||||
});
|
|
||||||
} else if (result.success && result.user.role === "user") {
|
|
||||||
res.status(403).json(result, { message: "You are not an Admin!" }); // Event Handler is in LoginCard.tsx - there is defined what happens when the status is 403
|
|
||||||
} else {
|
|
||||||
res.status(401).json(result, { message: "Invalid credentials" }); // Event Handler is in LoginCard.tsx - there is defined what happens when the status is 401
|
|
||||||
}
|
|
||||||
} catch (err) {
|
|
||||||
console.error("Error logging in:", err);
|
|
||||||
res.status(500).json({ success: false, message: "Internal server error" });
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
app.get("/api/getAllUsers", authenticate, async (req, res) => {
|
|
||||||
if (req.user.role === "admin") {
|
|
||||||
getAllUsers()
|
|
||||||
.then((users) => {
|
|
||||||
res.status(200).json(users);
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.error("Error fetching users:", err);
|
|
||||||
res
|
|
||||||
.status(500)
|
|
||||||
.json({ success: false, message: "Internal server error" });
|
|
||||||
});
|
|
||||||
console.log("Fetched all users successfully");
|
|
||||||
} else if (req.user.role === "user") {
|
|
||||||
res.status(403).json({ success: false, message: "Access denied" });
|
|
||||||
console.log("Access denied for user role");
|
|
||||||
} else {
|
|
||||||
res.status(500).json({ success: false, message: "Server error" });
|
|
||||||
console.log("Server error while fetching users");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
app.post("/api/deleteUser", authenticate, async (req, res) => {
|
|
||||||
if (req.user.role === "admin") {
|
|
||||||
deleteUser(req.body.id)
|
|
||||||
.then((result) => {
|
|
||||||
if (result.success) {
|
|
||||||
res.status(200).json(result);
|
|
||||||
} else {
|
|
||||||
throw new Error("Failed to delete user");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.error("Error deleting user:", err);
|
|
||||||
res
|
|
||||||
.status(500)
|
|
||||||
.json({ success: false, message: "Internal server error" });
|
|
||||||
});
|
|
||||||
console.log("User deleted successfully");
|
|
||||||
} else {
|
|
||||||
console.log("Access denied for user role");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
app.post("/api/updateUser", authenticate, async (req, res) => {
|
|
||||||
if (req.user.role === "admin") {
|
|
||||||
updateUser(
|
|
||||||
req.body.username,
|
|
||||||
req.body.first_name,
|
|
||||||
req.body.last_name,
|
|
||||||
req.body.password,
|
|
||||||
req.body.email,
|
|
||||||
req.body.id
|
|
||||||
)
|
|
||||||
.then((result) => {
|
|
||||||
if (result.success) {
|
|
||||||
res.status(200).json(result);
|
|
||||||
} else {
|
|
||||||
throw new Error("Failed to update user");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.error("Error updating user:", err);
|
|
||||||
res
|
|
||||||
.status(500)
|
|
||||||
.json({ success: false, message: "Internal server error" });
|
|
||||||
});
|
|
||||||
console.log("User updated successfully");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
app.listen(port, () => {
|
app.listen(port, () => {
|
||||||
console.log(`Express backend server is running at http://localhost:${port}`);
|
console.log(`Express backend server is running at http://localhost:${port}`);
|
||||||
|
1
frontend_admin/.env
Normal file
1
frontend_admin/.env
Normal file
@@ -0,0 +1 @@
|
|||||||
|
REACT_APP_SERVER_URL=http://localhost:5002
|
13
frontend_admin/package-lock.json
generated
13
frontend_admin/package-lock.json
generated
@@ -12,6 +12,7 @@
|
|||||||
"@tanstack/react-table": "^8.21.3",
|
"@tanstack/react-table": "^8.21.3",
|
||||||
"class-variance-authority": "^0.7.1",
|
"class-variance-authority": "^0.7.1",
|
||||||
"clsx": "^2.1.1",
|
"clsx": "^2.1.1",
|
||||||
|
"dotenv": "^17.2.0",
|
||||||
"js-cookie": "^3.0.5",
|
"js-cookie": "^3.0.5",
|
||||||
"lucide-react": "^0.525.0",
|
"lucide-react": "^0.525.0",
|
||||||
"react": "^19.1.0",
|
"react": "^19.1.0",
|
||||||
@@ -2640,6 +2641,18 @@
|
|||||||
"tslib": "^2.0.3"
|
"tslib": "^2.0.3"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/dotenv": {
|
||||||
|
"version": "17.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/dotenv/-/dotenv-17.2.0.tgz",
|
||||||
|
"integrity": "sha512-Q4sgBT60gzd0BB0lSyYD3xM4YxrXA9y4uBDof1JNYGzOXrQdQ6yX+7XIAqoFOGQFOTK1D3Hts5OllpxMDZFONQ==",
|
||||||
|
"license": "BSD-2-Clause",
|
||||||
|
"engines": {
|
||||||
|
"node": ">=12"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://dotenvx.com"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/electron-to-chromium": {
|
"node_modules/electron-to-chromium": {
|
||||||
"version": "1.5.187",
|
"version": "1.5.187",
|
||||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.187.tgz",
|
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.187.tgz",
|
||||||
|
@@ -15,6 +15,7 @@
|
|||||||
"@tanstack/react-table": "^8.21.3",
|
"@tanstack/react-table": "^8.21.3",
|
||||||
"class-variance-authority": "^0.7.1",
|
"class-variance-authority": "^0.7.1",
|
||||||
"clsx": "^2.1.1",
|
"clsx": "^2.1.1",
|
||||||
|
"dotenv": "^17.2.0",
|
||||||
"js-cookie": "^3.0.5",
|
"js-cookie": "^3.0.5",
|
||||||
"lucide-react": "^0.525.0",
|
"lucide-react": "^0.525.0",
|
||||||
"react": "^19.1.0",
|
"react": "^19.1.0",
|
||||||
|
@@ -4,6 +4,7 @@ import UserTable from "./components/UserTable";
|
|||||||
import LoginCard from "./components/LoginCard";
|
import LoginCard from "./components/LoginCard";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { loadTheme } from "./utils/frontendService";
|
import { loadTheme } from "./utils/frontendService";
|
||||||
|
import { myToast } from "./utils/frontendService";
|
||||||
import "react-toastify/dist/ReactToastify.css";
|
import "react-toastify/dist/ReactToastify.css";
|
||||||
import Cookies from "js-cookie";
|
import Cookies from "js-cookie";
|
||||||
import { AuthContext } from "./utils/context";
|
import { AuthContext } from "./utils/context";
|
||||||
@@ -11,6 +12,9 @@ import { AuthContext } from "./utils/context";
|
|||||||
function App() {
|
function App() {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
loadTheme();
|
loadTheme();
|
||||||
|
if (Cookies.get("token")) {
|
||||||
|
myToast("User list updated", "success");
|
||||||
|
}
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const [isAuthenticated, setIsAuthenticated] = useState(
|
const [isAuthenticated, setIsAuthenticated] = useState(
|
||||||
|
@@ -27,7 +27,7 @@ export const logout = () => {
|
|||||||
Cookies.remove("username");
|
Cookies.remove("username");
|
||||||
Cookies.remove("token");
|
Cookies.remove("token");
|
||||||
localStorage.removeItem("users");
|
localStorage.removeItem("users");
|
||||||
myToast("Logged out successfully!", "info");
|
myToast("Logged out successfully!", "success");
|
||||||
};
|
};
|
||||||
|
|
||||||
export const deleteUser = (id: number) => {
|
export const deleteUser = (id: number) => {
|
||||||
@@ -41,9 +41,9 @@ export const deleteUser = (id: number) => {
|
|||||||
})
|
})
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
replaceUsers();
|
replaceUsers("User deleted successfully!");
|
||||||
} else {
|
} else {
|
||||||
alert("Failed to delete user");
|
myToast("Failed to delete user", "error");
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
@@ -51,7 +51,7 @@ export const deleteUser = (id: number) => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
export const replaceUsers = async () => {
|
export const replaceUsers = async (alertMessage: string) => {
|
||||||
localStorage.removeItem("users");
|
localStorage.removeItem("users");
|
||||||
await fetch("http://localhost:5002/api/getAllUsers", {
|
await fetch("http://localhost:5002/api/getAllUsers", {
|
||||||
method: "GET",
|
method: "GET",
|
||||||
@@ -62,7 +62,7 @@ export const replaceUsers = async () => {
|
|||||||
.then((res) => res.json())
|
.then((res) => res.json())
|
||||||
.then((users) => {
|
.then((users) => {
|
||||||
localStorage.setItem("users", JSON.stringify(users));
|
localStorage.setItem("users", JSON.stringify(users));
|
||||||
window.location.reload();
|
myToast(alertMessage, "success");
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -88,7 +88,7 @@ export const updateUserFunc = async (userID: number) => {
|
|||||||
|
|
||||||
if (!usernameEl || !firstNameEl || !lastNameEl || !emailEl) {
|
if (!usernameEl || !firstNameEl || !lastNameEl || !emailEl) {
|
||||||
console.error("Required form elements not found");
|
console.error("Required form elements not found");
|
||||||
alert("Form elements not found");
|
myToast("Form elements not found", "error");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -118,7 +118,7 @@ export const updateUserFunc = async (userID: number) => {
|
|||||||
|
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
console.log("User updated successfully");
|
console.log("User updated successfully");
|
||||||
replaceUsers();
|
replaceUsers("User updated successfully!");
|
||||||
} else {
|
} else {
|
||||||
const errorText = await response.text();
|
const errorText = await response.text();
|
||||||
console.error("Server error:", response.status, errorText);
|
console.error("Server error:", response.status, errorText);
|
||||||
|
Reference in New Issue
Block a user