create-steve-rogers 1.0.0 → 1.0.2

package/apps/SIMS/frontend/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "sims-frontend",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@tailwindcss/vite": "^4.2.4",
+    "axios": "^1.15.2",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
+    "react-router-dom": "^7.14.2",
+    "tailwindcss": "^4.2.4"
+  },
+  "devDependencies": {
+    "@eslint/js": "^10.0.1",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.1",
+    "eslint": "^10.2.0",
+    "eslint-plugin-react-hooks": "^7.1.1",
+    "eslint-plugin-react-refresh": "^0.5.2",
+    "globals": "^17.5.0",
+    "vite": "^8.0.10"
+  }
+}

package/apps/SIMS/frontend/src/App.jsx

@@ -0,0 +1,112 @@
+import { useEffect, useState } from "react";
+import { Navigate, Route, Routes } from "react-router-dom";
+import AppLayout from "./components/AppLayout";
+import LoginPage from "./pages/LoginPage";
+import RegisterPage from "./pages/RegisterPage";
+import ResetPasswordPage from "./pages/ResetPasswordPage";
+import DashboardPage from "./pages/DashboardPage";
+import SparePartPage from "./pages/SparePartPage";
+import StockInPage from "./pages/StockInPage";
+import StockOutPage from "./pages/StockOutPage";
+import ReportsPage from "./pages/ReportsPage";
+import { fetchCurrentUser, logoutUser } from "./api/authApi";
+
+function ProtectedLayout({ isAuthenticated, username, onLogout }) {
+  if (!isAuthenticated) {
+    return <Navigate to="/login" replace />;
+  }
+  return <AppLayout onLogout={onLogout} username={username} />;
+}
+
+function PublicRoute({ isAuthenticated, children }) {
+  if (isAuthenticated) {
+    return <Navigate to="/dashboard" replace />;
+  }
+  return children;
+}
+
+function App() {
+  const [isAuthenticated, setIsAuthenticated] = useState(false);
+  const [username, setUsername] = useState("");
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    (async () => {
+      try {
+        const r = await fetchCurrentUser();
+        setIsAuthenticated(true);
+        setUsername(r.data.username);
+      } catch {
+        setIsAuthenticated(false);
+      } finally {
+        setLoading(false);
+      }
+    })();
+  }, []);
+
+  const handleLogout = async () => {
+    await logoutUser();
+    setIsAuthenticated(false);
+    setUsername("");
+  };
+
+  if (loading) {
+    return <div className="p-8 text-center text-slate-600">Checking session…</div>;
+  }
+
+  return (
+    <Routes>
+      <Route
+        path="/login"
+        element={
+          <PublicRoute isAuthenticated={isAuthenticated}>
+            <LoginPage
+              onLoginSuccess={(name) => {
+                setIsAuthenticated(true);
+                setUsername(name);
+              }}
+            />
+          </PublicRoute>
+        }
+      />
+      <Route
+        path="/register"
+        element={
+          <PublicRoute isAuthenticated={isAuthenticated}>
+            <RegisterPage />
+          </PublicRoute>
+        }
+      />
+      <Route
+        path="/reset-password"
+        element={
+          <PublicRoute isAuthenticated={isAuthenticated}>
+            <ResetPasswordPage />
+          </PublicRoute>
+        }
+      />
+      <Route
+        element={
+          <ProtectedLayout
+            isAuthenticated={isAuthenticated}
+            username={username}
+            onLogout={handleLogout}
+          />
+        }
+      >
+        <Route path="/dashboard" element={<DashboardPage />} />
+        <Route path="/spare-part" element={<SparePartPage />} />
+        <Route path="/stock-in" element={<StockInPage />} />
+        <Route path="/stock-out" element={<StockOutPage />} />
+        <Route path="/reports" element={<ReportsPage />} />
+        <Route path="/" element={<Navigate to="/dashboard" replace />} />
+      </Route>
+      <Route
+        path="*"
+        element={<Navigate to={isAuthenticated ? "/dashboard" : "/login"} replace />}
+      />
+    </Routes>
+  );
+}
+
+export default App;

package/apps/SIMS/frontend/src/api/authApi.js

