diff --git a/frontend_admin/.env b/frontend_admin/.env new file mode 100644 index 0000000..332d920 --- /dev/null +++ b/frontend_admin/.env @@ -0,0 +1 @@ +REACT_APP_SERVER_URL=http://localhost:5002 \ No newline at end of file diff --git a/frontend_admin/package-lock.json b/frontend_admin/package-lock.json index a559a16..ddb244f 100644 --- a/frontend_admin/package-lock.json +++ b/frontend_admin/package-lock.json @@ -12,6 +12,7 @@ "@tanstack/react-table": "^8.21.3", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", + "dotenv": "^17.2.0", "js-cookie": "^3.0.5", "lucide-react": "^0.525.0", "react": "^19.1.0", @@ -2640,6 +2641,18 @@ "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": { "version": "1.5.187", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.187.tgz", diff --git a/frontend_admin/package.json b/frontend_admin/package.json index 8a1f283..0a260a7 100644 --- a/frontend_admin/package.json +++ b/frontend_admin/package.json @@ -15,6 +15,7 @@ "@tanstack/react-table": "^8.21.3", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", + "dotenv": "^17.2.0", "js-cookie": "^3.0.5", "lucide-react": "^0.525.0", "react": "^19.1.0", diff --git a/frontend_admin/src/App.tsx b/frontend_admin/src/App.tsx index 55b3024..0ed556d 100644 --- a/frontend_admin/src/App.tsx +++ b/frontend_admin/src/App.tsx @@ -4,6 +4,7 @@ import { useUsers } from "./utils/useUsers"; import UserTable from "./components/UserTable"; import { useEffect } from "react"; import { loadTheme } from "./utils/frontendService"; +import { myToast } from "./utils/frontendService"; import "react-toastify/dist/ReactToastify.css"; function App() { @@ -11,6 +12,7 @@ function App() { useEffect(() => { loadTheme(); + myToast("User list updated", "success"); }, []); return ( diff --git a/frontend_admin/src/utils/userHandler.ts b/frontend_admin/src/utils/userHandler.ts index c65f173..860cde2 100644 --- a/frontend_admin/src/utils/userHandler.ts +++ b/frontend_admin/src/utils/userHandler.ts @@ -2,7 +2,7 @@ import Cookies from "js-cookie"; import { myToast } from "./frontendService"; export const loginUser = (username: string, password: string) => { - fetch("http://localhost:5002/api/login", { + fetch(`http://localhost:5002/api/login`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ username, password }), @@ -38,7 +38,7 @@ export const logout = () => { Cookies.remove("name"); Cookies.remove("token"); localStorage.removeItem("users"); - myToast("Logged out successfully!", "info"); + myToast("Logged out successfully!", "success"); }; export const deleteUser = (id: number) => { @@ -52,9 +52,9 @@ export const deleteUser = (id: number) => { }) .then((response) => { if (response.ok) { - replaceUsers(); + replaceUsers("User deleted successfully!"); } else { - alert("Failed to delete user"); + myToast("Failed to delete user", "error"); } }) .catch((error) => { @@ -62,7 +62,7 @@ export const deleteUser = (id: number) => { }); }; -export const replaceUsers = async () => { +export const replaceUsers = async (alertMessage: string) => { localStorage.removeItem("users"); await fetch("http://localhost:5002/api/getAllUsers", { method: "GET", @@ -73,7 +73,7 @@ export const replaceUsers = async () => { .then((res) => res.json()) .then((users) => { localStorage.setItem("users", JSON.stringify(users)); - window.location.reload(); + myToast(alertMessage, "success"); }); }; @@ -99,7 +99,7 @@ export const updateUserFunc = async (userID: number) => { if (!usernameEl || !firstNameEl || !lastNameEl || !emailEl) { console.error("Required form elements not found"); - alert("Form elements not found"); + myToast("Form elements not found", "error"); return; } @@ -129,7 +129,7 @@ export const updateUserFunc = async (userID: number) => { if (response.ok) { console.log("User updated successfully"); - replaceUsers(); + replaceUsers("User updated successfully!"); } else { const errorText = await response.text(); console.error("Server error:", response.status, errorText);