Skip to content

Commit

Permalink
Merge branch 'usha-madithati:main' into notification
Browse files Browse the repository at this point in the history
  • Loading branch information
Ansh101112 authored Jun 12, 2024
2 parents c7fa57b + ae4f859 commit 25309a4
Show file tree
Hide file tree
Showing 4 changed files with 115 additions and 126 deletions.
2 changes: 2 additions & 0 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import AuthRoute from "./components/AuthRoute";
import AdminD from "./Dashboards/AdminD";
import Settings from "./pages/Settings";
import AccountSettings from "./settings/AccountSettings";
import NotFoundPage from "./pages/PNF";

const App = () => {
return (
Expand All @@ -41,6 +42,7 @@ const App = () => {
</Route>
<Route path="/contact" element={<CustomerVoices />} />
<Route path="/user/review" element={<Review />} />
<Route path="*" element={<NotFoundPage></NotFoundPage>} />
</Routes>
</>
);
Expand Down
171 changes: 48 additions & 123 deletions src/Dashboards/UserD.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,35 +8,40 @@ import { Link } from "react-router-dom";
const UserD = () => {
const isLoggedIn = localStorage.getItem("isLoggedIn") === "true";
const navigate = useNavigate();
const [users, setUsers] = useState([]);
const [currentUser, setCurrentUser] = useState(null);
const [products, setProducts] = useState([]);
const [currentUser, setCurrentUser] = useState();

useEffect(() => {
const fetchData = async () => {
try {
const [userResponse, productResponse] = await Promise.all([
axios.get("https://smartserver-production.up.railway.app/users"),
axios.get("https://smartserver-production.up.railway.app/products"),
]);
setUsers(userResponse.data);
const token = localStorage.getItem("token");
const userResponse = await axios.get("https://smartserver-production.up.railway.app/users", {
headers: {
Authorization: `Bearer ${token}`,
},
});
const productResponse = await axios.get("https://smartserver-production.up.railway.app/products", {
headers: {
Authorization: `Bearer ${token}`,
},
});
setCurrentUser(userResponse.data);
setProducts(productResponse.data);
} catch (error) {
console.error("Error fetching data:", error);
}
};
const fetchCurrentUser = () => {
const user = JSON.parse(localStorage.getItem("currentUser"));
setCurrentUser(user);
};

fetchData();
fetchCurrentUser();
}, []);
if (isLoggedIn) {
fetchData();
} else {
navigate("/login");
}
}, [isLoggedIn, navigate]);

const handleLogout = () => {
try {
let confirmation = window.confirm("Are you sure want to logout?");
let confirmation = window.confirm("Are you sure you want to logout?");
if (confirmation) {
setTimeout(() => {
localStorage.setItem("isLoggedIn", false);
Expand All @@ -49,22 +54,26 @@ const UserD = () => {
}
};

if (!isLoggedIn) {
return null;
}

return (
<>
<Navbar />
<ToastContainer />

<h3 className="flex justify-center font-semibold">Happy Saving!!</h3>
{currentUser && (
<div className="flex justify-center font-semibold">Welcome!</div>
<div className="flex justify-center font-semibold">Welcome, {currentUser.name}!</div>
)}

<div className="flex h-screen w-full flex-col">
<header className="flex h-16 shrink-0 items-center justify-between border-b px-4 md:px-6">
<div className="flex items-center gap-4">
<Link
className="flex items-center gap-2 text-lg font-semibold md:text-base"
href="#"
to="#"
rel="ugc"
>
<svg
Expand All @@ -90,7 +99,7 @@ const UserD = () => {
<div className="flex flex-col gap-4">
<Link
className="flex items-center gap-2 text-lg font-semibold"
href="#"
to="#"
rel="ugc"
>
<svg
Expand Down Expand Up @@ -159,114 +168,30 @@ const UserD = () => {
</Link>
</div>
</nav>
<main className="flex flex-1 flex-col gap-4 p-4 md:gap-8 md:p-10">
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
<div
className="rounded-lg border bg-card text-card-foreground shadow-sm"
data-v0-t="card"
>
<div className="space-y-1.5 p-6 flex flex-row items-center justify-between pb-2">
<h3 className="whitespace-nowrap tracking-tight text-sm font-medium">
Total Products
</h3>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="h-6 w-6"
>
<path d="M20 21l-4-4H8l-4 4"></path>
<path d="M12 17V8"></path>
<path d="M18 14V4"></path>
<path d="M6 14V10"></path>
</svg>
</div>
<div className="p-6 pt-0 flex items-center">
<div className="text-2xl font-bold">{products.length}</div>
</div>
</div>
<div
className="rounded-lg border bg-card text-card-foreground shadow-sm"
data-v0-t="card"
>
<div className="space-y-1.5 p-6 flex flex-row items-center justify-between pb-2">
<h3 className="whitespace-nowrap tracking-tight text-sm font-medium">
Users
</h3>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="h-6 w-6"
>
<path d="M6 9l6 6 6-6"></path>
</svg>
</div>
<div className="p-6 pt-0 flex items-center">
<div className="text-2xl font-bold">{users.length}</div>
</div>
</div>
</div>
<div
className="rounded-lg border bg-card text-card-foreground shadow-sm"
data-v0-t="card"
>
<div className="space-y-1.5 p-6 flex flex-row items-center justify-between pb-2">
<h3 className="tracking-tight text-sm font-medium">
User List
</h3>
</div>
<div className="p-6 pt-0">
<ul>
{users.map((user) => (
<li key={user._id} className="mb-2">
<div className="flex justify-between">
<span>{user.name}</span>
<span>{user.email}</span>
<span>{user.phone}</span>
</div>
</li>
))}
</ul>
</div>
</div>
<div
className="rounded-lg border bg-card text-card-foreground shadow-sm"
data-v0-t="card"
>
<div className="space-y-1.5 p-6 flex flex-row items-center justify-between pb-2">
<h3 className="tracking-tight text-sm font-medium">
Product List
</h3>
<div className="flex flex-1 flex-col">
<div className="mb-4 px-4 md:px-6">
<div className="flex items-center justify-between py-6">
<h1 className="text-3xl font-bold">Products</h1>
<button
className="rounded-lg bg-blue-500 px-4 py-2 text-white hover:bg-blue-600"
onClick={handleLogout}
>
Logout
</button>
</div>
<div className="p-6 pt-0">
<ul>
{products.map((product) => (
<li key={product._id} className="mb-2">
<div className="flex justify-between">
<span>{product.product_name}</span>
<span>{product.barcode}</span>
<span>{product.mfd}</span>
<span>{product.expiry_date}</span>
</div>
</li>
))}
</ul>
<div className="flex items-center justify-between py-6">
<h2 className="text-xl">Total Products: {products.length}</h2>
</div>
<ul className="space-y-4">
{products.map((product) => (
<li key={product.id} className="rounded-lg bg-white p-4 shadow">
<div className="font-bold">{product.name}</div>
<div>{product.description}</div>
</li>
))}
</ul>
</div>
</main>
</div>
</div>
</div>
</>
Expand Down
30 changes: 27 additions & 3 deletions src/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,31 @@

/* Toggle switch styles */
input:checked ~ .dot {
transform: translateX(100%);
background-color: #4CAF50;
transform: translateX(100%);
background-color: #4caf50;
}

@layer components {
.neon-text {
color: #39ff14;
text-shadow: 0 0 5px #39ff14, 0 0 10px #39ff14, 0 0 20px #39ff14,
0 0 40px #39ff14, 0 0 80px #14bcff, 0 0 90px #39ff14, 0 0 100px #ff14d8,
0 0 150px #39ff14;
}
.tree {
display: flex;
flex-direction: column;
align-items: center;
}
.trunk {
width: 20px;
height: 60px;
}
.leaves {
width: 0;
height: 0;
border-left: 40px solid transparent;
border-right: 40px solid transparent;
border-bottom: 60px solid #39ff14;
}
}
38 changes: 38 additions & 0 deletions src/pages/PNF.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
import React from "react";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";

const NotFoundPage = () => {
return (
<>
<Navbar></Navbar>
<div className="min-h-screen flex flex-col items-center justify-center bg-gray-900 text-white">
<div className="text-center space-y-4">
<h1 className="text-9xl font-bold neon-text animate-pulse">404</h1>
<p className="text-2xl font-medium">Page Not Found</p>
<div className="flex flex-col items-center space-y-2">
<p className="text-lg">Let's save the earth and save energy!</p>
<p className="text-lg">Enjoy the greenery while you're here.</p>
</div>
</div>
<div className="mt-8 animate-bounce">
<div className="flex space-x-4">
<Tree />
<Tree />
<Tree />
</div>
</div>
</div>
<Footer></Footer>
</>
);
};

const Tree = () => (
<div className="tree">
<div className="trunk bg-brown-600"></div>
<div className="leaves bg-green-500"></div>
</div>
);

export default NotFoundPage;

0 comments on commit 25309a4

Please sign in to comment.