@@ -0,0 +1,7 @@
+import api from "./client";
+
+export const registerUser = (payload) => api.post("/auth/register", payload);
+export const loginUser = (payload) => api.post("/auth/login", payload);
+export const recoverPassword = (payload) => api.post("/auth/recover", payload);
+export const logoutUser = () => api.post("/auth/logout");
+export const fetchCurrentUser = () => api.get("/auth/me");

package/apps/SIMS/frontend/src/api/client.js

@@ -0,0 +1,8 @@
+import axios from "axios";
+
+const api = axios.create({
+  baseURL: "http://localhost:5001/api",
+  withCredentials: true,
+});
+
+export default api;

package/apps/SIMS/frontend/src/api/simsReportApi.js

@@ -0,0 +1,5 @@
+import api from "./client";
+
+export const getDailyStockStatus = (date) =>
+  api.get("/reports/daily-stock-status", { params: { date } });
+export const getDailyStockOut = (date) => api.get("/reports/daily-stockout", { params: { date } });

package/apps/SIMS/frontend/src/api/sparePartsApi.js

@@ -0,0 +1,4 @@
+import api from "./client";
+
+export const getSpareParts = () => api.get("/spare-parts");
+export const createSparePart = (payload) => api.post("/spare-parts", payload);

package/apps/SIMS/frontend/src/api/stockInApi.js

@@ -0,0 +1,4 @@
+import api from "./client";
+
+export const getStockIn = () => api.get("/stock-in");
+export const createStockIn = (payload) => api.post("/stock-in", payload);

package/apps/SIMS/frontend/src/api/stockOutApi.js

@@ -0,0 +1,6 @@
+import api from "./client";
+
+export const getStockOut = () => api.get("/stock-out");
+export const createStockOut = (payload) => api.post("/stock-out", payload);
+export const updateStockOut = (id, payload) => api.put(`/stock-out/${id}`, payload);
+export const deleteStockOut = (id) => api.delete(`/stock-out/${id}`);

package/apps/SIMS/frontend/src/api/usersApi.js

@@ -0,0 +1,3 @@
+import { loginUser, registerUser, recoverPassword, fetchCurrentUser, logoutUser } from "./authApi";
+
+export { loginUser, registerUser, recoverPassword, fetchCurrentUser, logoutUser };

package/apps/SIMS/frontend/src/components/AppLayout.jsx

@@ -0,0 +1,60 @@
+import { Link, NavLink, Outlet } from "react-router-dom";
+
+function AppLayout({ onLogout, username }) {
+  const linkClass = ({ isActive }) => `app-nav-link ${isActive ? "app-nav-link-active" : ""}`;
+
+  return (
+    <div className="app-shell">
+      <aside className="app-sidebar">
+        <div className="app-brand-block">
+          <Link to="/spare-part" className="app-brand">
+            <span className="app-brand-mark">SI</span>
+            <span>
+              <span className="app-brand-name">SIMS</span>
+              <span className="app-brand-caption">Inventory console</span>
+            </span>
+          </Link>
+        </div>
+
+        <nav className="app-nav" aria-label="Main navigation">
+          <NavLink to="/dashboard" className={linkClass}>
+            <span className="app-nav-icon">00</span>
+            Dashboard
+          </NavLink>
+          <NavLink to="/spare-part" className={linkClass}>
+            <span className="app-nav-icon">01</span>
+            Spare Part
+          </NavLink>
+          <NavLink to="/stock-in" className={linkClass}>
+            <span className="app-nav-icon">02</span>
+            Stock In
+          </NavLink>
+          <NavLink to="/stock-out" className={linkClass}>
+            <span className="app-nav-icon">03</span>
+            Stock Out
+          </NavLink>
+          <NavLink to="/reports" className={linkClass}>
+            <span className="app-nav-icon">04</span>
+            Reports
+          </NavLink>
+        </nav>
+
+        <div className="app-sidebar-footer">
+          <div className="app-user">
+            <span className="app-user-label">Signed in</span>
+            <strong>{username}</strong>
+          </div>
+          <button type="button" onClick={onLogout} className="app-logout">
+            Logout
+          </button>
+        </div>
+      </aside>
+
+      <main className="app-main">
+        <Outlet />
+      </main>
+    </div>
+  );
+}
+
+export default AppLayout;