34 |
6 |
11 | )
12 | }
13 |
14 | export default Loading
--------------------------------------------------------------------------------
/Client/components/ProductUi/Stars.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactStars from 'react-stars';
3 |
4 | interface StarsProps {
5 | stars: number;
6 | size?: number;
7 | }
8 |
9 | const Stars: React.FC
7 |
8 |
9 |
10 |
10 |
18 | )
19 | }
20 |
21 | export default Status
--------------------------------------------------------------------------------
/Client/public/vercel.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/Client/app/store.ts:
--------------------------------------------------------------------------------
1 |
2 | import CartWishlist from '@/features/UIUpdates/CartWishlist'
3 | import { configureStore } from '@reduxjs/toolkit'
4 | import UserAccount from '@/features/UIUpdates/UserAccount'
5 | // ...
6 |
7 | export const store = configureStore({
8 | reducer: {
9 | cartWishlist:CartWishlist,
10 | userState:UserAccount,
11 | },
12 | })
13 |
14 | // Infer the `RootState` and `AppDispatch` types from the store itself
15 | export type RootState = ReturnType
12 |
16 |
17 |
8 |
9 |
13 | );
14 | };
15 |
16 | export default ProgressBar;
--------------------------------------------------------------------------------
/Client/app/cart-checkout/page.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 | import { MenuProvider } from '@/Helpers/MenuContext'
3 | import React from 'react'
4 | import { AppProvider } from '@/Helpers/AccountDialog'
5 | import { Provider } from 'react-redux'
6 | import { store } from '@/app/store'
7 | import CartCheckout from '@/components/Checkout/CartCheckout'
8 | const page = () => {
9 | return (
10 |
10 |
11 |
12 |
7 |
13 |
8 |
12 | Signed-Out
9 |We're working hard to maintain and improve our services, let us know your experience.
10 | Back to Home Page 11 |
13 |
24 | )
25 | }
26 |
27 | export default Policy;
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2024 Harmanpreet Singh
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/Server/validators/cartCheckoutValidation.ts:
--------------------------------------------------------------------------------
1 | import { checkSchema } from 'express-validator';
2 | const userIDSchema = checkSchema({
3 | userID:{
4 | errorMessage: 'The userID must be provided',
5 | isInt:true,
6 | isLength:{options:{min:1,max:10}},
7 | notEmpty:true,
8 | isNumeric:true,
9 | trim:true
10 | }
11 | },['body','params']);
12 | const paymentCreationSchema = checkSchema({
13 | userID:{
14 | errorMessage: 'The userID must be provided',
15 | isInt:true,
16 | isLength:{options:{min:1,max:10}},
17 | notEmpty:true,
18 | isNumeric:true,
19 | trim:true
20 | },
21 | paymentid:{
22 | errorMessage: 'The paymentID must be provided',
23 | isString:true,
24 | isLength:{options:{min:1,max:255}},
25 | notEmpty:true,
26 | trim:true
27 | },
28 | paymentstatus:{
29 | errorMessage: 'The paymentStatus must be provided correctly',
30 | isString:true,
31 | isLength:{options:{min:1,max:10}},
32 | notEmpty:true,
33 | trim:true
34 | }
35 | },['body']);
36 | export {userIDSchema,paymentCreationSchema}
--------------------------------------------------------------------------------
/Client/components/Orders/NoOrders.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Link from 'next/link'
3 | import Image from 'next/image'
4 | const NoOrders = () => {
5 | return (
6 |
14 | {policyTypes.map((each,index)=>
15 |
16 | )}
17 |
18 |
19 | {policyType===policyTypes[0] &&
23 |
8 |
15 |
9 |
14 | No Products
10 |Please Purchase a Product to see your order here
11 | Back to Home Page 12 |
8 |
15 |
9 |
14 | 404
10 |Something's missing.
11 |Sorry, we can't find the order. You'll find lots to explore on the home page or try again later.
12 | Back to Homepage 13 |
8 |
15 |
9 |
14 | 404
10 |Something's missing.
11 |Sorry, we can't find that product. You'll find lots to explore on the home page or try again later.
12 | Back to Homepage 13 |
8 |
15 |
9 |
14 | No Products
10 |We're working hard to Add more products into catalog, you'll find products at other categories or Browse home page.
11 | Back to Home Page 12 |
8 |
15 |
9 |
14 | No Products
10 |We're working hard to Add more products into catalog, you'll find products at other categories or Browse home page.
11 | Back to Home Page 12 |
8 |
15 |
9 |
14 | No Products
10 |We're working hard to Add more products into catalog, you'll find products at other categories or Browse home page.
11 | Back to Home Page 12 |
7 |
14 |
8 |
13 | Sign In
9 |Please Sign-In to see your order details
10 |Sorry, we can't show the order details without Login. You'll find lots to explore on the home page without Login or Sign-In Now to see order details.
11 | Sign-In 12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 | )
21 | }
22 |
23 | export default Menubar
24 | //
25 | // onClick={()=>{setSidebar(true);setisMenu(false)}}
--------------------------------------------------------------------------------
/Client/components/CommonPage/Common.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 | import Footer from '@/components/Footer'
3 | import Menubar from '@/components/Mobile-Interface/Menubar'
4 | import Sidebar from '@/components/Mobile-Interface/Sidebar'
5 | import Navbar from '@/components/Navbar'
6 | import { MenuProvider } from '@/Helpers/MenuContext'
7 | import React from 'react'
8 | import Cart from '../ProductUi/Cart'
9 | import Favourite from '../ProductUi/Favourite'
10 | import { AppProvider } from '@/Helpers/AccountDialog'
11 | import { Provider } from 'react-redux'
12 | import { store } from '@/app/store'
13 | import Session from '../Session'
14 | interface ParentComponentProps {
15 | Component: React.ComponentType;
16 | }
17 | const Common: React.FC
21 |
22 |
23 |
32 |
33 |
34 |
30 |
40 | );
41 | };
42 |
43 | export default Product;
44 |
--------------------------------------------------------------------------------
/Client/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "e-commerce",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "dev": "next dev",
7 | "build": "next build",
8 | "start": "next start",
9 | "lint": "next lint",
10 | "devbackend": "nodemon ../Server/index.ts"
11 | },
12 | "dependencies": {
13 | "@headlessui/react": "^2.0.4",
14 | "@heroicons/react": "^2.1.3",
15 | "@rcaferati/wac": "^1.0.0",
16 | "@react-oauth/google": "^0.12.1",
17 | "@reduxjs/toolkit": "^2.2.5",
18 | "@stripe/react-stripe-js": "^2.7.3",
19 | "@stripe/stripe-js": "^4.1.0",
20 | "axios": "^1.7.2",
21 | "framer-motion": "^11.2.10",
22 | "jsonwebtoken": "^9.0.2",
23 | "next": "^14.2.5",
24 | "react": "^18",
25 | "react-awesome-slider": "^4.1.0",
26 | "react-dom": "^18",
27 | "react-otp-input": "^3.1.1",
28 | "react-redux": "^9.1.2",
29 | "react-stars": "^2.2.5",
30 | "sharp": "^0.33.4"
31 | },
32 | "devDependencies": {
33 | "@types/react": "^18",
34 | "@types/react-dom": "^18",
35 | "postcss": "^8",
36 | "tailwindcss": "^3.4.1",
37 | "ts-node": "^10.9.2",
38 | "typescript": "^5",
39 | "@types/js-cookie": "^3.0.6",
40 | "@types/jsonwebtoken": "^9.0.6",
41 | "@types/react-redux": "^7.1.33",
42 | "@types/react-stars": "^2.2.4",
43 | "prop-types": "^15.8.1",
44 | "@tailwindcss/aspect-ratio": "^0.4.2"
45 | }
46 | }
47 |
--------------------------------------------------------------------------------
/Server/validators/userOTPValidation.ts:
--------------------------------------------------------------------------------
1 | import { checkSchema } from "express-validator";
2 |
3 | const EmailSchema = checkSchema({
4 | email: {
5 | errorMessage: 'The email must be at least 5 characters',
6 | escape:true,
7 | isLength: { options: { min: 5,max:128 } },
8 | isEmail:{bail:true},
9 | matches: { options: /[@]/ },
10 | notEmpty:true,
11 | isString:true,
12 | trim:true
13 | },
14 | });
15 | const EmailPasswordOtpSchema = checkSchema({
16 | email: {
17 | errorMessage: 'The email must be at least 5 characters',
18 | escape:true,
19 | isLength: { options: { min: 5,max:128 } },
20 | isEmail:{bail:true},
21 | matches: { options: /[@]/ },
22 | notEmpty:true,
23 | isString:true,
24 | trim:true
25 | },
26 | password: {
27 | errorMessage: 'The password must be at least 8 characters',
28 | isLength: { options: { min: 8,max:32 } },
29 | escape:true,
30 | notEmpty:true,
31 | isString:true,
32 | trim:true
33 | },
34 | otp: {
35 | in: ['body'],
36 | isString:true,
37 | isLength: {
38 | options: { min: 4, max: 4 },
39 | errorMessage: 'OTP must be exactly 4 digits'
40 | },
41 | errorMessage: 'OTP must be a 4-digit integer'
42 | }
43 | });
44 |
45 | export {EmailSchema,EmailPasswordOtpSchema};
--------------------------------------------------------------------------------
/Client/app/App.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 | import React from 'react'
3 | import Navbar from '@/components/Navbar'
4 | import Trends from '@/components/Trends'
5 | import Status from '@/components/Status'
6 | import Footer from '@/components/Footer'
7 | import Details from '@/components/Details'
8 | import Tabs from '@/components/Tabs'
9 | import Menubar from '@/components/Mobile-Interface/Menubar'
10 | import { Provider } from 'react-redux'
11 | import Cart from '@/components/ProductUi/Cart'
12 | import Favourite from '@/components/ProductUi/Favourite'
13 | import { MenuProvider } from '@/Helpers/MenuContext'
14 | import Banner from '@/components/Banner'
15 | import { AppProvider } from '@/Helpers/AccountDialog'
16 | import { store } from './store'
17 | import Session from '@/components/Session'
18 | const App = () => {
19 |
20 | return (
21 | -
31 | {options.map((each, index) => (
32 |
- 33 | 34 | {each.title} 35 | 36 | 37 | ))} 38 |
30 |
40 | );
41 | };
42 |
43 | export default Dropdown;
44 |
--------------------------------------------------------------------------------
/Client/components/Trends.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { topCat } from '@/app/data';
3 |
4 | const Trends = () => {
5 | return (
6 | -
31 | {options.map((each, index) => (
32 |
- 33 | 34 | {each.title} 35 | 36 | 37 | ))} 38 |
7 |
26 | )
27 | }
28 |
29 | export default Trends
--------------------------------------------------------------------------------
/Server/index.ts:
--------------------------------------------------------------------------------
1 | import express, { Express, Request, Response } from 'express';
2 | import bodyParser from 'body-parser';
3 | import cors from 'cors';
4 | import routes from './routes';
5 | import 'dotenv/config';
6 | import helmet from 'helmet';
7 | import { connectDB } from './data/DB'; // Import the connectDB function
8 | import rateLimiterMiddleware from './middleware/rateLimit';
9 | import authenticateToken from './middleware/header_auth';
10 | const app: Express = express();
11 | app.set('trust proxy', true);
12 | const port = process.env.PORT || 3500;
13 |
14 |
15 | app.use(rateLimiterMiddleware);
16 | app.use(bodyParser.json({limit:'100kb'}));
17 | app.use(helmet());
18 | const origin_url:string = process.env.FRONTEND_SERVER_ORIGIN as string;
19 | const corsOptions = {
20 | origin: origin_url,
21 | methods: 'GET,HEAD,PUT,PATCH,POST,DELETE',
22 | credentials: true, // Enable cookies and authentication headers (if needed)
23 | };
24 | app.use(express.urlencoded({ extended: false }));
25 | app.use(cors(corsOptions));
26 | app.use(authenticateToken);
27 | app.get('/', (req: Request, res: Response) => {
28 | res.status(200).json({ message: 'Success' });
29 | });
30 | app.use('/api', routes);
31 | // Function to start the server
32 | const startServer = async () => {// Ensure the database connection is established
33 | app.listen(port, () => {
34 | console.log(`[server]: Server is running at Port ${port}`);
35 | });
36 | await connectDB();
37 | };
38 |
39 | startServer();
40 |
--------------------------------------------------------------------------------
/Client/app/api/filter.ts:
--------------------------------------------------------------------------------
1 | "use server"
2 | import axios from 'axios';
3 | import { sign } from 'jsonwebtoken';
4 | async function encrypt(key:string){
5 | const encryptedKey = await sign({},key)
6 | return encryptedKey
7 | }
8 | const url = process.env.BACKEND_URL;
9 | const authKey = process.env.AUTH_KEY as string;
10 | export async function categoryFilterHandler({minPrice,maxPrice,categoryID,minRating,categoryName}:{minPrice:number,maxPrice:number,categoryID:number,minRating:number,categoryName:string|string[]}) {
11 | const sendingKey = await encrypt(authKey);
12 | try {
13 | const response = await axios.get(`${url}/api/filter/category/${minPrice}/${maxPrice}/${categoryID}/${minRating}/${categoryName}`,{
14 | headers: { authorization:`Bearer ${sendingKey}` },
15 | });
16 | return {status:response.status,data:response.data}
17 | } catch (error) {
18 | return {status:500,error: 'Internal Server Error' }
19 | }
20 | };
21 | export async function categoryOnlyFilterHandler({categoryID,categoryName}:{categoryID:number,categoryName:string|string[]}) {
22 | const sendingKey = await encrypt(authKey);
23 | try {
24 | const response = await axios.get(`${url}/api/filter/category-only/${categoryID}/${categoryName}`,{
25 | headers: { authorization:`Bearer ${sendingKey}` },
26 | });
27 | return {status:response.status,data:response.data}
28 | } catch (error) {
29 | return {status:500,error: 'Internal Server Error' }
30 | }
31 | };
--------------------------------------------------------------------------------
/Client/app/api/search.ts:
--------------------------------------------------------------------------------
1 | "use server"
2 | import axios from 'axios';
3 | import { sign } from 'jsonwebtoken';
4 | async function encrypt(key:string){
5 | const encryptedKey = await sign({},key)
6 | return encryptedKey
7 | }
8 | export default async function searchProductHandler({productName}:{productName:string|string[]}) {
9 | const url = process.env.BACKEND_URL;
10 | const authKey = process.env.AUTH_KEY as string;
11 | const sendingKey = await encrypt(authKey);
12 | try {
13 | const response = await axios.get(`${url}/api/search/product/${productName}`,{
14 | headers: { authorization:`Bearer ${sendingKey}` },
15 | });
16 | return {status:response.status,data:response.data}
17 | } catch (error) {
18 | return {status:500,error: 'Internal Server Error' }
19 | }
20 | };
21 | export async function searchFilteredHandler({productName,minPrice,maxPrice,rating}:{productName:string|string[],minPrice:number,maxPrice:number,rating:number}) {
22 | const url = process.env.BACKEND_URL;
23 | const authKey = process.env.AUTH_KEY as string;
24 | const sendingKey = await encrypt(authKey);
25 | try {
26 | const response = await axios.get(`${url}/api/search/filtered-product/${productName}/${minPrice}/${maxPrice}/${rating}`,{
27 | headers: { authorization:`Bearer ${sendingKey}` },
28 | });
29 | return {status:response.status,data:response.data}
30 | } catch (error) {
31 | return {status:500,error: 'Internal Server Error' }
32 | }
33 | };
--------------------------------------------------------------------------------
/Client/app/api/subCategory.ts:
--------------------------------------------------------------------------------
1 | "use server"
2 | import axios from 'axios';
3 | import { sign } from 'jsonwebtoken';
4 | async function encrypt(key:string){
5 | const encryptedKey = await sign({},key)
6 | return encryptedKey
7 | }
8 | const url = process.env.BACKEND_URL;
9 | const authKey = process.env.AUTH_KEY as string;
10 | export default async function subCategoryDataHandler(mainCategory:string | string[],subCategory:string | string[]) {
11 | const sendingKey = await encrypt(authKey);
12 | try {
13 | const response = await axios.get(`${url}/api/sub-category/${mainCategory}/${subCategory}`,{
14 | headers: { authorization:`Bearer ${sendingKey}` },
15 | });
16 | return {status:response.status,data:response.data}
17 | } catch (error) {
18 | return {status:500,error: 'Internal Server Error' }
19 | }
20 | };
21 | export async function subCategoryFilteredHandler({categoryID,minPrice,maxPrice,rating}:{categoryID:number,minPrice:number,maxPrice:number,rating:number}) {
22 | const url = process.env.BACKEND_URL;
23 | const authKey = process.env.AUTH_KEY as string;
24 | const sendingKey = await encrypt(authKey);
25 | try {
26 | const response = await axios.get(`${url}/api/sub-category/filtered-product/${categoryID}/${minPrice}/${maxPrice}/${rating}`,{
27 | headers: { authorization:`Bearer ${sendingKey}` },
28 | });
29 | return {status:response.status,data:response.data}
30 | } catch (error) {
31 | return {status:500,error: 'Internal Server Error' }
32 | }
33 | };
--------------------------------------------------------------------------------
/Client/components/Login/otpTimer.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from 'react';
2 |
3 | // Define the type for the time state
4 | interface Time {
5 | minutes: number;
6 | seconds: number;
7 | }
8 |
9 | // Define the props type
10 | interface CountdownProps {
11 | onComplete: () => void;
12 | }
13 |
14 | const Countdown: React.FC
8 | {topCat.map((Cat,index)=>
9 |
25 |
10 |
23 | )}
24 |
11 |
19 |
12 | 
13 |
14 |
15 |
18 | {Cat.name}
16 | Show All 17 |
20 |
22 | ({Cat.quantity})
21 |