diff --git a/backend/.env.example b/backend/.env.example index 2d519abf..2b8da908 100644 --- a/backend/.env.example +++ b/backend/.env.example @@ -1,2 +1,3 @@ MONGO_URL = "" +JWT_SECRET="" # Paste your MongoDB URL here for local testing diff --git a/frontend/src/api.js b/frontend/src/api.js new file mode 100644 index 00000000..0c19429d --- /dev/null +++ b/frontend/src/api.js @@ -0,0 +1 @@ +export const base_url = 'http://localhost:3001' \ No newline at end of file diff --git a/frontend/src/components/AllRoutes.jsx b/frontend/src/components/AllRoutes.jsx index 5703c41f..6d1b307e 100644 --- a/frontend/src/components/AllRoutes.jsx +++ b/frontend/src/components/AllRoutes.jsx @@ -5,6 +5,7 @@ import FAQs from './FAQ-feature/FAQ.jsx'; import SignInPage from './User/Login.jsx'; import SignupForm from './User/Signup.jsx'; import Page404 from './page404.jsx'; +import Dashboard from './Dashboard.jsx'; const AllRoutes = () => { return ( @@ -12,6 +13,7 @@ const AllRoutes = () => { } /> } /> + } /> } /> } /> } /> diff --git a/frontend/src/components/Dashboard.jsx b/frontend/src/components/Dashboard.jsx new file mode 100644 index 00000000..87a89ad4 --- /dev/null +++ b/frontend/src/components/Dashboard.jsx @@ -0,0 +1,191 @@ +import React, { useEffect } from 'react'; +import { Container, Row, Col, Card, Table, Button, ListGroup } from 'react-bootstrap'; +import { useState } from 'react'; + +const Dashboard = () => { + const [day,setDay] = useState(new Date().toLocaleDateString()) + const [time, setTime] = useState(new Date().toLocaleTimeString()) + useEffect(() => { + const intervalId = setInterval(() => { + setTime(new Date().toLocaleTimeString()); + }, 1000); + + // Clean up the interval on component unmount + return () => clearInterval(intervalId); + }, []); + + + return ( + + {/* Header */} + + +

Welcome back, John Doe!

+

{day} | {time}

+ +
+ + {/* Recent Orders */} + + + + + Your Recent Orders + + + + + + + + + + + + + + + + + + + + + + + + + + +
Order IDDateStatusTotal AmountActions
#0012024-10-08Shipped$500
#0022024-10-07Processing$200
+
+
+ +
+ + {/* Recommended Products */} + + + + + Recommended for You + + + + + + Product 1 + $99.99 + + + + + + + + + Product 2 + $89.99 + + + + + + + + + Product 3 + $59.99 + + + + + + + + + + + {/* Account Details */} + + + + + Your Account Details + + Email: johndoe@example.com + Phone: +1234567890 + Address: 123 Main St, New York, NY + + + + + + + + + Payment Methods + + Visa ending in 1234 + MasterCard ending in 5678 + + + + + + + + {/* Wishlist */} + + + + + Your Wishlist + + Product 1 - $99.99 + Product 2 - $89.99 + + + + + + + {/* Notifications */} + + + + + Notifications + + Order #001 has been shipped + Discount code available for your next purchase + + + + + + + {/* Support */} + + + + + Need Help? +

Contact our support team or visit our FAQ page.

+ +
+
+ +
+ + {/* Footer */} + + +

© 2024 Your eCommerce App

+ +
+
+ ); +}; + +export default Dashboard; \ No newline at end of file diff --git a/frontend/src/components/User/Login.jsx b/frontend/src/components/User/Login.jsx index 687ae410..681faee7 100644 --- a/frontend/src/components/User/Login.jsx +++ b/frontend/src/components/User/Login.jsx @@ -11,6 +11,8 @@ import { useNavigate } from "react-router-dom"; import "../../styles/Login.css"; // Importing CSS +import { base_url } from "../../api"; + const SignInPage = () => { const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); @@ -27,7 +29,7 @@ const SignInPage = () => { } try { - const response = await axios.post("http://localhost:8080/customer/login", { + const response = await axios.post(`${base_url}/api/v1/auth/login`, { email, password, }); diff --git a/frontend/src/components/User/Signup.jsx b/frontend/src/components/User/Signup.jsx index 4c83ae8a..b7ec42c2 100644 --- a/frontend/src/components/User/Signup.jsx +++ b/frontend/src/components/User/Signup.jsx @@ -10,6 +10,8 @@ import { useNavigate } from "react-router-dom"; import "../../styles/Signup.css"; // Importing CSS +import { base_url } from "../../api"; + const SignupForm = () => { const [name, setName] = useState(""); const [email, setEmail] = useState(""); @@ -43,7 +45,7 @@ const SignupForm = () => { try { console.log(name, email, password, phone); - const response = await axios.post("http://localhost:8080/customer/register", { + const response = await axios.post(`${base_url}/api/v1/auth/register`, { name, email, password, diff --git a/frontend/src/index.js b/frontend/src/index.js index 6b9bcf7f..5a736d14 100644 --- a/frontend/src/index.js +++ b/frontend/src/index.js @@ -1,6 +1,7 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; import App from './App'; +import 'bootstrap/dist/css/bootstrap.min.css'; const root = ReactDOM.createRoot(document.getElementById('root')); root.render(