├── public ├── Logo.jpg ├── robots.txt ├── V_Logo.jpeg ├── admin.png ├── favicon.ico ├── twitter.png ├── youtube.png ├── AppStore.png ├── Guarantee.png ├── facebook.png ├── AdminProfile.jpg ├── ErrorNew500.jpg ├── VastraLogo.jpeg ├── VastraLogo.png ├── googlePlay.png ├── instagram-symbol.png ├── loading-waiting.gif ├── manifest.json └── index.html ├── src ├── Redux │ ├── Cart │ │ ├── Cart.type.js │ │ ├── Cart.api.js │ │ ├── Cart.action.js │ │ └── Cart.reducer.js │ ├── Wishlist │ │ ├── Wishlist.type.js │ │ ├── Wishlist.api.js │ │ ├── Wishlist.action.js │ │ └── Wishlist.reducer.js │ ├── Checkout │ │ ├── Checkout.type.js │ │ ├── Checkout.api.js │ │ ├── Checkout.action.js │ │ └── Checkout.reducer.js │ ├── Product │ │ ├── Product.type.js │ │ ├── Product.reducer.js │ │ ├── Product.api.js │ │ └── Product.action.js │ ├── store.jsx │ ├── Admin │ │ ├── Admin.type.js │ │ ├── Admin.api.js │ │ ├── Admin.reducer.js │ │ └── Admin.action.js │ └── HomeData.jsx ├── setupTests.js ├── App.js ├── App.test.js ├── Components │ ├── HomeDataCard.jsx │ ├── Navbar │ │ ├── Studio.jsx │ │ ├── Home&Living.jsx │ │ ├── Kids.jsx │ │ ├── Beauty.jsx │ │ ├── Women.jsx │ │ ├── Men.jsx │ │ └── Navbar.css │ ├── Pagination.jsx │ ├── PaymentNavbar.jsx │ ├── Footer │ │ ├── Footer.css │ │ └── Footer.jsx │ ├── WishlistCard.jsx │ ├── AllRoutes.jsx │ ├── SingleCard.jsx │ └── ProfileSection.jsx ├── Pages │ ├── storage.jsx │ ├── LoadingPage.jsx │ ├── Success.jsx │ ├── SampleBrand.jsx │ ├── Otp.jsx │ ├── Wishlist.jsx │ ├── PageNotFound.jsx │ ├── LoginOrSignUp.jsx │ ├── FullDetails.jsx │ ├── SeeFullDetails.jsx │ ├── Home.jsx │ ├── CartComponent.jsx │ └── Cart.jsx ├── index.css ├── reportWebVitals.js ├── Admin │ ├── Calendar.jsx │ ├── Tablecard.jsx │ ├── EditEmail.jsx │ ├── EditName.jsx │ ├── EditContact.jsx │ ├── EditPassword.jsx │ ├── UsersPage.jsx │ ├── AdminDashboard.jsx │ ├── UserCard.jsx │ ├── AdminProfilePage.jsx │ ├── MensPage.jsx │ ├── WomensPage.jsx │ ├── KidsPage.jsx │ └── AdminNavbar.jsx ├── App.css ├── index.js ├── Styles │ ├── Products.module.css │ ├── Home.css │ └── LoginOrSignUp.css └── logo.svg ├── DatabaseVastra ├── package.json ├── .gitignore └── server.js ├── .gitignore ├── package.json └── README.md /public/Logo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/Logo.jpg -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /public/V_Logo.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/V_Logo.jpeg -------------------------------------------------------------------------------- /public/admin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/admin.png -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /public/twitter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/twitter.png -------------------------------------------------------------------------------- /public/youtube.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/youtube.png -------------------------------------------------------------------------------- /public/AppStore.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/AppStore.png -------------------------------------------------------------------------------- /public/Guarantee.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/Guarantee.png -------------------------------------------------------------------------------- /public/facebook.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/facebook.png -------------------------------------------------------------------------------- /public/AdminProfile.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/AdminProfile.jpg -------------------------------------------------------------------------------- /public/ErrorNew500.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/ErrorNew500.jpg -------------------------------------------------------------------------------- /public/VastraLogo.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/VastraLogo.jpeg -------------------------------------------------------------------------------- /public/VastraLogo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/VastraLogo.png -------------------------------------------------------------------------------- /public/googlePlay.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/googlePlay.png -------------------------------------------------------------------------------- /public/instagram-symbol.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/instagram-symbol.png -------------------------------------------------------------------------------- /public/loading-waiting.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devendra684/Vastra-Myntra_Clone/HEAD/public/loading-waiting.gif -------------------------------------------------------------------------------- /src/Redux/Cart/Cart.type.js: -------------------------------------------------------------------------------- 1 | export const GET_CART_LOADING = "get/cart/loading" 2 | export const GET_CART_SUCCESS = "get/cart/success" 3 | export const GET_CART_ERROR = "get/cart/error" 4 | export const DELETE_CART_PRODUCT = "delete/cart/product" -------------------------------------------------------------------------------- /src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | 6 | import '@testing-library/jest-dom'; -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import './App.css'; 3 | import AllRoutes from './Components/AllRoutes'; 4 | 5 | function App() { 6 | return ( 7 |
8 | 9 |
10 | ); 11 | } 12 | 13 | export default App; -------------------------------------------------------------------------------- /src/Redux/Wishlist/Wishlist.type.js: -------------------------------------------------------------------------------- 1 | export const GET_WISHLIST_LOADING = "get/wishlist/loading" 2 | export const GET_WISHLIST_SUCCESS = "get/wishlist/success" 3 | export const GET_WISHLIST_ERROR = "get/wishlist/error" 4 | export const DELETE_PRODUCT_SUCCESS = "delete/wishlist/success" 5 | -------------------------------------------------------------------------------- /src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /src/Components/HomeDataCard.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import "../Styles/Home.css"; 3 | 4 | 5 | export const HomeDataCard = ({image}) => { 6 | // console.log(image) 7 | return ( 8 |
9 | eminem 10 |
11 | ) 12 | } 13 | -------------------------------------------------------------------------------- /src/Pages/storage.jsx: -------------------------------------------------------------------------------- 1 | export const saveData = (key, data) => { 2 | localStorage.setItem(key, JSON.stringify(data)); 3 | }; 4 | 5 | 6 | export const getData = (key) => { 7 | try { 8 | let temp = JSON.parse(localStorage.getItem(key)); 9 | return temp; 10 | } catch (error) { 11 | return undefined; 12 | } 13 | }; 14 | -------------------------------------------------------------------------------- /src/Redux/Checkout/Checkout.type.js: -------------------------------------------------------------------------------- 1 | export const GET_CHECKOUT_SUCCESS='get/Success'; 2 | export const GET_CHECKOUT_LOADING='get/Loading'; 3 | export const GET_CHECKOUT_ERROR='get/Error'; 4 | 5 | 6 | //ADD_TYPE 7 | export const ADD_CHECKOUT_PRODUCT='add/Checkout'; 8 | 9 | 10 | //DELETE_TYPE 11 | export const DELETE_CHECKOUT_PRODUCT='delete/Checkout'; -------------------------------------------------------------------------------- /src/Redux/Product/Product.type.js: -------------------------------------------------------------------------------- 1 | export const GET_PRODUCTS_LOADING = "products/get/loading" 2 | export const GET_PRODUCTS_SUCCESS = "products/get/success" 3 | export const GET_PRODUCTS_ERROR = "products/get/error" 4 | 5 | 6 | export const GET_MAIN_DATA_SUCCESS = "products/get/success_main" 7 | export const GET_FILTERED_PRODUCTS = "products/get/filteredProducts" 8 | -------------------------------------------------------------------------------- /src/Redux/Wishlist/Wishlist.api.js: -------------------------------------------------------------------------------- 1 | import axios from "axios" 2 | 3 | export const fetchWishlistAPI = async () => { 4 | let res = await axios.get(`https://vastra.onrender.com/wishlist`) 5 | return res.data 6 | } 7 | 8 | export const removeProd = async (id) => { 9 | let res = await axios.delete(`https://vastra.onrender.com/wishlist/${id}`) 10 | return res.data 11 | } 12 | -------------------------------------------------------------------------------- /DatabaseVastra/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vastra-database", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "server.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "start": "node server.js" 9 | }, 10 | "keywords": [], 11 | "author": "", 12 | "license": "ISC", 13 | "dependencies": { 14 | "json-server": "^0.17.1" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 12 | monospace; 13 | } -------------------------------------------------------------------------------- /src/Redux/Cart/Cart.api.js: -------------------------------------------------------------------------------- 1 | import axios from "axios" 2 | 3 | 4 | export const fetchCartAPI = async () => { 5 | let res = await axios.get(`https://vastra.onrender.com/cart`) 6 | //console.log(res?.data) 7 | return res.data 8 | } 9 | 10 | 11 | export const deleteCartAPI = async (id) => { 12 | let res = await axios.delete(`https://vastra.onrender.com/cart/${id}`) 13 | //console.log(res?.data) 14 | return res 15 | } -------------------------------------------------------------------------------- /src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | 3 | if (onPerfEntry && onPerfEntry instanceof Function) { 4 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 5 | getCLS(onPerfEntry); 6 | getFID(onPerfEntry); 7 | getFCP(onPerfEntry); 8 | getLCP(onPerfEntry); 9 | getTTFB(onPerfEntry); 10 | }); 11 | } 12 | }; 13 | 14 | export default reportWebVitals; -------------------------------------------------------------------------------- /DatabaseVastra/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | -------------------------------------------------------------------------------- /src/Admin/Calendar.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import Calendar from 'react-calendar'; 3 | import 'react-calendar/dist/Calendar.css'; 4 | 5 | export default function Calendars() { 6 | return ( 7 |
8 |
9 | 12 | 13 |
14 |
15 | ) 16 | } -------------------------------------------------------------------------------- /src/Pages/LoadingPage.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Image } from "@chakra-ui/react"; 2 | import React from "react"; 3 | import Navbar from "../Components/Navbar/Navbar"; 4 | const LoadingPage = () => { 5 | return
6 | 7 | 8 | 9 | loading 10 | 11 |
; 12 | }; 13 | 14 | export default LoadingPage; 15 | -------------------------------------------------------------------------------- /src/Redux/Checkout/Checkout.api.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios'; 2 | 3 | 4 | export const getCheckoutdataAPI = async () => { 5 | let res = await axios.get(`https://vastra.onrender.com/Checkout`); 6 | return res.data 7 | } 8 | 9 | export const postCheckoutdataAPI = async (product) => { 10 | let res = await axios.post(`https://vastra.onrender.com/Checkout`, product); 11 | return res.data 12 | } 13 | 14 | export const deleteCheckoutdataAPI = async (id) => { 15 | let res = await axios.delete(`https://vastra.onrender.com/Checkout/${id}`); 16 | return res.data 17 | } -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "/VastraLogo.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "/VastraLogo.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | height: 40vmin; 7 | pointer-events: none; 8 | } 9 | 10 | @media (prefers-reduced-motion: no-preference) { 11 | .App-logo { 12 | animation: App-logo-spin infinite 20s linear; 13 | } 14 | } 15 | 16 | .App-header { 17 | background-color: #282c34; 18 | min-height: 100vh; 19 | display: flex; 20 | flex-direction: column; 21 | align-items: center; 22 | justify-content: center; 23 | font-size: calc(10px + 2vmin); 24 | color: white; 25 | } 26 | 27 | .App-link { 28 | color: #61dafb; 29 | } 30 | 31 | @keyframes App-logo-spin { 32 | from { 33 | transform: rotate(0deg); 34 | } 35 | 36 | to { 37 | transform: rotate(360deg); 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /src/Pages/Success.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Button, Heading, Text } from '@chakra-ui/react'; 2 | import { CheckCircleIcon } from '@chakra-ui/icons'; 3 | import { Link } from 'react-router-dom'; 4 | import Navbar from '../Components/Navbar/Navbar'; 5 | 6 | 7 | export default function Success() { 8 | return ( 9 | <> 10 | 11 | 12 | 13 | 14 | Your order has placed 15 | 16 | 17 | Thank you for shopping 18 | 19 | 20 | 25 | 26 | 27 | 28 | ); 29 | } -------------------------------------------------------------------------------- /src/Redux/Cart/Cart.action.js: -------------------------------------------------------------------------------- 1 | import { deleteCartAPI, fetchCartAPI } from "./Cart.api" 2 | import * as types from "./Cart.type" 3 | 4 | export const fetchCartData = () => async (dispatch) => { 5 | 6 | //dispatch({type:types.GET_CART_LOADING}) 7 | try { 8 | let data = await fetchCartAPI() 9 | 10 | dispatch({ type: types.GET_CART_SUCCESS, payload: data }) 11 | // console.log(data) 12 | } catch (err) { 13 | dispatch({ type: types.GET_CART_ERROR }) 14 | } 15 | 16 | } 17 | 18 | export const deleteCartData = (id) => async (dispatch) => { 19 | 20 | try { 21 | await deleteCartAPI(id) 22 | dispatch({ type: types.DELETE_CART_PRODUCT }) 23 | dispatch(fetchCartData()); 24 | // console.log(data) 25 | } catch (err) { 26 | dispatch({ type: types.GET_CART_ERROR }) 27 | } 28 | 29 | } -------------------------------------------------------------------------------- /src/Redux/Wishlist/Wishlist.action.js: -------------------------------------------------------------------------------- 1 | import { fetchWishlistAPI, removeProd } from "./Wishlist.api" 2 | import * as types from "./Wishlist.type" 3 | 4 | export const fetchWishlistData = () => async (dispatch) => { 5 | try { 6 | let data = await fetchWishlistAPI() 7 | 8 | dispatch({ type: types.GET_WISHLIST_SUCCESS, payload: data }) 9 | // console.log(data) 10 | } catch (err) { 11 | dispatch({ type: types.GET_WISHLIST_ERROR }) 12 | } 13 | 14 | } 15 | 16 | export const removeProdData = (id) => async (dispatch) => { 17 | try { 18 | 19 | await removeProd(id) 20 | //console.log("Data:", data) 21 | 22 | dispatch({ type: types.DELETE_PRODUCT_SUCCESS }) 23 | dispatch(fetchWishlistData()) 24 | 25 | 26 | } catch (err) { 27 | dispatch({ type: types.GET_WISHLIST_ERROR }) 28 | } 29 | } -------------------------------------------------------------------------------- /src/Pages/SampleBrand.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Checkbox, Select, } from "@chakra-ui/react"; 2 | import React from "react"; 3 | 4 | const SampleBrand = ({ brands, handleCheck }) => { 5 | return ( 6 | 7 | 8 | 29 | 30 | ); 31 | }; 32 | 33 | export default SampleBrand; 34 | -------------------------------------------------------------------------------- /DatabaseVastra/server.js: -------------------------------------------------------------------------------- 1 | const PORT = process.env.PORT || 8080; 2 | const path = require("path"); 3 | const jsonServer = require("json-server"); 4 | const server = jsonServer.create(); 5 | const router = jsonServer.router(path.join(__dirname, "db.json")); 6 | const middlewares = jsonServer.defaults(); 7 | server.use(middlewares); 8 | server.use(jsonServer.bodyParser); 9 | server.use("", router); 10 | server.listen(PORT, () => 11 | console.log(`JSON Server is running on port ${PORT}`) 12 | ); 13 | 14 | //https://vastra.onrender.com/MensData 15 | //https://vastra.onrender.com/WomensData 16 | //https://vastra.onrender.com/ChildrensData 17 | //https://vastra.onrender.com/WishList 18 | //https://vastra.onrender.com/Cart 19 | //https://vastra.onrender.com/UsersList 20 | //https://vastra.onrender.com/AdminData 21 | //https://vastra.onrender.com/Checkout 22 | //https://vastra.onrender.com/CurrentUser -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom/client'; 3 | import './index.css'; 4 | import App from './App'; 5 | import reportWebVitals from './reportWebVitals'; 6 | import { ChakraProvider } from '@chakra-ui/react'; 7 | import { BrowserRouter } from 'react-router-dom'; 8 | import { Provider } from "react-redux" 9 | import { store } from './Redux/store'; 10 | 11 | 12 | const root = ReactDOM.createRoot(document.getElementById('root')); 13 | root.render( 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | ); 22 | 23 | // If you want to start measuring performance in your app, pass a function 24 | // to log results (for example: reportWebVitals(console.log)) 25 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 26 | reportWebVitals(); 27 | -------------------------------------------------------------------------------- /src/Components/Navbar/Studio.jsx: -------------------------------------------------------------------------------- 1 | export const StudioNav = () => { 2 | 3 | 4 | return ( 5 |
12 |
13 | 14 |

Your daily inspiration for everything fashion

15 |
16 | 17 |
18 | 20 |
21 |
22 | 25 |
26 |
27 | ) 28 | } 29 | -------------------------------------------------------------------------------- /src/Redux/store.jsx: -------------------------------------------------------------------------------- 1 | import { legacy_createStore, applyMiddleware, compose, combineReducers } from "redux" 2 | import thunk from "redux-thunk" 3 | import { adminReducer } from "./Admin/Admin.reducer" 4 | import { cartReducer } from "./Cart/Cart.reducer" 5 | import { checkoutReducer } from "./Checkout/Checkout.reducer" 6 | import { mensProductReducer } from "./Product/Product.reducer" 7 | import { WomensProductReducer } from "./Product/Product.reducer" 8 | import { KidsProductReducer } from "./Product/Product.reducer" 9 | import { wishlistReducer } from "./Wishlist/Wishlist.reducer" 10 | 11 | 12 | const rootReducer = combineReducers({ 13 | mens: mensProductReducer, 14 | womens: WomensProductReducer, 15 | kids: KidsProductReducer, 16 | adminManager: adminReducer, 17 | wishlist: wishlistReducer, 18 | cart: cartReducer, 19 | checkout: checkoutReducer 20 | }) 21 | 22 | const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose 23 | 24 | export const store = legacy_createStore(rootReducer, composeEnhancer(applyMiddleware(thunk))) 25 | 26 | -------------------------------------------------------------------------------- /src/Redux/Cart/Cart.reducer.js: -------------------------------------------------------------------------------- 1 | import * as types from "./Cart.type" 2 | 3 | let initialState ={ 4 | loading:false, 5 | error:false, 6 | cartData:[], 7 | } 8 | 9 | 10 | export const cartReducer = (state = initialState ,{type,payload})=>{ 11 | switch(type){ 12 | 13 | case types.GET_CART_LOADING:{ 14 | return { 15 | ...state, 16 | loading:true, 17 | error:false 18 | } 19 | } 20 | 21 | case types.GET_CART_SUCCESS:{ 22 | return { 23 | ...state, 24 | loading:false, 25 | error:false, 26 | cartData:payload 27 | } 28 | } 29 | 30 | case types.GET_CART_ERROR:{ 31 | return{ 32 | ...state, 33 | loading:false, 34 | error:true 35 | } 36 | } 37 | case types.DELETE_CART_PRODUCT:{ 38 | return{ 39 | ...state, 40 | loading:false, 41 | error:false, 42 | } 43 | } 44 | default:{ 45 | return state 46 | } 47 | } 48 | } -------------------------------------------------------------------------------- /src/Redux/Checkout/Checkout.action.js: -------------------------------------------------------------------------------- 1 | import { deleteCheckoutdataAPI, getCheckoutdataAPI, postCheckoutdataAPI } from "./Checkout.api"; 2 | import { ADD_CHECKOUT_PRODUCT, DELETE_CHECKOUT_PRODUCT, GET_CHECKOUT_ERROR, GET_CHECKOUT_LOADING, GET_CHECKOUT_SUCCESS } from "./Checkout.type" 3 | 4 | 5 | export const getCheckoutData=()=>async(dispatch)=>{ 6 | dispatch({type:GET_CHECKOUT_LOADING}) 7 | try { 8 | let data = await getCheckoutdataAPI(); 9 | dispatch({type:GET_CHECKOUT_SUCCESS,payload:data}); 10 | } catch (error) { 11 | dispatch({type:GET_CHECKOUT_ERROR}) 12 | } 13 | } 14 | 15 | export const postCheckoutData=(product)=>async(dispatch)=>{ 16 | dispatch({type:GET_CHECKOUT_LOADING}) 17 | try { 18 | await postCheckoutdataAPI(product); 19 | dispatch({type:ADD_CHECKOUT_PRODUCT}); 20 | } catch (error) { 21 | dispatch({type:GET_CHECKOUT_ERROR}) 22 | } 23 | } 24 | 25 | export const deleteCheckoutData=(id)=>async(dispatch)=>{ 26 | dispatch({type:GET_CHECKOUT_LOADING}) 27 | try { 28 | await deleteCheckoutdataAPI(id); 29 | dispatch({type:DELETE_CHECKOUT_PRODUCT}); 30 | } catch (error) { 31 | dispatch({type:GET_CHECKOUT_ERROR}) 32 | } 33 | } -------------------------------------------------------------------------------- /src/Redux/Wishlist/Wishlist.reducer.js: -------------------------------------------------------------------------------- 1 | import * as types from "./Wishlist.type" 2 | 3 | let initialState = { 4 | loading: false, 5 | error: false, 6 | wishlistData: [], 7 | } 8 | 9 | export const wishlistReducer = (state = initialState, { type, payload }) => { 10 | switch (type) { 11 | 12 | case types.GET_WISHLIST_LOADING: { 13 | return { 14 | ...state, 15 | loading: true, 16 | error: false 17 | } 18 | } 19 | 20 | case types.GET_WISHLIST_SUCCESS: { 21 | return { 22 | ...state, 23 | loading: false, 24 | error: false, 25 | wishlistData: payload 26 | } 27 | } 28 | 29 | case types.DELETE_PRODUCT_SUCCESS: { 30 | return { 31 | ...state, 32 | loading: false, 33 | error: false, 34 | } 35 | } 36 | 37 | case types.GET_WISHLIST_ERROR: { 38 | return { 39 | ...state, 40 | loading: false, 41 | error: true 42 | } 43 | } 44 | default: { 45 | return state 46 | } 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /src/Redux/Checkout/Checkout.reducer.js: -------------------------------------------------------------------------------- 1 | import { ADD_CHECKOUT_PRODUCT, DELETE_CHECKOUT_PRODUCT, GET_CHECKOUT_ERROR, GET_CHECKOUT_LOADING, GET_CHECKOUT_SUCCESS } from "./Checkout.type" 2 | 3 | const initialState = { 4 | loading: false, 5 | error: false, 6 | checkoutData: [] 7 | } 8 | 9 | export const checkoutReducer = (state = initialState, { type, payload }) => { 10 | switch (type) { 11 | case GET_CHECKOUT_LOADING: { 12 | return { 13 | ...state, 14 | loading: true, 15 | } 16 | } 17 | case GET_CHECKOUT_ERROR: { 18 | return { 19 | ...state, 20 | loading: false, 21 | error: true, 22 | } 23 | } 24 | case GET_CHECKOUT_SUCCESS: { 25 | return { 26 | ...state, 27 | loading: false, 28 | error: false, 29 | checkoutData: payload, 30 | } 31 | } 32 | case ADD_CHECKOUT_PRODUCT: { 33 | return { 34 | ...state, 35 | loading: false, 36 | error: false, 37 | } 38 | } 39 | case DELETE_CHECKOUT_PRODUCT: { 40 | return { 41 | ...state, 42 | loading: false, 43 | error: false, 44 | } 45 | } 46 | default: { 47 | return state 48 | } 49 | } 50 | } -------------------------------------------------------------------------------- /src/Admin/Tablecard.jsx: -------------------------------------------------------------------------------- 1 | import { Button, Td, Tr, Image } from "@chakra-ui/react"; 2 | import { EditIcon, DeleteIcon } from "@chakra-ui/icons"; 3 | 4 | const Tablecard = ({ 5 | id, 6 | ind, 7 | images, 8 | title, 9 | brand, 10 | discounted_price, 11 | strike_price, 12 | handleDelete, 13 | handleOpen, 14 | }) => { 15 | return ( 16 | 17 | {ind + 1} 18 | 19 | 20 | {title} 28 | 29 | {title} 30 | {brand} 31 | ₹ {discounted_price ? discounted_price : Number(1200)} 32 | ₹ {strike_price} 33 | 34 | 42 | 43 | 44 | 52 | 53 | 54 | ); 55 | }; 56 | 57 | export default Tablecard; -------------------------------------------------------------------------------- /src/Redux/Admin/Admin.type.js: -------------------------------------------------------------------------------- 1 | //GET_TYPE 2 | 3 | export const GET_PRODUCTS_LOADING='get/productsLoading'; 4 | export const GET_PRODUCTS_ERROR='get/productsError'; 5 | export const GET_MENS_SUCCESS='get/mansSuccess'; 6 | export const GET_WOMENS_SUCCESS='get/womensSuccess'; 7 | export const GET_KIDS_SUCCESS='get/kidsSuccess'; 8 | export const GET_USERSLIST_SUCCESS='get/usersList'; 9 | export const GET_ADMINDATA_SUCCESS='get/adminData'; 10 | export const GET_CURRENT_USER='get/currentUser'; 11 | 12 | 13 | //ADD_TYPE 14 | export const ADD_MENS_SUCCESS='add/mensSuccess'; 15 | export const ADD_WOMENS_SUCCESS='add/womensSuccess'; 16 | export const ADD_KIDS_SUCCESS='add/kidsSuccess'; 17 | export const ADD_ADMIN_NAME='add/adminName'; 18 | export const ADD_ADMIN_EMAIL='add/adminEmail'; 19 | export const ADD_ADMIN_CONTACT='add/adminContact'; 20 | export const ADD_ADMIN_PASSWORD='add/adminPassword'; 21 | export const ADD_USERSLIST_DATA= 'add/usersList'; 22 | export const ADD_CURRENT_USER='add/currentUser'; 23 | 24 | //DELETE-TYPE 25 | export const DELETE_PRODUCT_MENS='delete/mens'; 26 | export const DELETE_PRODUCT_WOMENS='delete/womens'; 27 | export const DELETE_PRODUCT_KIDS='delete/kids'; 28 | export const DELETE_USERSLIST_DATA='delete/usersList'; 29 | 30 | 31 | //UPDATE_TYPE 32 | export const UPDATE_PRODUCT_MENS='update/mens'; 33 | export const UPDATE_PRODUCT_WOMENS='update/womens'; 34 | export const UPDATE_PRODUCT_KIDS='update/kids'; 35 | export const UPDATE_USERSLIST_DATA='update/userslist'; 36 | export const UPDATE_CURRENT_USER='update/currentUser'; -------------------------------------------------------------------------------- /src/Styles/Products.module.css: -------------------------------------------------------------------------------- 1 | .product_container { 2 | width: 100%; 3 | } 4 | 5 | .product_count { 6 | text-align: left; 7 | } 8 | 9 | .product_main { 10 | display: flex; 11 | justify-content: space-between; 12 | /* gap: 1rem; */ 13 | /* border: 1px solid green; */ 14 | /* height: 300px; */ 15 | width: 100%; 16 | } 17 | 18 | /* filters */ 19 | .radio { 20 | padding-left: 1rem; 21 | } 22 | 23 | .filters { 24 | width: 25%; 25 | /* border: 1px solid red; */ 26 | margin: 0.3rem; 27 | } 28 | 29 | .clear { 30 | color: rgb(255, 17, 0); 31 | font-size: 0.8rem; 32 | } 33 | 34 | /* products */ 35 | .products { 36 | width: 100%; 37 | /* border: 1px solid blue; */ 38 | /* margin: 0.3rem; */ 39 | display: flex; 40 | flex-direction: column; 41 | } 42 | 43 | .productCards { 44 | /* border: 1px solid green; */ 45 | padding: 1rem; 46 | display: flex; 47 | flex-wrap: wrap; 48 | gap: 0.5rem; 49 | /* margin: auto; */ 50 | align-items: flex-start; 51 | } 52 | 53 | @media screen and (max-width: 540px) { 54 | .filter { 55 | font-size: 0.8rem; 56 | } 57 | } 58 | 59 | @media screen and (max-width: 414px) { 60 | .filter { 61 | display: none; 62 | } 63 | } 64 | 65 | @media screen and (max-width: 700px) { 66 | .products { 67 | width: 100%; 68 | /* border: 1px solid blue; */ 69 | margin: 0.3rem; 70 | } 71 | } 72 | 73 | @media screen and (max-width: 700px) {} 74 | 75 | @media screen and (max-width: 700px) {} -------------------------------------------------------------------------------- /src/Components/Pagination.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Button } from "@chakra-ui/react"; 2 | import React from "react"; 3 | //import { useDispatch } from "react-redux"; 4 | 5 | 6 | const Pagination = ({ 7 | setCurrentPage, 8 | handlePage, 9 | currentPage, 10 | totalPages, 11 | }) => { 12 | 13 | totalPages = Math.ceil(+totalPages / 10); 14 | 15 | let buttonArr = []; 16 | for (let i = 0; i < +totalPages; i++) { 17 | buttonArr.push(i + 1); 18 | } 19 | 20 | const handlePageChange = (page) => { 21 | handlePage(page); 22 | }; 23 | 24 | //console.log(currentPage ,typeof totalPages) 25 | return ( 26 |
27 | 28 | 34 | {buttonArr.map((btn, i) => ( 35 | 38 | ))} 39 | 40 | 43 | 44 |
45 | ); 46 | }; 47 | 48 | export default Pagination; 49 | -------------------------------------------------------------------------------- /src/Pages/Otp.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import OTPInput, { ResendOTP } from "otp-input-react"; 3 | import "../css/LoginOrSignUp.css"; 4 | 5 | 6 | export const Otp = () => { 7 | const [OTP, setOTP] = useState(""); 8 | console.log(OTP); 9 | 10 | useEffect(() => { 11 | if (OTP.length == 4) { 12 | handleFunc() 13 | } 14 | }, [OTP]) 15 | 16 | const handleFunc = () => { 17 | console.log("OTP Successfully") 18 | 19 | } 20 | 21 | return ( 22 |
23 |
24 | mobile 28 |
29 |
30 |

Verify With OTP

31 |
32 |
33 | 43 | console.log("Resend clicked")} 46 | /> 47 |
48 | {/*
49 |

Have trouble logging in?

50 |

Get Help

51 |
*/} 52 |
53 |
54 |
55 |
56 | ); 57 | }; 58 | -------------------------------------------------------------------------------- /src/Styles/Home.css: -------------------------------------------------------------------------------- 1 | .grandFather { 2 | /* border: 5px solid; */ 3 | margin-top: 140px; 4 | background-color: rgb(247, 244, 244); 5 | } 6 | 7 | .Delivery { 8 | width: 100%; 9 | height: 100px; 10 | margin-bottom: 0px; 11 | } 12 | 13 | .GifImg { 14 | width: 60%; 15 | height: 80px; 16 | justify-content: center; 17 | margin: auto; 18 | margin-top: -10px; 19 | border: 1px dashed rgb(194, 190, 190); 20 | border-radius: 15px; 21 | } 22 | 23 | .OmgDeals { 24 | margin: 40px 0px; 25 | /* border: 1px solid rgb(20, 20, 19); */ 26 | display: grid; 27 | grid-template-columns: repeat(8, 1fr); 28 | } 29 | 30 | .HoliDeals { 31 | margin: 20px 0px; 32 | /* border: 1px solid red; */ 33 | display: grid; 34 | grid-template-columns: repeat(4, 1fr); 35 | /* gap: 5px -1px; */ 36 | } 37 | 38 | .BrandsToBag { 39 | margin: 20px 0px; 40 | /* border: 1px solid red; */ 41 | display: grid; 42 | grid-template-columns: repeat(6, 1fr); 43 | /* gap: 5px -1px; */ 44 | } 45 | 46 | .ShopByCategory { 47 | margin: 30px 0px; 48 | /* border: 1px solid rgb(106, 0, 255); */ 49 | display: grid; 50 | grid-template-columns: repeat(6, 1fr); 51 | } 52 | 53 | .GrandBrand { 54 | margin: 30px 0px; 55 | /* border: 1px solid rgb(255, 3, 192); */ 56 | display: grid; 57 | grid-template-columns: repeat(6, 1fr); 58 | /* background-color: blue; */ 59 | } 60 | 61 | .BudgetToBuys { 62 | margin: 30px 0px; 63 | /* border: 1px solid rgb(0, 255, 26); */ 64 | display: grid; 65 | grid-template-columns: repeat(6, 1fr); 66 | } 67 | 68 | .imgh1 { 69 | text-align: left; 70 | margin: 70px; 71 | text-transform: uppercase; 72 | } 73 | 74 | .image_size { 75 | width: 100%; 76 | height: auto; 77 | } 78 | 79 | 80 | .hover :hover { 81 | cursor: pointer; 82 | } -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 17 | 18 | 27 | Vastra 28 | 29 | 30 | 31 |
32 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /src/Pages/Wishlist.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Grid, Text } from '@chakra-ui/react' 2 | import React from 'react' 3 | import { useEffect } from 'react' 4 | import { useDispatch, useSelector } from 'react-redux' 5 | import { fetchWishlistData } from '../Redux/Wishlist/Wishlist.action' 6 | import LoadingPage from './LoadingPage' 7 | import PageNotFound from './PageNotFound' 8 | import WishlistCard from '../Components/WishlistCard' 9 | import Navbar from '../Components/Navbar/Navbar' 10 | import Footer from '../Components/Footer/Footer' 11 | 12 | const Wishlist = () => { 13 | const {loading , error ,wishlistData} =useSelector(store=>store.wishlist) 14 | const dispatch = useDispatch() 15 | //console.log("wishlist:", wishlistData) 16 | 17 | useEffect(()=>{ 18 | dispatch(fetchWishlistData()) 19 | },[dispatch]) 20 | 21 | if(loading){ 22 | return <> 23 | } 24 | if(error){ 25 | return <> 26 | } 27 | return ( 28 |
29 | 30 | 31 | 32 | My WishList : - 33 | {wishlistData.length} 34 | Items 35 | 36 | 37 | 38 | 39 | 40 | 41 | { 42 | wishlistData?.map((wish)=>( 43 | 44 | )) 45 | } 46 | 47 | 48 | 49 |
50 |
51 | ) 52 | } 53 | 54 | export default Wishlist -------------------------------------------------------------------------------- /src/Components/PaymentNavbar.jsx: -------------------------------------------------------------------------------- 1 | import { Flex, Image, Box, HStack } from '@chakra-ui/react' 2 | import React from 'react' 3 | import { Link, NavLink } from 'react-router-dom'; 4 | 5 | const links = [ 6 | { path: "/bag", text: "Bag" }, 7 | { path: "/address", text: "Address" }, 8 | { path: "/payment", text: "Payment" } 9 | ] 10 | 11 | function PaymentNavbar() { 12 | const defaultStyle = { 13 | color: "darkgray", 14 | textDecoration: "none", 15 | fontSize: "15px", 16 | fontWeight: "bold" 17 | } 18 | const activeStyle = { 19 | color: "green", 20 | textDecoration: "underline", 21 | fontSize: "15px", 22 | fontWeight: "bold" 23 | } 24 | return ( 25 |
26 | 27 | 35 | 36 | 37 | logo 38 | 39 | 40 | 41 | { 42 | links.map((link) => ( 43 | 44 | { 47 | return isActive ? activeStyle : defaultStyle 48 | }} 49 | > 50 | {link.text} 51 | 52 | 53 | )) 54 | } 55 | 56 | 57 | 58 | 59 | 60 |
61 | ) 62 | } 63 | 64 | export default PaymentNavbar -------------------------------------------------------------------------------- /src/Pages/PageNotFound.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Box, 3 | // Heading, 4 | Text, Button, Link 5 | } from "@chakra-ui/react"; 6 | import { useNavigate } from "react-router-dom"; 7 | import Navbar from '../Components/Navbar/Navbar' 8 | 9 | 10 | export default function PageNotFound() { 11 | const navigate = useNavigate(); 12 | return ( 13 | <> 14 | 15 | 16 | {/* 23 | 404 24 | */} 25 | Error500 26 | 33 | We couldn't find any matches! 34 | 35 | 41 | Please check the spelling or try searching something else 42 | 43 | 48 | {" "} 49 | 65 | 66 | 67 | 68 | 69 | ); 70 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vastra", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@chakra-ui/icons": "^2.0.17", 7 | "@fortawesome/free-solid-svg-icons": "^6.3.0", 8 | "@fortawesome/react-fontawesome": "^0.2.0", 9 | "@reduxjs/toolkit": "^1.9.3", 10 | "@chakra-ui/react": "^2.5.1", 11 | "@emotion/react": "^11.10.6", 12 | "@emotion/styled": "^11.10.6", 13 | "@testing-library/jest-dom": "^5.16.5", 14 | "@testing-library/react": "^13.4.0", 15 | "@testing-library/user-event": "^13.5.0", 16 | "axios": "^1.3.3", 17 | "chart.js": "^4.2.1", 18 | "firebase": "^9.15.0", 19 | "framer-motion": "^8.5.5", 20 | "jason-server": "^3.0.0", 21 | "json-server": "^0.17.1", 22 | "otp-input-react": "^0.3.0", 23 | "react": "^18.2.0", 24 | "react-apexcharts": "^1.4.0", 25 | "react-app-store-badge": "^1.0.2", 26 | "react-calendar": "^4.0.0", 27 | "react-chartjs-2": "^5.2.0", 28 | "react-dom": "^18.2.0", 29 | "react-google-button": "^0.7.2", 30 | "react-icons": "^4.7.1", 31 | "react-redux": "^8.0.5", 32 | "react-router-dom": "^6.6.2", 33 | "react-scripts": "5.0.1", 34 | "react-simple-image-slider": "^2.4.1", 35 | "react-spinners": "^0.13.8", 36 | "react-toastify": "^9.1.1", 37 | "redux": "^4.2.0", 38 | "redux-thunk": "^2.4.2", 39 | "styled-components": "^4.1.3", 40 | "web-vitals": "^2.1.4" 41 | }, 42 | "scripts": { 43 | "server": "json-server --watch db.json --port 8080", 44 | "start": "react-scripts start", 45 | "build": "react-scripts build", 46 | "test": "react-scripts test", 47 | "eject": "react-scripts eject" 48 | }, 49 | "eslintConfig": { 50 | "extends": [ 51 | "react-app", 52 | "react-app/jest" 53 | ] 54 | }, 55 | "browserslist": { 56 | "production": [ 57 | ">0.2%", 58 | "not dead", 59 | "not op_mini all" 60 | ], 61 | "development": [ 62 | "last 1 chrome version", 63 | "last 1 firefox version", 64 | "last 1 safari version" 65 | ] 66 | } 67 | } 68 | -------------------------------------------------------------------------------- /src/Admin/EditEmail.jsx: -------------------------------------------------------------------------------- 1 | import { CheckIcon, CloseIcon, EditIcon } from "@chakra-ui/icons"; 2 | import { 3 | Button, 4 | ButtonGroup, 5 | Editable, 6 | EditablePreview, 7 | Flex, 8 | HStack, 9 | Input, 10 | } from "@chakra-ui/react"; 11 | import { useEffect, useState } from "react"; 12 | import { useDispatch, useSelector } from "react-redux"; 13 | import { getAdminData } from "../Redux/Admin/Admin.action"; 14 | 15 | export default function EditEmail({ 16 | handleEmailSubmit, 17 | email, 18 | setEmail, 19 | }) { 20 | const {adminData}=useSelector((store)=>store.adminManager); 21 | const dispatch=useDispatch(); 22 | const [hideEmail, setHideEmail] = useState(false); 23 | /* Here's a custom control */ 24 | useEffect(()=>{ 25 | dispatch(getAdminData()); 26 | },[dispatch]) 27 | const handleAddAdmin = () => { 28 | handleEmailSubmit(); 29 | setHideEmail(false); 30 | setEmail(""); 31 | }; 32 | 33 | function EditableControls() { 34 | return hideEmail ? ( 35 | 36 | 39 | 42 | 43 | ) : ( 44 | 45 | 54 | 55 | ); 56 | } 57 | 58 | return ( 59 | 66 | 67 | {/* Here is the Custom input */} 68 | 69 | setEmail(e.target.value)} 73 | /> 74 | 75 | 76 | 77 | ); 78 | } -------------------------------------------------------------------------------- /src/Admin/EditName.jsx: -------------------------------------------------------------------------------- 1 | import { CheckIcon, CloseIcon, EditIcon } from "@chakra-ui/icons"; 2 | import { 3 | Button, 4 | ButtonGroup, 5 | Editable, 6 | EditablePreview, 7 | Flex, 8 | HStack, 9 | Input, 10 | } from "@chakra-ui/react"; 11 | import { useEffect } from "react"; 12 | import { useState } from "react"; 13 | import { useDispatch, useSelector } from "react-redux"; 14 | import { getAdminData } from "../Redux/Admin/Admin.action"; 15 | 16 | export default function EditName({handleNameSubmit, name, setName }) { 17 | const {adminData}=useSelector((store)=>store.adminManager); 18 | const dispatch=useDispatch(); 19 | const [hideName, setHideName] = useState(false); 20 | /* Here's a custom control */ 21 | 22 | useEffect(()=>{ 23 | dispatch(getAdminData()); 24 | },[]) 25 | const handleAddAdmin = () => { 26 | handleNameSubmit(); 27 | setHideName(false); 28 | dispatch(getAdminData()); 29 | setName(""); 30 | 31 | }; 32 | 33 | function EditableControls() { 34 | return hideName ? ( 35 | 36 | 39 | 42 | 43 | ) : ( 44 | 45 | 54 | 55 | ); 56 | } 57 | return ( 58 | 65 | 66 | {/* Here is the Custom input */} 67 | 68 | setName(e.target.value)} 72 | /> 73 | 74 | 75 | 76 | ); 77 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # [Vestra](https://vastra-rho.vercel.app) Clone of [Myntra.com](https://www.Myntra.com/) Website 2 | 3 | # Welcome to Vestra 4 | 5 | 6 | 7 | Vestra (Myntra Clone) is a one stop shop for all your fashion and lifestyle needs. Being India's largest e-commerce store for fashion and lifestyle products, a hassle free and enjoyable shopping experience to shoppers across the country with the widest range of brands and products on its portal. 8 | 9 | # Tech Stack Used: 10 | 11 | I have used React, Chakra, JS, Html, Css to made this project. 12 | 13 | ### Snapshots of Vestra project :- 14 | 15 | - ## Home Page: Header & Carousel 16 |
17 | 18 | ![WhatsApp Image 2023-02-27 at 11 52 37 AM](https://user-images.githubusercontent.com/100137935/221490287-c50736f9-3697-4881-a070-ce74709b197f.jpeg) 19 | 20 | - ## Men Page 21 |
22 | 23 | ![WhatsApp Image 2023-02-27 at 11 53 48 AM](https://user-images.githubusercontent.com/100137935/221491477-9b20e511-5ff9-40ac-9af1-a0f5231334c6.jpeg) 24 | 25 | 26 | - ## Women Page 27 |
28 | 29 | ![WhatsApp Image 2023-02-27 at 11 53 49 AM](https://user-images.githubusercontent.com/100137935/221490593-f47193e8-86b6-40c4-bad3-e815ed5bbbb4.jpeg) 30 | 31 | - ## Login Page 32 |
33 | 34 | ![WhatsApp Image 2023-02-27 at 11 52 32 AM](https://user-images.githubusercontent.com/100137935/221491141-ba2671b8-4581-4b1a-bcde-9f49506d932b.jpeg) 35 | 36 | 37 | - ## Admin Page 38 |
39 | 40 | ![WhatsApp Image 2023-02-27 at 11 52 33 AM](https://user-images.githubusercontent.com/100137935/221491278-a84741f8-39f1-4335-ab16-f09bf9460e98.jpeg) 41 | 42 |
43 | 44 | # Collaborators (Team members):- 45 | - Devendra Singh(Team Lead) 46 | - Prince Sharma 47 | - Ravi Kumar 48 | - Ruchi Priya Kumari 49 | 50 | - ## Thank You 51 | -------------------------------------------------------------------------------- /src/Redux/HomeData.jsx: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | 3 | export const HomeData = async () => { 4 | let res = await axios.get("https://vastra.onrender.com/HomePageData"); 5 | // let res= await axios.get("http://localhost:8080/HomePageData") 6 | 7 | return res.data; 8 | }; 9 | 10 | export const slider = [ 11 | { 12 | id: 1, 13 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2023/2/14/7cec9b95-a683-473c-aca8-cc510821b1cd1676394720493-Desktop-Banner.gif", 14 | }, 15 | { 16 | id: 2, 17 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2022/7/28/84b6a214-9eb3-49eb-9f9d-72cec56ec5d71659019908592-Indian-Wear_DK--1-.jpg", 18 | }, 19 | { 20 | id: 3, 21 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2022/7/28/6107d28b-2bcb-44e6-9743-655b54550b8f1659020199598-Workwear_Desk--1-.jpg", 22 | }, 23 | { 24 | id: 4, 25 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2022/7/28/0174e4d7-448c-4746-8572-69461ad5be101659020268081-Tops---Tees_Desk.jpg", 26 | }, 27 | { 28 | id: 5, 29 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2022/7/25/b656a7f4-4688-4997-bb7c-54b78793981e1658752386588-Western-Wear_Desk.jpg", 30 | }, 31 | { 32 | id: 6, 33 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2022/7/25/179e278f-77ee-44c2-bf39-9f00b0cd08e01658752429301-Handbags_Desk.jpg", 34 | }, 35 | { 36 | id: 7, 37 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2022/7/25/9be788ff-39a4-4214-99d0-fc97505aae5a1658752545685-USPA_Desk_Banner.jpg", 38 | }, 39 | { 40 | id: 8, 41 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2022/5/31/4031994d-9092-4aa7-aea1-f52f2ae5194f1654006594976-Activewear_DK.jpg", 42 | }, 43 | { 44 | id: 9, 45 | url: "https://assets.myntassets.com/f_webp,w_980,c_limit,fl_progressive,dpr_2.0/assets/images/2022/6/27/53b4daed-cd2c-4111-86c5-14f737eceb351656325318973-Handbags_Desk.jpg", 46 | }, 47 | ]; 48 | -------------------------------------------------------------------------------- /src/Admin/EditContact.jsx: -------------------------------------------------------------------------------- 1 | import { CheckIcon, CloseIcon, EditIcon } from "@chakra-ui/icons"; 2 | import { 3 | Button, 4 | ButtonGroup, 5 | Editable, 6 | EditablePreview, 7 | Flex, 8 | HStack, 9 | Input, 10 | } from "@chakra-ui/react"; 11 | import { useEffect, useState } from "react"; 12 | import { useDispatch, useSelector } from "react-redux"; 13 | import { getAdminData } from "../Redux/Admin/Admin.action"; 14 | 15 | export default function EditContact({ 16 | handleContactSubmit, 17 | contact, 18 | setContact, 19 | }) { 20 | const {adminData}=useSelector((store)=>store.adminManager); 21 | const dispatch=useDispatch(); 22 | const [hideContact, setHideContact] = useState(false); 23 | /* Here's a custom control */ 24 | useEffect(()=>{ 25 | dispatch(getAdminData()); 26 | },[dispatch]) 27 | const handleAddAdmin = () => { 28 | handleContactSubmit(); 29 | //console.log("dev"); 30 | setHideContact(false); 31 | setContact(""); 32 | }; 33 | 34 | function EditableControls() { 35 | return hideContact ? ( 36 | 37 | 40 | 43 | 44 | ) : ( 45 | 46 | 55 | 56 | ); 57 | } 58 | 59 | return ( 60 | 67 | 68 | {/* Here is the Custom input */} 69 | 70 | setContact(e.target.value)} 74 | /> 75 | 76 | 77 | 78 | ); 79 | } -------------------------------------------------------------------------------- /src/Admin/EditPassword.jsx: -------------------------------------------------------------------------------- 1 | import { CheckIcon, CloseIcon, EditIcon } from "@chakra-ui/icons"; 2 | import { 3 | Button, 4 | ButtonGroup, 5 | Editable, 6 | EditablePreview, 7 | Flex, 8 | HStack, 9 | Input, 10 | } from "@chakra-ui/react"; 11 | import { useEffect, useState } from "react"; 12 | import { useDispatch, useSelector } from "react-redux"; 13 | import { getAdminData } from "../Redux/Admin/Admin.action"; 14 | 15 | export default function EditPassword({ 16 | handlePasswordSubmit, 17 | password, 18 | setPassword, 19 | }) { 20 | const {adminData}=useSelector((store)=>store.adminManager); 21 | const dispatch=useDispatch(); 22 | const [hidePassword, setHidePassword] = useState(false); 23 | /* Here's a custom control */ 24 | useEffect(()=>{ 25 | dispatch(getAdminData()); 26 | },[dispatch]) 27 | const handleAddAdmin = () => { 28 | handlePasswordSubmit(); 29 | //console.log("singh"); 30 | setHidePassword(false); 31 | setPassword(""); 32 | }; 33 | 34 | function EditableControls() { 35 | return hidePassword ? ( 36 | 37 | 40 | 43 | 44 | ) : ( 45 | 46 | 55 | 56 | ); 57 | } 58 | 59 | return ( 60 | 67 | 68 | {/* Here is the Custom input */} 69 | 70 | setPassword(e.target.value)} 75 | /> 76 | 77 | 78 | 79 | ); 80 | } -------------------------------------------------------------------------------- /src/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/Pages/LoginOrSignUp.jsx: -------------------------------------------------------------------------------- 1 | import { Button } from "@chakra-ui/react"; 2 | import React, { useState } from "react"; 3 | import { useNavigate } from "react-router-dom"; 4 | import Navbar from "../Components/Navbar/Navbar"; 5 | import "../Styles/LoginOrSignUp.css"; 6 | import { getData } from "./storage"; 7 | // import "../css/Home.css"; 8 | 9 | export const LoginOrSignUp = () => { 10 | const [details, setDetails] = useState("userdetails"); 11 | const [buttonLogging, setButtonLogging] = useState(false); 12 | 13 | console.log(details); 14 | const navigate = useNavigate(); 15 | 16 | const handleChange = (e) => { 17 | // value=e.target.value; 18 | setDetails(+e.target.value); 19 | }; 20 | 21 | const handleSubmit = () => { 22 | setButtonLogging(true); 23 | setTimeout(() => { 24 | console.log("submitted"); 25 | setButtonLogging(false); 26 | navigate("/fullDetails"); 27 | }, 1000); 28 | }; 29 | 30 | return ( 31 |
32 | 33 |
34 |
35 | Error 39 |
40 | 41 |
42 |

Login / Signup

43 |
44 |

+91 |

45 | 52 |
53 | 54 |
55 |

By continuing, I agree to the

56 |

Terms of Use

57 |

&

58 |

Privacy Policy

59 |
60 |
61 | 71 |
72 | 73 |
74 |

Have trouble logging in?

75 |

Get Help

76 |
77 |
78 |
79 |
80 | ); 81 | }; 82 | -------------------------------------------------------------------------------- /src/Admin/UsersPage.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Heading, HStack, Stack } from '@chakra-ui/layout'; 2 | import { Avatar, AvatarGroup } from '@chakra-ui/react'; 3 | import React from 'react' 4 | import { useEffect } from 'react'; 5 | import { useDispatch, useSelector } from 'react-redux' 6 | import AdminNavbar from './AdminNavbar'; 7 | import { deleteUsersListData, getUsersListData } from '../Redux/Admin/Admin.action'; 8 | import UserCard from './UserCard'; 9 | import Chart from "react-apexcharts"; 10 | 11 | 12 | const UsersPage = () => { 13 | const UsersListData = useSelector((store)=>store.adminManager.usersListData); 14 | const dispatch = useDispatch(); 15 | useEffect(()=>{ 16 | dispatch(getUsersListData()); 17 | },[]) 18 | 19 | const deleteUsers=(id)=>{ 20 | dispatch(deleteUsersListData(id)).then(()=>dispatch(getUsersListData())); 21 | } 22 | // dispatch(getUsersListData()); 23 | let loginUsers=0 24 | let logoutUsers=0 25 | for(let i=0;i 36 | 37 | 38 | 39 | 40 | 41 | Total Users : {UsersListData.length} 42 | 43 | 44 | 45 | {UsersListData.length!==0 && UsersListData.map((el,i)=>( 46 | el.image!==""? : 47 | ))} 48 | 49 | 50 | 51 | 52 | 53 | 66 | 67 | 68 | 69 | 70 | 71 | {UsersListData.length !== 0 && UsersListData.map((el, i) => ( 72 | 73 | ))} 74 | 75 | 76 | 77 | ) 78 | } 79 | 80 | export default UsersPage; -------------------------------------------------------------------------------- /src/Styles/LoginOrSignUp.css: -------------------------------------------------------------------------------- 1 | .Login_Master { 2 | margin: auto; 3 | margin-top: 100px; 4 | width: 500px; 5 | height: auto; 6 | box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; 7 | border-radius: 5px; 8 | } 9 | 10 | .form { 11 | margin: auto; 12 | padding: 30px; 13 | } 14 | 15 | .formh1 { 16 | text-align: left; 17 | margin-left: 3px; 18 | font-family: Assistant; 19 | font-size: 25px; 20 | font-weight: 800; 21 | margin-bottom: 24px; 22 | color: rgb(45, 44, 44); 23 | } 24 | 25 | .forminput { 26 | border: 1px solid rgb(119, 117, 117); 27 | margin-left: 10px; 28 | width: 400px; 29 | display: flex; 30 | justify-content: space-between; 31 | height: 40px; 32 | align-items: center; 33 | padding: 10px; 34 | } 35 | 36 | .forminput h1 { 37 | font-size: 20px; 38 | font-weight: 500; 39 | color: #ff3c6f; 40 | } 41 | 42 | .forminput input { 43 | width: 330px; 44 | display: flex; 45 | outline: none; 46 | font-size: 20px; 47 | padding-left: 10px; 48 | margin-left: -100px; 49 | /* color: #ff3c6f; */ 50 | } 51 | 52 | .termsAndCondition { 53 | margin-top: 30px; 54 | width: 90%; 55 | margin-left: 10px; 56 | font-size: 14px; 57 | display: flex; 58 | align-items: center; 59 | justify-content: space-between; 60 | } 61 | 62 | .termsAndCondition p { 63 | color: grey; 64 | } 65 | 66 | .termsAndCondition h1 { 67 | cursor: pointer; 68 | color: #ff3c6f; 69 | font-weight: 700; 70 | margin: 10px 0px 10px; 71 | } 72 | 73 | .buttonFather { 74 | margin: auto; 75 | width: 420px; 76 | margin: 20px 0px 0px 10px; 77 | } 78 | 79 | .buttonFather :hover { 80 | background-color: #f6b5b5; 81 | color: black; 82 | } 83 | 84 | .button { 85 | width: 100%; 86 | height: 50px; 87 | background-color: #ff3c6f; 88 | border-radius: 10px; 89 | color: white; 90 | } 91 | 92 | .OTPMaster { 93 | width: 400px; 94 | height: auto; 95 | margin: auto; 96 | display: flex; 97 | flex-direction: column; 98 | align-items: flex-start; 99 | justify-content: space-between; 100 | padding: 60px; 101 | margin-top: 30px; 102 | box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; 103 | border-radius: 5px; 104 | padding-bottom: 100px; 105 | } 106 | 107 | .OTPMaster img { 108 | width: 100px; 109 | } 110 | 111 | .OTPInput { 112 | margin-top: 20px; 113 | } 114 | 115 | .loginProblem { 116 | margin-top: 15px; 117 | width: 90%; 118 | margin-left: 2px; 119 | font-size: 14px; 120 | display: flex; 121 | align-items: center; 122 | justify-content: space-between; 123 | } 124 | 125 | .loginProblem p { 126 | color: grey; 127 | } 128 | 129 | .loginProblem h1 { 130 | cursor: pointer; 131 | color: #ff3c6f; 132 | font-weight: 700; 133 | margin: 10px 0px 10px; 134 | } 135 | 136 | .logout { 137 | width: 50%; 138 | height: 50px; 139 | background-color: #ff3c6f; 140 | border-radius: 10px; 141 | color: white; 142 | } -------------------------------------------------------------------------------- /src/Components/Footer/Footer.css: -------------------------------------------------------------------------------- 1 | .Footerbody { 2 | background-color: #fafbfc; 3 | font-size: 100%; 4 | } 5 | 6 | hr { 7 | width: 100%; 8 | font-size: 1px; 9 | margin-bottom: 2%; 10 | } 11 | 12 | .Footerclass { 13 | width: 70%; 14 | display: flex; 15 | flex-direction: row; 16 | margin-left: 14%; 17 | margin-right: 14%; 18 | padding-bottom: 5%; 19 | } 20 | 21 | .Footerclassdiv1 { 22 | width: 19%; 23 | margin-top: 3%; 24 | margin-left: 1%; 25 | cursor: pointer; 26 | text-align: left; 27 | color: rgb(100, 100, 108); 28 | /* line-height: 10px; */ 29 | } 30 | 31 | .Footerclassdiv2 { 32 | width: 35%; 33 | margin-top: 3%; 34 | margin-left: 1%; 35 | cursor: pointer; 36 | text-align: left; 37 | /* line-height: 10px */ 38 | } 39 | 40 | .Footerclassdiv2 h5{ 41 | font-size: 0.83em; 42 | font-weight: bold; 43 | } 44 | 45 | .socialIcon{ 46 | width: 25px; 47 | height: 25px; 48 | } 49 | 50 | .footericon1 { 51 | width: 50%; 52 | margin-top: 3%; 53 | margin-bottom: 3%; 54 | } 55 | 56 | .footericon2 { 57 | width: 45%; 58 | margin-left: 5px; 59 | margin-top: 3%; 60 | margin-bottom: 3%; 61 | 62 | } 63 | 64 | .colorblack { 65 | color: black; 66 | font-weight: bold; 67 | font-size: 0.83em; 68 | } 69 | 70 | .footer4 { 71 | margin-top: 10%; 72 | margin-left: 15%; 73 | width: 80%; 74 | } 75 | 76 | .footer5 { 77 | 78 | width: 70%; 79 | display: flex; 80 | justify-content: space-between; 81 | padding-bottom: 2%; 82 | margin-left: 15%; 83 | } 84 | 85 | .footer_popular { 86 | 87 | width: 70%; 88 | margin: 1%; 89 | margin-left: 15%; 90 | font-weight: 700; 91 | color: rgb(19, 19, 21); 92 | text-align: left; 93 | } 94 | 95 | .footer_popular_details { 96 | 97 | width: 70%; 98 | margin-left: 15%; 99 | color: rgb(100, 100, 108); 100 | margin-bottom: 2%; 101 | text-align: left; 102 | } 103 | 104 | .bottom { 105 | color: rgb(100, 100, 108); 106 | } 107 | 108 | .footerspan { 109 | color: rgb(71, 71, 247); 110 | font-weight: 600; 111 | cursor: pointer; 112 | } 113 | 114 | @media screen and (max-width: 922px) { 115 | .Footerclass { 116 | 117 | display: grid; 118 | grid-template-columns: repeat(2, 1fr); 119 | flex-direction: row; 120 | margin-left: 14%; 121 | margin-right: 14%; 122 | 123 | } 124 | 125 | 126 | .Footerclassdiv1 { 127 | width: 45%; 128 | line-height:13px; 129 | } 130 | 131 | .Footerclassdiv2 { 132 | width: 45%; 133 | line-height:13px; 134 | } 135 | 136 | .footer4 { 137 | margin-top: 17%; 138 | margin-left: 5%; 139 | width: 100%; 140 | } 141 | 142 | .footericon1 { 143 | width: 100%; 144 | } 145 | 146 | .footericon2 { 147 | width: 100%; 148 | margin-left: 5px; 149 | } 150 | } -------------------------------------------------------------------------------- /src/Components/WishlistCard.jsx: -------------------------------------------------------------------------------- 1 | import { CloseIcon } from "@chakra-ui/icons"; 2 | import { Box, Button, Flex, Image, Stack, Text } from "@chakra-ui/react"; 3 | import axios from "axios"; 4 | import React from "react"; 5 | import { useEffect } from "react"; 6 | import { useDispatch } from "react-redux"; 7 | import { fetchCartData } from "../Redux/Cart/Cart.action"; 8 | import { fetchWishlistData, removeProdData } from "../Redux/Wishlist/Wishlist.action"; 9 | 10 | const WishlistCard = ({ prod }) => { 11 | 12 | //console.log(prod); 13 | 14 | const { id,brand, discount, discounted_price, images, strike_price } = prod; 15 | const dispatch=useDispatch(); 16 | useEffect(()=>{ 17 | dispatch(fetchWishlistData()); 18 | },[]) 19 | 20 | const addToBag = async () => { 21 | // console.log("newItem:",props) 22 | await axios 23 | .post(`https://vastra.onrender.com/cart/`, prod) 24 | .then((res) => { 25 | alert("Added to bag Successfully...."); 26 | dispatch(fetchCartData()) 27 | dispatch(removeProdData(id)); 28 | }) 29 | .catch((err) => alert("Already Exists in Your Bag")); 30 | }; 31 | 32 | const removeFromWishlist=()=>{ 33 | dispatch(removeProdData(id)) 34 | } 35 | 36 | return ( 37 | 38 | 39 | 40 | Tilte 41 | 42 | {brand} 43 | 49 | Rs.{discounted_price} 50 | 55 | Rs.{strike_price} 56 | 57 | 58 | {discount} 59 | 60 | 61 | 62 | 79 | 80 | 81 | 90 | 91 | 92 | 93 | ); 94 | }; 95 | 96 | 97 | export default WishlistCard; 98 | -------------------------------------------------------------------------------- /src/Pages/FullDetails.jsx: -------------------------------------------------------------------------------- 1 | import { FormControl, FormLabel } from "@chakra-ui/form-control"; 2 | import { Input } from "@chakra-ui/input"; 3 | import { Button } from "@chakra-ui/react"; 4 | import React, { useState } from "react"; 5 | import { useNavigate } from "react-router-dom"; 6 | import Navbar from "../Components/Navbar/Navbar"; 7 | import "../Styles/LoginOrSignUp.css"; 8 | import { saveData } from "./storage"; 9 | 10 | const useDetails = { 11 | name: "", 12 | email: "", 13 | phone: "", 14 | password: "", 15 | status: false, 16 | }; 17 | 18 | export const FullDetails = () => { 19 | const [fulldetails, setFullDetails] = useState(useDetails); 20 | const [buttonLogging, setButtonLogging] = useState(false); 21 | const navigate = useNavigate(); 22 | 23 | const handleChange = (e) => { 24 | setFullDetails({ ...fulldetails, [e.target.name]: e.target.value }); 25 | }; 26 | console.log(fulldetails); 27 | 28 | const handleSubmit = () => { 29 | setButtonLogging(true); 30 | setTimeout(() => { 31 | console.log(fulldetails, "okay"); 32 | saveData("details", { ...fulldetails, status: true }); 33 | setButtonLogging(false); 34 | navigate("/"); 35 | }, 1000); 36 | }; 37 | 38 | return ( 39 |
40 | 41 |
42 |
43 | Error 47 |
48 | 49 |
50 |

Please Enter Your Full Details Here:

51 |
52 | 53 | Name 54 | 55 | 56 | 57 | Email 58 | 59 | 60 | 61 | Phone 62 | 63 | 64 | 65 | Password 66 | 67 | 68 |
69 |
70 | 79 |
80 | 81 |
82 |

Have trouble logging in?

83 |

Get Help

84 |
85 |
86 |
87 |
88 | ); 89 | }; 90 | -------------------------------------------------------------------------------- /src/Components/Footer/Footer.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import "./Footer.css"; 3 | 4 | const Footer = () => { 5 | const footer1 = [ 6 | { 7 | title: "ONLINE-SHOPPING", 8 | sub: [ 9 | "Men", 10 | "Women", 11 | "Kids", 12 | "Home & Living", 13 | "Beauty", 14 | "Gift Cards", 15 | "Myntra Insider", 16 | ], 17 | }, 18 | { 19 | title: "CUSTOMER POLICIES", 20 | sub: [ 21 | "Contact Us", 22 | "FAQ", 23 | "T&C", 24 | "Terms of Use", 25 | "Track Order", 26 | "Shipping", 27 | "Cancellation", 28 | "Returns", 29 | "Privacy policy", 30 | ], 31 | }, 32 | { 33 | title: "USEFUL LINKS", 34 | sub: ["Blog", "Careers", "Site Map", "Corporate Infomation", "Whitehat"], 35 | }, 36 | ]; 37 | 38 | return ( 39 |
40 |
41 |
42 | {footer1.map((item, j) => ( 43 |
44 |
{item.title}
45 | {item.sub.map((el, z) => ( 46 |

{el}

47 | ))} 48 |
49 | ))} 50 |
51 |
EXPERIENCE MYNTRA APP ON MOBILE
52 |
53 | 54 | 55 |
56 |
KEEP IN TOUCH
57 |
58 | 59 | 60 | 61 | 62 |
63 |
64 |
65 | 66 |
67 |
68 |
Popular Searches
69 |
70 | Kurta Pajama | Leather Jackets | Sherwani | Shirts | T-Shirts | 71 | Waistcoat | Photo Frames | Denim Shirts | Blazers | Mirror | Bags | 72 | Jackets | Blouse Designs | Crop Tops | Mysore Silk Saree | Kids Lehenga 73 | | Suit Design | Lehenga | Girl Dungarees | Top for Girl | Top for Girl | 74 | Lingerie | Gowns | Saree | Kids Ethnic Wear | Sweaters | Boys Games | 75 | Barbie Doll | Shoes For Men | Cricket Shoes | Lipstick | Make Up Kit | 76 | Fastrack Watches | Casual Shoes | Online Shopping | Dresses | Babydolls 77 | | Eye Makeup | Car Games | Nike Shoes | Puma | United Colors of Benetton 78 | | Fastrack | Watches | Backpacks | Men Kurtas | Titan Watches 79 |
80 |
81 |

82 | In case of any concern, Contact Us 83 |

84 |

© 2023 www.myntra.com. All rights reserved.

85 |
86 |
87 | ); 88 | }; 89 | 90 | export default Footer; 91 | -------------------------------------------------------------------------------- /src/Pages/SeeFullDetails.jsx: -------------------------------------------------------------------------------- 1 | import { Button, FormControl, FormLabel} from "@chakra-ui/react"; 2 | import React, { useEffect } from "react"; 3 | import { useState } from "react"; 4 | import { useNavigate } from "react-router-dom"; 5 | import Navbar from "../Components/Navbar/Navbar"; 6 | import { getData, saveData } from "./storage"; 7 | import "../Styles/LoginOrSignUp.css"; 8 | 9 | export const SeeFullDetails = () => { 10 | const [fulldetails, setFullDetails] = useState({}); 11 | const [buttonLogging, setButtonLogging] = useState(false); 12 | const navigate = useNavigate(); 13 | const full = getData("details") || {}; 14 | const status = full.status; 15 | // console.log(status) 16 | console.log(full); 17 | 18 | console.log(fulldetails); 19 | 20 | useEffect(() => { 21 | const getDetails = getData("details") || {}; 22 | setFullDetails(getDetails); 23 | // 24 | }, []); 25 | 26 | const handleLogout = () => { 27 | setButtonLogging(true); 28 | setTimeout(() => { 29 | console.log("hua kuchh"); 30 | setButtonLogging(false); 31 | saveData("details",{}) 32 | navigate("/"); 33 | }, 1000); 34 | }; 35 | 36 | if (!status) { 37 | return navigate("/login"); 38 | } 39 | 40 | return ( 41 |
42 |
43 | 44 |
45 |
46 | Error 50 |
51 | 52 |
53 |

Hi, Mr/Mrs :{fulldetails.name}

54 |
55 | 56 | 57 | Name: {fulldetails.name} 58 | 59 | 60 | 61 | 62 | Email: {fulldetails.email} 63 | 64 | 65 | 66 | 67 | Phone: {fulldetails.phone}{" "} 68 | 69 | 70 | 71 | 72 | Password: **********{" "} 73 | 74 | 75 |
76 |
77 | 87 |
88 | 89 |
90 |

Have you need of anything?

91 |

Get Help

92 |
93 |
94 |
95 |
96 |
97 | ); 98 | }; 99 | -------------------------------------------------------------------------------- /src/Components/AllRoutes.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Route, Routes } from "react-router"; 3 | import { useState } from "react"; 4 | import { useEffect } from "react"; 5 | import Home from "../Pages/Home"; 6 | import PageNotFound from "../Pages/PageNotFound"; 7 | import MensPage from "../Admin/MensPage"; 8 | import WomensPage from "../Admin/WomensPage"; 9 | import KidsPage from "../Admin/KidsPage"; 10 | import Product from "../Pages/Product"; 11 | import WomensProduct from "../Pages/WomensProduct"; 12 | import KidsProduct from "../Pages/KidsProduct"; 13 | import SingleProductPage from "../Pages/SingleProductPage"; 14 | import Address from "../Pages/Address"; 15 | import Wishlist from "../Pages/Wishlist"; 16 | import Cart from "../Pages/Cart"; 17 | import Payment from "../Pages/Payment"; 18 | import Success from "../Pages/Success"; 19 | import { LoginOrSignUp } from "../Pages/LoginOrSignUp"; 20 | import { FullDetails } from "../Pages/FullDetails"; 21 | import { SeeFullDetails } from "../Pages/SeeFullDetails"; 22 | import { getData } from "../Pages/storage"; 23 | import AdminDashboard from "../Admin/AdminDashboard"; 24 | import AddProductsPage from "../Admin/AddProductsPage"; 25 | import UsersPage from "../Admin/UsersPage"; 26 | import AdminProfilePage from "../Admin/AdminProfilePage"; 27 | // import { useNavigate } from "react-router-dom"; 28 | 29 | const AllRoutes = () => { 30 | 31 | const [fulldetails, setFullDetails] = useState(""); 32 | const [buttonLogging, setButtonLogging] = useState(false); 33 | // const navigate = useNavigate(); 34 | console.log(fulldetails); 35 | 36 | useEffect(() => { 37 | const getDetails = getData("details"); 38 | setFullDetails(getDetails); 39 | // 40 | }, []); 41 | 42 | 43 | return ( 44 |
45 | 46 | {/* }> */} 47 | }> 48 | }> 49 | }> 50 | }> 51 | }> 52 | }> 53 | }> 54 | } > 55 | } /> 56 | } /> 57 | } /> 58 | } > 59 | }> 60 | } > 61 | }> 62 | }> 63 | }> 64 | }> 65 | }> 66 | }> 67 | }> 68 | 69 |
70 | ); 71 | }; 72 | 73 | export default AllRoutes; 74 | -------------------------------------------------------------------------------- /src/Components/Navbar/Home&Living.jsx: -------------------------------------------------------------------------------- 1 | export const HomeLivingNav=()=>{ 2 | 3 | 4 | return( 5 |
11 |
12 |
13 |
    14 |
  • Bed Linen & Furnishing
    • 15 |
  • Bedsheets
    • 16 |
  • Bedding Sets
    • 17 |
  • Blankets, Quilts & Dohars
    • 18 |
  • Pillows & Pillow Covers
    • 19 |
  • Bed Covers
    • 20 |
21 | 22 |
    23 |
  • Flooring
    • 24 |
  • Carpets
    • 25 |
  • Floor Mats & Dhurries
    • 26 |
  • Door Mats
    • 27 |
28 |
29 |
30 |
    31 |
  • Bath
    • 32 |
  • Bath Towels
    • 33 |
  • Hand & Face Towels
    • 34 |
  • Beach Towels
    • 35 |
  • Towels Set
    • 36 |
  • Bath Rugs
    • 37 |
  • Bath Robes
    • 38 |
  • Bathroom Accessories
    • 39 |
40 | 41 |
    42 |
  • Lamps & Lighting
    • 43 |
  • Floor Lamps
    • 44 |
  • Ceiling Lamps
    • 45 |
  • Table Lamps
    • 46 |
  • Wall Lamps
    • 47 |
  • Outdoor Lamps
    • 48 |
  • String Lights
    • 49 |
50 |
51 |
52 |
    53 |
  • Home Decor
    • 54 |
  • Plants & Planters
    • 55 |
  • Aromas & Candles
    • 56 |
  • Clocks
    • 57 |
  • Mirrors
    • 58 |
  • WallDecor
    • 59 |
  • Wall Shelves
    • 60 |
  • Fountains
    • 61 |
  • Showpieces & Vases
    • 62 |
63 | 64 |
    65 |
  • Cushions & Cushion Covers
    • 66 |
67 | 68 |
    69 |
  • Curtains
    • 70 |
71 | 72 |
    73 |
  • Home Gift Sets
    • 74 |
75 |
76 |
77 |
    78 |
  • Kitchen & Table
    • 79 |
  • Dinnerware & Serveware
    • 80 |
  • Cups and Mugs
    • 81 |
  • Bakeware & Cookware
    • 82 |
  • Kitchen Storage & Tools
    • 83 |
  • Bar & Drinkware
    • 84 |
  • Table Covers & Furnishings
    • 85 |
86 | 87 |
    88 |
  • Storage
    • 89 |
  • Organisers
    • 90 |
  • Hooks & Holders
    • 91 |
92 |
93 |
99 |
    100 |
  • Brands
    • 101 |
  • Home Centre
    • 102 |
  • Spaces
    • 103 |
  • D'Decor
    • 104 |
  • Portico New York
    • 105 |
  • Pure Home & Living
    • 106 |
  • Swayam
    • 107 |
  • Raymond Home
    • 108 |
  • Maspar
    • 109 |
  • Corelle
    • 110 |
  • Trident
    • 111 |
  • Cortina
    • 112 |
  • Story@Home
    • 113 |
  • Random
    • 114 |
  • Ellementry
    • 115 |
  • ROMEE
    • 116 |
  • SEJ by Nisha Gupta
    • 117 |
118 |
119 |
120 |
121 | ) 122 | } -------------------------------------------------------------------------------- /src/Components/Navbar/Kids.jsx: -------------------------------------------------------------------------------- 1 | 2 | export const KidsNav=()=>{ 3 | 4 | return( 5 |
11 | 12 |
13 |
14 |
    15 |
  • Boys Clothing
    • 16 |
  • T-Shirts
    • 17 |
  • Shirts
    • 18 |
  • Shorts
    • 19 |
  • Jeans
    • 20 |
  • Trousers
    • 21 |
  • Clothing Sets
    • 22 |
  • Ethnic Wear
    • 23 |
  • Track Pants & Pyjamas
    • 24 |
  • Jacket, Sweater & Sweatshirts
    • 25 |
  • Party Wear
    • 26 |
  • Innerwear & Thermals
    • 27 |
  • Nightwear & Loungewear
    • 28 |
  • Value Packs
    • 29 |
30 |
31 |
32 |
    33 |
  • Girls Clothing
    • 34 |
  • Dresses
    • 35 |
  • Tops
    • 36 |
  • T-shirts
    • 37 |
  • Clothing Sets
    • 38 |
  • Lehenga choli
    • 39 |
  • Kurta Sets
    • 40 |
  • Party wear
    • 41 |
  • Dungarees & Jumpsuits
    • 42 |
  • Skirts & shorts
    • 43 |
  • Tights & Leggings
    • 44 |
  • Jeans, Trousers & Capris
    • 45 |
  • Jacket, Sweater & Sweatshirts
    • 46 |
  • Innerwear & Thermals
    • 47 |
  • Nightwear & Loungewear
    • 48 |
  • Value Packs
    • 49 |
50 |
51 |
52 |
    53 |
  • Footwear
    • 54 |
  • Casual Shoes
    • 55 |
  • Flipflops
    • 56 |
  • Sports Shoes
    • 57 |
  • Flats
    • 58 |
  • Sandals
    • 59 |
  • Heels
    • 60 |
  • School Shoes
    • 61 |
  • Socks
    • 62 |
63 | 64 |
    65 |
  • Toys
    • 66 |
  • Learning & Development
    • 67 |
  • Activity Toys
    • 68 |
  • Soft Toys
    • 69 |
  • Action Figure / Play set
    • 70 |
71 |
72 |
73 |
    74 |
  • Infants
    • 75 |
  • Bodysuits
    • 76 |
  • Rompers & Sleepsuits
    • 77 |
  • Clothing Sets
    • 78 |
  • Tshirts & Tops
    • 79 |
  • Dresses
    • 80 |
  • Bottom wear
    • 81 |
  • Winter Wear
    • 82 |
  • Innerwear & Sleepwear
    • 83 |
  • Infant Care
    • 84 |
85 | 86 |
    87 |
  • Home & Bath
    • 88 |
89 |
    90 |
  • Personal Care
    • 91 |
92 |
93 |
99 |
    100 |
  • Kids Accessories
    • 101 |
  • Bags & Backpacks
    • 102 |
  • Watches
    • 103 |
  • Jewellery & Hair accessory
    • 104 |
  • Sunglasses
    • 105 |
  • Masks & Protective
    • 106 |
  • Caps & Hats
    • 107 |
108 | 109 |
    110 |
  • Brands
    • 111 |
  • H&M
    • 112 |
  • Max Kids
    • 113 |
  • Pantaloons
    • 114 |
  • United Colors Of Benetton Kids
    • 115 | {/*
  • YK
    • */} 116 |
  • U.S. Polo Assn. Kids
    • 117 |
  • Mothercare
    • 118 |
  • HRX
    • 119 |
120 |
121 |
122 | 123 |
124 | ) 125 | } -------------------------------------------------------------------------------- /src/Components/SingleCard.jsx: -------------------------------------------------------------------------------- 1 | import { StarIcon } from "@chakra-ui/icons"; 2 | import { FaRegHeart } from "react-icons/fa"; 3 | import { 4 | Card, 5 | CardBody, 6 | Text, 7 | Image, 8 | Box, 9 | Button, 10 | Flex, 11 | Stack, 12 | } from "@chakra-ui/react"; 13 | import axios from "axios"; 14 | import { useNavigate } from "react-router-dom"; 15 | import { useDispatch } from "react-redux"; 16 | import { fetchCartData } from "../Redux/Cart/Cart.action"; 17 | function SingleCard({ ...props }) { 18 | const dispatch = useDispatch(); 19 | 20 | const navigate = useNavigate(); 21 | const { 22 | id, 23 | title, 24 | brand, 25 | images, 26 | discount, 27 | discounted_price, 28 | strike_price, 29 | rating, 30 | rating_count, 31 | } = props.prod; 32 | let prod = props.prod; 33 | 34 | const handleAddToWishlist = async () => { 35 | 36 | await axios 37 | .post(`https://vastra.onrender.com/WishList/`, prod) 38 | .then((res) => { 39 | alert("Added to Wishlist Successfully...."); 40 | dispatch(fetchCartData()); 41 | }) 42 | 43 | .catch((err) => alert("Already Exists")); 44 | 45 | }; 46 | 47 | return ( 48 | // < className={Style.cardContainer}> 49 | 53 | 54 | 55 | navigate(`/product/${id}`)}> 56 | 63 | 64 | 65 | 66 | {brand} 67 | 68 | 69 | {title} 70 | 71 | 76 | 77 | {" "} 78 | Rs.{discounted_price} 79 | 80 | 85 | Rs.{strike_price} 86 | 87 | 88 | {discount} 89 | 90 | 91 | 92 | 93 | 94 | 95 | {" "} 96 | {rating} 97 | 98 | {rating_count} 99 | 100 | 101 | 102 | 103 | 115 | 116 | 117 | 118 | 119 | ); 120 | } 121 | 122 | export default SingleCard; 123 | -------------------------------------------------------------------------------- /src/Components/Navbar/Beauty.jsx: -------------------------------------------------------------------------------- 1 | export const BeautyNav = () => { 2 | return ( 3 |
9 |
10 |
11 |
    12 |
  • Makeup
    • 13 |
  • Lipstick
    • 14 |
  • Lip Gloss
    • 15 |
  • Lip Liner
    • 16 |
  • Mascara
    • 17 |
  • Eyeliner
    • 18 |
  • Kajal
    • 19 |
  • Eyeshadow
    • 20 |
  • Foundation
    • 21 |
  • Primer
    • 22 |
  • Concealer
    • 23 |
  • Compact
    • 24 |
  • Nail Polish
    • 25 |
26 |
27 |
28 |
    29 |
  • Skincare, Bath & Body
    • 30 |
  • Face Mosturiser
    • 31 |
  • Cleanser
    • 32 |
  • Masks & Peel
    • 33 |
  • Sunscreen
    • 34 |
  • Serum
    • 35 |
  • Face Wash
    • 36 |
  • Eye Cream
    • 37 |
  • Lip Balm
    • 38 |
  • Body Lotion
    • 39 |
  • Body Wash
    • 40 |
  • Body Scrub
    • 41 |
  • Hand Cream
    • 42 |
43 | 44 |
    45 |
  • Baby Care
    • 46 |
47 | 48 |
    49 |
  • Masks
    • 50 |
51 |
52 |
53 |
    54 |
  • Haircare
    • 55 |
  • Shampoo
    • 56 |
  • Conditioner
    • 57 |
  • Hair Cream
    • 58 |
  • Hair Oil
    • 59 |
  • Hair Gel
    • 60 |
  • Hair Color
    • 61 |
  • Hair Serum
    • 62 |
  • Hair Accessory
    • 63 |
64 | 65 |
    66 |
  • Fragrances
    • 67 |
  • Perfume
    • 68 |
  • Deodorant
    • 69 |
  • Body Mist
    • 70 |
71 |
72 |
73 |
    74 |
  • Appliances
    • 75 |
  • Hair Straightener
    • 76 |
  • Hair Dryer
    • 77 |
  • Epilator
    • 78 |
79 | 80 |
    81 |
  • Men's Grooming
    • 82 |
  • Trimmers
    • 83 |
  • Beard Oil
    • 84 |
  • Hair Wax
    • 85 |
86 | 87 |
    88 |
  • Beauty Gift & Makeup Set
    • 89 |
  • Beauty Gift
    • 90 |
  • Makeup Kit
    • 91 |
92 | 93 |
    94 |
  • Premium Beauty
    • 95 |
96 | 97 |
    98 |
  • Wellness & Hygiene
    • 99 |
100 |
101 |
107 |
    108 |
  • Top Brands
    • 109 |
  • Lakme
    • 110 |
  • Maybelline
    • 111 |
  • LOreal
    • 112 |
  • Philips
    • 113 |
  • Bath & Body Works
    • 114 |
  • THE BODY SHOP
    • 115 |
  • Biotique
    • 116 |
  • Mamaearth
    • 117 |
  • MCaffeine
    • 118 |
  • Nivea
    • 119 |
  • Lotus Herbals
    • 120 |
  • LOreal Professionnel
    • 121 |
  • KAMA AYURVEDA
    • 122 |
  • M.A.C
    • 123 |
  • Forest Essentials
    • 124 |
125 |
126 |
127 |
128 | ); 129 | }; -------------------------------------------------------------------------------- /src/Components/Navbar/Women.jsx: -------------------------------------------------------------------------------- 1 | export const WomenNav = () => { 2 | return ( 3 |
9 | 10 |
11 |
12 | 13 |
    14 |
  • Indian & Fusion Wear
    • 15 |
  • Kurtas & Suits
    • 16 |
  • Kurtis, Tunics & Tops
    • 17 |
  • Ethnic Wear
    • 18 |
  • Leggings, Salwars & Churidars
    • 19 |
  • Skirts & Palazzos
    • 20 |
  • Sarees
    • 21 |
  • Dress Materials
    • 22 |
  • Lehenga Cholis
    • 23 |
  • Dupattas & Shawls
    • 24 |
  • Jackets
    • 25 |
26 | 27 |
    28 |
  • Belts, Scarves & More
    • 29 |
30 |
    31 |
  • Watches & Wearables
    • 32 |
33 |
34 |
35 |
    36 |
  • Western Wear
    • 37 |
  • Dresses
    • 38 |
  • Jumpsuits
    • 39 |
  • Tops
    • 40 |
  • Jeans
    • 41 |
  • Trousers & Capris
    • 42 |
  • Shorts & Skirts
    • 43 |
  • Shrugs
    • 44 |
  • Sweaters & Sweatshirts
    • 45 |
  • Jackets & Coats
    • 46 |
  • Blazers & Waistcoats
    • 47 |
48 | 49 |
    50 |
  • Plus Size
    • 51 |
52 |
    53 |
  • Sunglasses & Frames
    • 54 |
55 |
56 |
57 |
    58 |
  • Footwear
    • 59 |
  • Flats
    • 60 |
  • Casual Shoes
    • 61 |
  • Heels
    • 62 |
  • Boots
    • 63 |
  • Sports Shoes & Floaters
    • 64 |
65 | 66 |
    67 |
  • Sports & Active Wear
    • 68 |
  • Clothing
    • 69 |
  • Footwear
    • 70 |
  • Sports Accessories
    • 71 |
  • Sports Equipment
    • 72 |
73 |
74 |
75 |
    76 |
  • Lingerie & Sleepwear
    • 77 |
  • Bra
    • 78 |
  • Briefs
    • 79 |
  • Shapewear
    • 80 |
  • Sleepwear & Loungewear
    • 81 |
  • Swimwear
    • 82 |
  • Camisoles & Thermals
    • 83 |
84 | 85 |
    86 |
  • Beauty & Personal Care
    • 87 |
  • Makeup
    • 88 |
  • Skincare
    • 89 |
  • Premium Beauty
    • 90 |
  • Lipsticks
    • 91 |
  • Fragrances
    • 92 |
93 |
94 |
100 |
    101 |
  • Gadgets
    • 102 |
  • Smart Wearables
    • 103 |
  • Fitness Gadgets
    • 104 |
  • Headphones
    • 105 |
  • Speakers
    • 106 |
107 | 108 |
    109 |
  • Jewellery
    • 110 |
  • Fashion Jewellery
    • 111 |
  • Fine Jewellery
    • 112 |
  • Earrings
    • 113 |
114 |
    115 |
  • Backpacks
    • 116 |
117 |
    118 |
  • Handbags, Bags & Wallets
    • 119 |
120 |
    121 |
  • Luggages & Trolleys
    • 122 |
123 |
124 |
125 | 126 |
127 | ) 128 | } -------------------------------------------------------------------------------- /src/Admin/AdminDashboard.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Heading, HStack, Stack } from '@chakra-ui/layout'; 2 | import { useEffect } from 'react'; 3 | import Chart from "react-apexcharts"; 4 | import { useDispatch, useSelector } from 'react-redux'; 5 | import AdminNavbar from './AdminNavbar'; 6 | import { getKidsData, getMensData, getWomensData } from '../Redux/Admin/Admin.action'; 7 | import Calendar from './Calendar'; 8 | 9 | const AdminDashboard = () => { 10 | const {kidsData,mensData,womensData} = useSelector((store)=>store.adminManager) 11 | const dispatch = useDispatch(); 12 | 13 | useEffect(()=>{ 14 | dispatch(getKidsData()); 15 | dispatch(getMensData()); 16 | dispatch(getWomensData()); 17 | },[]) 18 | 19 | const kd = kidsData.length; 20 | const md = mensData.length; 21 | const wd = womensData.length; 22 | //console.log(kd,md,wd); 23 | 24 | return ( 25 | 26 | 27 | 28 | 36 | 37 | 38 | 65 | 66 | 67 | 68 | 70 | Total Products : {kd+md+wd} 71 | 72 | 73 | 74 | 77 | 78 | Total Mens Products: {md} 79 | 80 | 82 | Total Womens Products {wd} 83 | 84 | 86 | Total Kids Products {kd} 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | ) 96 | } 97 | 98 | export default AdminDashboard; 99 | -------------------------------------------------------------------------------- /src/Admin/UserCard.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Box, 3 | Avatar, 4 | Flex, 5 | Button, 6 | Card, 7 | CardHeader, 8 | Heading, 9 | IconButton, 10 | CardBody, 11 | CardFooter, 12 | AvatarBadge, 13 | Divider, 14 | Text, 15 | Popover, 16 | PopoverTrigger, 17 | PopoverContent, 18 | PopoverArrow, 19 | PopoverBody, 20 | Stack, 21 | } from '@chakra-ui/react'; 22 | import {AiOutlineShoppingCart,AiOutlineDelete,AiOutlineMail} from 'react-icons/ai' 23 | import { BsRecord2,BsTelephoneInbound,BsThreeDotsVertical } from 'react-icons/bs' 24 | export default function UserCard({name,email,contact,isAuth,id,deleteUsers, image,logindetails}) { 25 | 26 | //const {lastSignInTime,createdAt,creationTime,lastLoginAt} = logindetails 27 | // console.log(lastSignInTime,createdAt,creationTime,lastLoginAt); 28 | return ( 29 | 30 | 31 | 32 | 33 | {image!=="" && isAuth===true? 34 | 35 | : image==="" && isAuth===true? 36 | 37 | : image!=="" && isAuth===false? 38 | 39 | : 40 | 41 | } 42 | 43 | {name} 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 63 | 64 | 65 | 66 | 67 | 68 | Login Details 69 | 70 | Account created At 71 | No Such Details Found 72 | 73 | 74 | Last SignIn At 75 | No Such Details Found 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | button': { 95 | minW: '146px', 96 | maxW:'160px' 97 | }, 98 | }} 99 | > 100 | 103 | 106 | 109 | 110 | 111 | ); 112 | } -------------------------------------------------------------------------------- /src/Admin/AdminProfilePage.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Image, 3 | Box, 4 | Center, 5 | Stack, 6 | HStack, 7 | Button, 8 | } from "@chakra-ui/react"; 9 | import { useEffect, useState } from "react"; 10 | import { useDispatch, useSelector } from "react-redux"; 11 | import AdminNavbar from "./AdminNavbar"; 12 | import { 13 | getAdminData, 14 | updateAdminContact, 15 | updateAdminEmail, 16 | updateAdminName, 17 | } from "../Redux/Admin/Admin.action"; 18 | import EditName from "./EditName"; 19 | import EditEmail from "./EditEmail"; 20 | import EditContact from "./EditContact"; 21 | import EditPassword from "./EditPassword"; 22 | import { useNavigate } from "react-router-dom"; 23 | 24 | const AdminProfilePage = () => { 25 | const [name, setName] = useState(""); 26 | const [email, setEmail] = useState(""); 27 | const [contact, setContact] = useState(""); 28 | const [password,setPassword] = useState(""); 29 | const { adminData } = useSelector((store) => store.adminManager); 30 | const dispatch = useDispatch(); 31 | const navigate = useNavigate(); 32 | useEffect(() => { 33 | dispatch(getAdminData()); 34 | }, []); 35 | 36 | const handleNameSubmit = () => { 37 | dispatch(updateAdminName(name)).then(() => dispatch(getAdminData())); 38 | }; 39 | 40 | const handleEmailSubmit = () => { 41 | dispatch(updateAdminEmail(email)).then(() => dispatch(getAdminData())); 42 | }; 43 | 44 | const handleContactSubmit = () => { 45 | dispatch(updateAdminContact(contact)).then(() => dispatch(getAdminData())); 46 | }; 47 | 48 | const handlePasswordSubmit = () => { 49 | dispatch(updateAdminContact(contact)).then(() => dispatch(getAdminData())); 50 | }; 51 | 52 | return ( 53 | 54 | 55 | 56 |
57 | 67 |
68 | {adminData.name} 78 |
79 | 84 | 89 | 90 | 95 | 100 | 101 | 106 | 111 | 112 | 117 | 122 | 123 | 127 | 128 |
129 | 130 | 131 | ); 132 | }; 133 | 134 | export default AdminProfilePage; -------------------------------------------------------------------------------- /src/Components/Navbar/Men.jsx: -------------------------------------------------------------------------------- 1 | export const MenNav = () => { 2 | return ( 3 |
4 | 5 | 6 |
7 |
8 |
    9 |
  • Topwear
    • 10 |
  • T-Shirts
    • 11 |
  • Casual Shirts
    • 12 |
  • Formal Shirts
    • 13 |
  • Sweatshirts
    • 14 |
  • Sweaters
    • 15 |
  • Jackets
    • 16 |
  • Blazers & Coats
    • 17 |
  • Suits
    • 18 |
  • Rain Jackets
    • 19 |
20 |
    21 |
  • Indian & Festive Wear
    • 22 |
  • Kurtas & Kurta Sets
    • 23 |
  • Sherwanis
    • 24 |
  • Nehru Jackets
    • 25 |
  • Dhotis
    • 26 |
27 |
28 |
29 |
    30 |
  • Bottom Wear
    • 31 |
  • Jeans
    • 32 |
  • Casual Trousers
    • 33 |
  • Formal Trousers
    • 34 |
  • Shorts
    • 35 |
  • Track Pants & Joggers
    • 36 |
37 | 38 |
    39 |
  • Innerwear & Sleepwear
    • 40 |
  • Briefs & Trunks
    • 41 |
  • Boxers
    • 42 |
  • Vests
    • 43 |
  • Sleepwear & Loungewear
    • 44 |
  • Thermals
    • 45 |
46 |
    47 |
  • Plus Size
    • 48 |
49 |
50 |
51 |
    52 |
  • Footwear
    • 53 |
  • Casual Shoes
    • 54 |
  • Sports Shoes
    • 55 |
  • Formal Shoes
    • 56 |
  • Sneakers
    • 57 |
  • Sandals & Floaters
    • 58 |
  • Flip Flops
    • 59 |
  • Socks
    • 60 |
61 |
    62 |
  • Personal Care & Grooming
    • 63 |
  • Lotions
    • 64 |
  • Shaving kit
    • 65 |
66 |
    67 |
  • Watches
    • 68 |
  • Fastrack
    • 69 |
  • Puma
    • 70 |
  • Rado
    • 71 |
72 |
73 |
74 |
    75 |
  • Sports & Active Wear
    • 76 |
  • Sports Shoes
    • 77 |
  • Sports Sandals
    • 78 |
  • Active T-Shirts
    • 79 |
  • Track Pants & Shorts
    • 80 |
  • Tracksuits
    • 81 |
  • Jackets & Sweatshirts
    • 82 |
  • Sports Accessories
    • 83 |
  • Swimwear
    • 84 |
85 |
    86 |
  • Gadgets
    • 87 |
  • Smart Wearables
    • 88 |
  • Fitness Gadgets
    • 89 |
  • Headphones
    • 90 |
  • Speakers
    • 91 |
92 |
93 |
99 |
    100 |
  • Fashion Accessories
    • 101 |
  • Wallets
    • 102 |
  • Belts
    • 103 |
  • Perfumes & Body Mists
    • 104 |
  • Trimmers
    • 105 |
  • Deodorants
    • 106 |
  • Ties, Cufflinks & Pocket Squares
    • 107 |
  • Accessory Gift Sets
    • 108 |
  • Caps & Hats
    • 109 |
  • Mufflers, Scarves & Gloves
    • 110 |
  • Phone Cases
    • 111 |
  • Rings & Wristwear
    • 112 |
  • Helmets
    • 113 |
114 |
    115 |
  • Bags & Backpacks
    • 116 |
  • Reebok
    • 117 |
118 |
119 |
120 | 121 | 122 |
123 | ); 124 | }; -------------------------------------------------------------------------------- /src/Admin/MensPage.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Box, 3 | Button, 4 | FormControl, 5 | FormLabel, 6 | Input, 7 | Modal, 8 | ModalBody, 9 | ModalCloseButton, 10 | ModalContent, 11 | ModalFooter, 12 | ModalHeader, 13 | ModalOverlay, 14 | Table, 15 | TableContainer, 16 | Tbody, 17 | Th, 18 | Thead, 19 | Tr, 20 | useDisclosure, 21 | } from "@chakra-ui/react"; 22 | import React, { useEffect, useState } from "react"; 23 | import { useDispatch, useSelector } from "react-redux"; 24 | import AdminNavbar from "./AdminNavbar"; 25 | import { deleteMensData, getMensData, updateMensData } from "../Redux/Admin/Admin.action"; 26 | import Tablecard from "./Tablecard"; 27 | 28 | const MensPage = () => { 29 | const { isOpen, onOpen, onClose } = useDisclosure(); 30 | const [price, setPrice] = useState(''); 31 | const [StrikePrice, setStrikePrice] = useState(''); 32 | const [discount, setDiscount]=useState(''); 33 | const [id,setId]=useState(''); 34 | const MensData = useSelector((store) => store.adminManager.mensData); 35 | const dispatch = useDispatch(); 36 | 37 | useEffect(() => { 38 | dispatch(getMensData()); 39 | }, []); 40 | 41 | const handleDelete = (id) => { 42 | dispatch(deleteMensData(id)).then(()=>dispatch(getMensData())) 43 | }; 44 | 45 | const handleUpdate=()=> { 46 | dispatch(updateMensData(id, price, discount, StrikePrice)).then(()=>{ 47 | dispatch(getMensData()); 48 | onClose(); 49 | }) 50 | 51 | }; 52 | const handleOpen=(id)=>{ 53 | setId(id); 54 | onOpen(); 55 | } 56 | //console.log("Mens",MensData); 57 | return ( 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | {MensData.length !== 0 && 77 | MensData?.map((el, i) => ( 78 | 85 | ))} 86 | 87 |
Sr No.ImageTitleBrandPriceStrike PriceEditDelete
88 | 89 | 94 | 95 | 96 | Edit Product Details 97 | 98 | 99 | 100 | Price 101 | setPrice(e.target.value)} 106 | /> 107 | 108 | 109 | 110 | Discount Price 111 | setDiscount(e.target.value)} 116 | /> 117 | 118 | 119 | 120 | Strike Amount 121 | setStrikePrice(e.target.value)} 126 | /> 127 | 128 | 129 | 130 | 131 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | ); 141 | }; 142 | 143 | export default MensPage; -------------------------------------------------------------------------------- /src/Admin/WomensPage.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Box, 3 | Button, 4 | FormControl, 5 | FormLabel, 6 | Input, 7 | Modal, 8 | ModalBody, 9 | ModalCloseButton, 10 | ModalContent, 11 | ModalFooter, 12 | ModalHeader, 13 | ModalOverlay, 14 | Table, 15 | TableContainer, 16 | Tbody, 17 | Th, 18 | Thead, 19 | Tr, 20 | useDisclosure, 21 | } from "@chakra-ui/react"; 22 | import React, { useEffect, useState } from "react"; 23 | import { useDispatch, useSelector } from "react-redux"; 24 | import AdminNavbar from "./AdminNavbar"; 25 | import { deleteWomensData, getWomensData, updateWomensData } from "../Redux/Admin/Admin.action"; 26 | import Tablecard from "./Tablecard"; 27 | const WomensPage = () => { 28 | const { isOpen, onOpen, onClose } = useDisclosure(); 29 | const [price, setPrice] = useState(''); 30 | const [StrikePrice, setStrikePrice] = useState(''); 31 | const [discount, setDiscount]=useState(''); 32 | const [id,setId]=useState(''); 33 | const WomensData = useSelector((store) => store.adminManager.womensData); 34 | const dispatch = useDispatch(); 35 | 36 | useEffect(() => { 37 | dispatch(getWomensData()); 38 | }, []); 39 | 40 | const handleDelete = (id) => { 41 | dispatch(deleteWomensData(id)).then(()=>dispatch(getWomensData())); 42 | }; 43 | 44 | const handleUpdate=()=> { 45 | dispatch(updateWomensData(id, price, discount, StrikePrice)).then(()=>{ 46 | dispatch(getWomensData()); 47 | onClose(); 48 | }) 49 | 50 | }; 51 | const handleOpen=(id)=>{ 52 | setId(id); 53 | onOpen(); 54 | } 55 | 56 | //console.log("Womens",WomensData); 57 | return ( 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | {WomensData.length !== 0 && 77 | WomensData?.map((el, i) => ( 78 | 85 | ))} 86 | 87 |
Sr No.ImageTitleBrandPriceStrike PriceEditDelete
88 | 89 | 94 | 95 | 96 | Edit Product Details 97 | 98 | 99 | 100 | Price 101 | setPrice(e.target.value)} 106 | /> 107 | 108 | 109 | 110 | Discount Price 111 | setDiscount(e.target.value)} 116 | /> 117 | 118 | 119 | 120 | Strike Amount 121 | setStrikePrice(e.target.value)} 126 | /> 127 | 128 | 129 | 130 | 131 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | ); 141 | }; 142 | 143 | export default WomensPage; 144 | -------------------------------------------------------------------------------- /src/Admin/KidsPage.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Box, 3 | Button, 4 | FormControl, 5 | FormLabel, 6 | Input, 7 | Modal, 8 | ModalBody, 9 | ModalCloseButton, 10 | ModalContent, 11 | ModalFooter, 12 | ModalHeader, 13 | ModalOverlay, 14 | Table, 15 | TableContainer, 16 | Tbody, 17 | Th, 18 | Thead, 19 | Tr, 20 | useDisclosure, 21 | } from "@chakra-ui/react"; 22 | import React, { useEffect, useState } from "react"; 23 | import { useDispatch, useSelector } from "react-redux"; 24 | import AdminNavbar from "./AdminNavbar"; 25 | import { deleteKidsData, getKidsData, updateKidsData } from "../Redux/Admin/Admin.action"; 26 | import Tablecard from "./Tablecard"; 27 | 28 | 29 | const KidsPage = () => { 30 | const { isOpen, onOpen, onClose } = useDisclosure(); 31 | const [price, setPrice] = useState(''); 32 | const [StrikePrice, setStrikePrice] = useState(''); 33 | const [discount, setDiscount] = useState(''); 34 | const [id, setId] = useState(''); 35 | const KidsData = useSelector((store) => store.adminManager.kidsData); 36 | const dispatch = useDispatch(); 37 | 38 | useEffect(() => { 39 | dispatch(getKidsData()); 40 | }, []); 41 | 42 | const handleDelete = (id) => { 43 | dispatch(deleteKidsData(id)).then(() => dispatch(getKidsData())); 44 | }; 45 | 46 | const handleUpdate = () => { 47 | dispatch(updateKidsData(id, price, discount, StrikePrice)).then(() => { 48 | dispatch(getKidsData()); 49 | onClose(); 50 | }) 51 | 52 | }; 53 | const handleOpen = (id) => { 54 | setId(id) 55 | onOpen(); 56 | } 57 | 58 | return ( 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | {KidsData.length !== 0 && 83 | KidsData?.map((el, i) => ( 84 | 91 | ))} 92 | 93 |
Sr No. 71 | Image 72 | TitleBrandPriceStrike PriceEditDelete
94 | 95 | 100 | 101 | 102 | Edit Product Details 103 | 104 | 105 | 106 | Price 107 | setPrice(e.target.value)} 112 | /> 113 | 114 | 115 | 116 | Discount Price 117 | setDiscount(e.target.value)} 122 | /> 123 | 124 | 125 | 126 | Strike Amount 127 | setStrikePrice(e.target.value)} 132 | /> 133 | 134 | 135 | 136 | 137 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | ); 147 | }; 148 | 149 | export default KidsPage; -------------------------------------------------------------------------------- /src/Redux/Admin/Admin.api.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios'; 2 | //GET-API 3 | export const getAdminMensdataAPI=async()=>{ 4 | let res = await axios.get('https://vastra.onrender.com/MensData'); 5 | return res.data; 6 | } 7 | 8 | export const getAdminWomensdataAPI=async()=>{ 9 | let res = await axios.get('https://vastra.onrender.com/WomensData'); 10 | return res.data; 11 | } 12 | 13 | export const getAdminKidsdataAPI=async()=>{ 14 | let res = await axios.get('https://vastra.onrender.com/ChildData'); 15 | return res.data; 16 | } 17 | 18 | export const getUsersListAPI=async()=>{ 19 | let res = await axios.get('https://vastra.onrender.com/UsersList'); 20 | return res.data; 21 | } 22 | 23 | export const getAdminDataAPI=async()=>{ 24 | let res = await axios.get('https://vastra.onrender.com/AdminData'); 25 | return res.data; 26 | } 27 | 28 | export const getCurrentUserAPI=async()=>{ 29 | let res = await axios.get(`https://vastra.onrender.com/CurrentUser`); 30 | return res.data; 31 | } 32 | 33 | //POST-API 34 | export const postAdminMensdataAPI=async(mensProduct)=>{ 35 | let res = await axios.post('https://vastra.onrender.com/MensData',mensProduct); 36 | return res.data; 37 | } 38 | 39 | export const postAdminWomensdataAPI=async(womensProduct)=>{ 40 | let res = await axios.post('https://vastra.onrender.com/WomensData',womensProduct); 41 | return res.data; 42 | } 43 | 44 | export const postAdminKidsdataAPI=async(kidsProduct)=>{ 45 | let res = await axios.post('https://vastra.onrender.com/ChildrensData',kidsProduct); 46 | return res.data; 47 | } 48 | 49 | export const postUsersListAPI=async(User)=>{ 50 | let res = await axios.post(`https://vastra.onrender.com/UsersList`,User); 51 | return res.data; 52 | } 53 | 54 | export const postCurrentUserAPI=async(currentUser)=>{ 55 | let res = await axios.post(`https://vastra.onrender.com/CurrentUser`,currentUser); 56 | return res.data; 57 | } 58 | 59 | //UPDATE-FUNCTION 60 | export const updateAdminMensdataAPI=async(id,newPrice,newDiscount,newSrikePrice)=>{ 61 | let res = await axios.patch(`https://vastra.onrender.com/MensData/${id}`,{ 62 | discounted_price:newPrice, 63 | discount:newDiscount, 64 | strike_price:newSrikePrice 65 | }); 66 | return res.data; 67 | } 68 | 69 | export const updateAdminWomensdataAPI=async(id,newPrice,newDiscount,newSrikePrice)=>{ 70 | let res = await axios.patch(`https://vastra.onrender.com/WomensData/${id}`,{ 71 | discounted_price:newPrice, 72 | discount:newDiscount, 73 | strike_price:newSrikePrice 74 | }); 75 | return res.data; 76 | } 77 | 78 | export const updateAdminKidsdataAPI=async(id,newPrice,newDiscount,newSrikePrice)=>{ 79 | let res = await axios.patch(`https://vastra.onrender.com/ChildrensData/${id}`,{ 80 | discounted_price:newPrice, 81 | discount:newDiscount, 82 | strike_price:newSrikePrice 83 | }); 84 | return res.data; 85 | } 86 | 87 | export const updateAdminNameAPI=async(data)=>{ 88 | let res = await axios.patch('https://vastra.onrender.com/AdminData',{name:data}); 89 | return res.data; 90 | } 91 | 92 | export const updateAdminEmailAPI=async(data)=>{ 93 | let res = await axios.patch('https://vastra.onrender.com/AdminData',{email:data}); 94 | return res.data; 95 | } 96 | 97 | export const updateAdminContactAPI=async(data)=>{ 98 | let res = await axios.patch('https://vastra.onrender.com/AdminData',{contact:data}); 99 | return res.data; 100 | } 101 | 102 | export const updateAdminPasswordAPI=async(data)=>{ 103 | let res = await axios.patch('https://vastra.onrender.com/AdminData',{password:data}); 104 | return res.data; 105 | } 106 | 107 | export const updateUsersListAPI=async(id,state)=>{ 108 | let res = await axios.patch(`https://vastra.onrender.com/UsersList/${id}`,{ 109 | isAuth:state, 110 | }); 111 | return res.data; 112 | } 113 | 114 | export const updateCurrentUserAPI=async(state)=>{ 115 | let res = await axios.patch(`https://vastra.onrender.com/CurrentUser`,{ 116 | isAuth:state, 117 | }); 118 | return res.data; 119 | } 120 | 121 | //DELETE-FUNCTION 122 | export const deleteAdminMensdataAPI=async(id)=>{ 123 | let res = await axios.delete(`https://vastra.onrender.com/MensData/${id}`); 124 | return res.data; 125 | } 126 | 127 | export const deleteAdminWomensdataAPI=async(id)=>{ 128 | let res = await axios.delete(`https://vastra.onrender.com/WomensData/${id}`); 129 | return res.data; 130 | } 131 | 132 | export const deleteAdminKidsdataAPI=async(id)=>{ 133 | let res = await axios.delete(`https://vastra.onrender.com/ChildrensData/${id}`); 134 | return res.data; 135 | } 136 | 137 | export const deleteUsersListdataAPI=async(id)=>{ 138 | let res = await axios.delete(`https://vastra.onrender.com/UsersList/${id}`); 139 | return res.data; 140 | } 141 | -------------------------------------------------------------------------------- /src/Redux/Product/Product.reducer.js: -------------------------------------------------------------------------------- 1 | import * as types from "./Product.type" 2 | 3 | let initialState={ 4 | loading:false, 5 | error:false, 6 | totalPages:0, 7 | products:[], 8 | mainData:[], 9 | filteredBrandData:[] 10 | } 11 | 12 | export const mensProductReducer = (state =initialState , {type , payload})=>{ 13 | switch(type){ 14 | case types.GET_PRODUCTS_LOADING:{ 15 | return { 16 | ...state, 17 | loading:true, 18 | error:false 19 | } 20 | } 21 | case types.GET_PRODUCTS_SUCCESS:{ 22 | return { 23 | ...state, 24 | loading:false, 25 | error:false, 26 | products:payload.data, 27 | totalPages:payload.headers["x-total-count"], 28 | } 29 | } 30 | case types.GET_MAIN_DATA_SUCCESS:{ 31 | return { 32 | ...state, 33 | loading:false, 34 | error:false, 35 | mainData:payload.data, 36 | } 37 | } 38 | case types.GET_FILTERED_PRODUCTS:{ 39 | let filteredBrand =state.products.filter((prod)=>( 40 | (prod.brand === payload) 41 | )) 42 | //console.log("payload",payload) 43 | return { 44 | ...state, 45 | loading:false, 46 | error:false, 47 | filteredBrandData:filteredBrand 48 | } 49 | } 50 | case types.GET_PRODUCTS_ERROR:{ 51 | return { 52 | ...state, 53 | loading:false, 54 | error:true 55 | } 56 | } 57 | default : { 58 | return state 59 | } 60 | } 61 | } 62 | 63 | 64 | export const WomensProductReducer = (state =initialState , {type , payload})=>{ 65 | switch(type){ 66 | case types.GET_PRODUCTS_LOADING:{ 67 | return { 68 | ...state, 69 | loading:true, 70 | error:false 71 | } 72 | } 73 | case types.GET_PRODUCTS_SUCCESS:{ 74 | return { 75 | ...state, 76 | loading:false, 77 | error:false, 78 | products:payload.data, 79 | totalPages:payload.headers["x-total-count"], 80 | } 81 | } 82 | case types.GET_MAIN_DATA_SUCCESS:{ 83 | return { 84 | ...state, 85 | loading:false, 86 | error:false, 87 | mainData:payload.data, 88 | } 89 | } 90 | case types.GET_FILTERED_PRODUCTS:{ 91 | let filteredBrand =state.products.filter((prod)=>( 92 | (prod.brand === payload) 93 | )) 94 | //console.log("payload",payload) 95 | return { 96 | ...state, 97 | loading:false, 98 | error:false, 99 | filteredBrandData:filteredBrand 100 | } 101 | } 102 | case types.GET_PRODUCTS_ERROR:{ 103 | return { 104 | ...state, 105 | loading:false, 106 | error:true 107 | } 108 | } 109 | default : { 110 | return state 111 | } 112 | } 113 | } 114 | 115 | 116 | export const KidsProductReducer = (state =initialState , {type , payload})=>{ 117 | switch(type){ 118 | case types.GET_PRODUCTS_LOADING:{ 119 | return { 120 | ...state, 121 | loading:true, 122 | error:false 123 | } 124 | } 125 | case types.GET_PRODUCTS_SUCCESS:{ 126 | return { 127 | ...state, 128 | loading:false, 129 | error:false, 130 | products:payload.data, 131 | totalPages:payload.headers["x-total-count"], 132 | } 133 | } 134 | case types.GET_MAIN_DATA_SUCCESS:{ 135 | return { 136 | ...state, 137 | loading:false, 138 | error:false, 139 | mainData:payload.data, 140 | } 141 | } 142 | case types.GET_FILTERED_PRODUCTS:{ 143 | let filteredBrand =state.products.filter((prod)=>( 144 | (prod.brand === payload) 145 | )) 146 | //console.log("payload",payload) 147 | return { 148 | ...state, 149 | loading:false, 150 | error:false, 151 | filteredBrandData:filteredBrand 152 | } 153 | } 154 | case types.GET_PRODUCTS_ERROR:{ 155 | return { 156 | ...state, 157 | loading:false, 158 | error:true 159 | } 160 | } 161 | default : { 162 | return state 163 | } 164 | } 165 | } -------------------------------------------------------------------------------- /src/Redux/Product/Product.api.js: -------------------------------------------------------------------------------- 1 | import axios from "axios" 2 | 3 | export const getMensProductsAPI = async (page) => { 4 | let res = await axios.get(`https://vastra.onrender.com/MensData?_limit=12&_page=${page}`) 5 | // console.log(res.data) 6 | return res 7 | } 8 | 9 | export const getSingleProductAPI = async (id) => { 10 | let res = await axios.get(`https://vastra.onrender.com/MensData/${id}`) 11 | return res 12 | } 13 | 14 | // sorting api calls 15 | let baseURL = `https://vastra.onrender.com/MensData?_limit=12&` 16 | 17 | export const getProductsSorting = async (val, page) => { 18 | if (val === "PriceLTH") { 19 | let res = await axios.get(`https://vastra.onrender.com/MensData?_limit=12&_page=${page}&_sort=discounted_price&_order=asc`) 20 | return res 21 | } 22 | if (val === "PriceHTL") { 23 | let res = await axios.get(`https://vastra.onrender.com/MensData?_limit=12&_page=${page}&_sort=discounted_price&_order=desc`) 24 | return res 25 | } 26 | if (val === "discount") { 27 | let res = await axios.get(`https://vastra.onrender.com/MensData?_limit=12&_page=${page}&_sort=${val}&_order=desc`) 28 | return res 29 | } 30 | if (val === "rating") { 31 | let res = await axios.get(`https://vastra.onrender.com/MensData?_limit=12&_page=${page}&_sort=${val}&_order=desc`) 32 | return res 33 | } else { 34 | let res = await axios.get(`${baseURL}`) 35 | return res 36 | } 37 | } 38 | 39 | // filter 40 | export const getFilterByBrand = async (val, page) => { 41 | val = (val.toString()) 42 | // console.log(val) 43 | let res = await axios.get(`https://vastra.onrender.com/MensData?_limit=12&_page=${page}&brand=${val}`) 44 | 45 | return res 46 | // console.log(res.data) 47 | } 48 | 49 | // --Women--Section-- 50 | export const getWomensProductsAPI = async (page) => { 51 | let res = await axios.get(`https://vastra.onrender.com/WomensData?_limit=12&_page=${page}`) 52 | // console.log(res.data) 53 | return res 54 | } 55 | export const getWomensSingleProductAPI = async (id) => { 56 | let res = await axios.get(`https://vastra.onrender.com/WomensData/${id}`) 57 | return res 58 | } 59 | 60 | // sorting api calls 61 | let WomensbaseURL = `https://vastra.onrender.com/WomensData?_limit=12&` 62 | 63 | export const getWomensProductsSorting = async (val, page) => { 64 | if (val === "PriceLTH") { 65 | let res = await axios.get(`https://vastra.onrender.com/WomensData?_limit=12&_page=${page}&_sort=discounted_price&_order=asc`) 66 | return res 67 | } 68 | if (val === "PriceHTL") { 69 | let res = await axios.get(`https://vastra.onrender.com/WomensData?_limit=12&_page=${page}&_sort=discounted_price&_order=desc`) 70 | return res 71 | } 72 | if (val === "discount") { 73 | let res = await axios.get(`https://vastra.onrender.com/WomensData?_limit=12&_page=${page}&_sort=${val}&_order=desc`) 74 | return res 75 | } 76 | if (val === "rating") { 77 | let res = await axios.get(`https://vastra.onrender.com/WomensData?_limit=12&_page=${page}&_sort=${val}&_order=desc`) 78 | return res 79 | } else { 80 | let res = await axios.get(`${WomensbaseURL}`) 81 | return res 82 | } 83 | } 84 | 85 | // filter 86 | export const getWomensFilterByBrand = async (val, page) => { 87 | val = (val.toString()) 88 | // console.log(val) 89 | let res = await axios.get(`https://vastra.onrender.com/WomensData?_limit=12&_page=${page}&brand=${val}`) 90 | 91 | return res 92 | // console.log(res.data) 93 | } 94 | 95 | // --Kids--Section-- 96 | export const getKidsProductsAPI = async (page) => { 97 | let res = await axios.get(`https://vastra.onrender.com/ChildData?_limit=12&_page=${page}`) 98 | // console.log(res.data) 99 | return res 100 | } 101 | export const getKidsSingleProductAPI = async (id) => { 102 | let res = await axios.get(`https://vastra.onrender.com/ChildData/${id}`) 103 | return res 104 | } 105 | 106 | // sorting api calls 107 | let KidsbaseURL = `https://vastra.onrender.com/ChildData?_limit=12&` 108 | 109 | export const getKidsProductsSorting = async (val, page) => { 110 | if (val === "PriceLTH") { 111 | let res = await axios.get(`https://vastra.onrender.com/ChildData?_limit=12&_page=${page}&_sort=discounted_price&_order=asc`) 112 | return res 113 | } 114 | if (val === "PriceHTL") { 115 | let res = await axios.get(`https://vastra.onrender.com/ChildData?_limit=12&_page=${page}&_sort=discounted_price&_order=desc`) 116 | return res 117 | } 118 | if (val === "discount") { 119 | let res = await axios.get(`https://vastra.onrender.com/ChildData?_limit=12&_page=${page}&_sort=${val}&_order=desc`) 120 | return res 121 | } 122 | if (val === "rating") { 123 | let res = await axios.get(`https://vastra.onrender.com/ChildData?_limit=12&_page=${page}&_sort=${val}&_order=desc`) 124 | return res 125 | } else { 126 | let res = await axios.get(`${KidsbaseURL}`) 127 | return res 128 | } 129 | } 130 | 131 | // filter 132 | export const getKidsFilterByBrand = async (val, page) => { 133 | val = (val.toString()) 134 | // console.log(val) 135 | let res = await axios.get(`https://vastra.onrender.com/ChildData?_limit=12&_page=${page}&brand=${val}`) 136 | 137 | return res 138 | // console.log(res.data) 139 | } 140 | 141 | 142 | -------------------------------------------------------------------------------- /src/Pages/Home.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { HomeDataCard } from "../Components/HomeDataCard"; 3 | import { HomeData, slider as images } from "../Redux/HomeData"; 4 | import "../Styles/Home.css"; 5 | import SimpleImageSlider from "react-simple-image-slider"; 6 | import Navbar from '../Components/Navbar/Navbar'; 7 | import Footer from '../Components/Footer/Footer' 8 | // import { LoginOrSignUp } from './Pages/LoginOrSignUp'; 9 | 10 | const Home = () => { 11 | const [OmgDeals, setOmgDeals] = useState([]); 12 | const [HoliDeals, setHoliDeals] = useState([]); 13 | const [BrandsToBag, setBrandsToBag] = useState([]); 14 | const [ShopByCategory, setShopByCategory] = useState([]); 15 | const [GrandBrand, setGrandBrand] = useState([]); 16 | const [BudgetToBuys, setBudgetToBuys] = useState([]); 17 | 18 | useEffect(() => { 19 | HomeData().then((res) => { 20 | setOmgDeals(res.HomePageOmgDeals); 21 | setHoliDeals(res.HoliDeals); 22 | setBrandsToBag(res.HomePageBrandsToBag); 23 | setShopByCategory(res.HomePageShopByCategory); 24 | setGrandBrand(res.HomePageGrandBrands); 25 | setBudgetToBuys(res.HomePageBudgetToBuys); 26 | }); 27 | }, []); 28 | 29 | return ( 30 |
31 | 32 | 40 | 41 |
42 | {/*

Omg Deals

*/} 43 | {/* Crazy-Deal */} 44 |
45 | {OmgDeals.length > 0 && 46 | OmgDeals.map((el) => )} 47 |
48 |
49 | 50 |
51 | {/*

Holi Deals

*/} 52 | Pick-Your-Holi-Look 53 |
54 | {HoliDeals.length > 0 && 55 | HoliDeals.map((el) => )} 56 |
57 |
58 | 59 |
60 | {/*

Brand to bag

*/} 61 | Brands-On-The-Way-Up 62 |
63 | {BrandsToBag.length > 0 && 64 | BrandsToBag.map((el) => )} 65 |
66 |
67 | 68 |
69 | {/*

Shop By Category

*/} 70 | Featured-Favourites 71 |
72 | {ShopByCategory.length > 0 && 73 | ShopByCategory.map((el) => )} 74 |
75 |
76 | 77 |
78 | {/*

Grand Brand

*/} 79 | Best-loved-Brands 80 |
81 | {GrandBrand.length > 0 && 82 | GrandBrand.map((el) => )} 83 |
84 |
85 | 86 |
87 | {/*

Budget To Buys

*/} 88 | Summer-Bargains 89 |
90 | {BudgetToBuys.length > 0 && 91 | BudgetToBuys.map((el) => )} 92 |
93 |
94 | 95 | {/* 3 days-delivery */} 96 | Delivery-Express-3-Days 97 | {/* Payment */} 98 | order & payment 99 |
100 |
101 | ); 102 | }; 103 | 104 | export default Home; 105 | -------------------------------------------------------------------------------- /src/Admin/AdminNavbar.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { NavLink } from 'react-router-dom'; 3 | import { 4 | IconButton, 5 | Avatar, 6 | Box, 7 | CloseButton, 8 | Flex, 9 | HStack, 10 | VStack, 11 | Icon, 12 | Image, 13 | useColorModeValue, 14 | Drawer, 15 | DrawerContent, 16 | Text, 17 | useDisclosure, 18 | Menu, 19 | MenuButton, 20 | AvatarBadge 21 | } from '@chakra-ui/react'; 22 | import { FiMenu } from 'react-icons/fi'; 23 | import { AiFillHome } from 'react-icons/ai' 24 | import { BsFillBellFill } from 'react-icons/bs' 25 | import { HiFolderAdd } from 'react-icons/hi' 26 | import { ImMan, ImWoman } from 'react-icons/im'; 27 | import { FaChild, FaUsers } from 'react-icons/fa' 28 | import { RiAccountPinCircleFill, RiLogoutCircleFill } from 'react-icons/ri' 29 | import { useDispatch, useSelector } from 'react-redux'; 30 | import { useEffect } from 'react'; 31 | import { getAdminData } from '../Redux/Admin/Admin.action'; 32 | 33 | const LinkItems = [ 34 | { name: 'Home', icon: AiFillHome, path: '/admin-dashboard' }, 35 | { name: 'Add Product', icon: HiFolderAdd, path: '/add-products' }, 36 | { name: 'Men', icon: ImMan, path: '/admin-men' }, 37 | { name: 'Women', icon: ImWoman, path: '/admin-women' }, 38 | { name: 'Kids', icon: FaChild, path: '/admin-kids' }, 39 | { name: 'Users', icon: FaUsers, path: '/admin-users' }, 40 | { name: 'Account', icon: RiAccountPinCircleFill, path: '/admin-profile' }, 41 | { name: 'Logout', icon: RiLogoutCircleFill, path: '/' } 42 | ]; 43 | //RiLogoutCircleFill 44 | export default function AdminNavbar({ 45 | children, 46 | }) { 47 | const { isOpen, onOpen, onClose } = useDisclosure(); 48 | const { adminData } = useSelector((store) => store.adminManager); 49 | const dispatch = useDispatch(); 50 | useEffect(() => { 51 | dispatch(getAdminData()); 52 | }, []) 53 | return ( 54 | 55 | onClose} 57 | display={{ base: 'none', md: 'block' }} 58 | border={'0px solid black'} 59 | /> 60 | 68 | 69 | 70 | 71 | 72 | {/* mobilenav */} 73 | 74 | 75 | {children} 76 | 77 | 78 | ); 79 | } 80 | const SidebarContent = ({ onClose, ...rest }) => { 81 | return ( 82 | 91 | 92 | 93 | 94 | Vestra 95 | 96 | 97 | 98 | 99 | {LinkItems.map((link) => ( 100 | 101 | {link} 102 | 103 | ))} 104 | 105 | ); 106 | }; 107 | const NavItem = ({ icon, children, item, ...rest }) => { 108 | return ( 109 | 110 | 123 | {icon && ( 124 | 132 | )} 133 | {children.name} 134 | 135 | 136 | ); 137 | }; 138 | const MobileNav = ({ onOpen, name, ...rest }) => { 139 | return ( 140 | 150 | } 156 | /> 157 | 158 | 159 | Vastra 164 | 165 | 166 | 167 | } 172 | /> 173 | 174 | 175 | 179 | 180 | 182 | 183 | 184 | 189 | {name} 190 | 191 | Admin 192 | 193 | 194 | 195 | 196 | 197 | 198 | 199 | 200 | ); 201 | }; -------------------------------------------------------------------------------- /src/Pages/CartComponent.jsx: -------------------------------------------------------------------------------- 1 | import { CloseIcon } from "@chakra-ui/icons"; 2 | import { 3 | Box, 4 | Checkbox, 5 | Flex, 6 | HStack, 7 | Image, 8 | Select, 9 | Stack, 10 | Text, 11 | } from "@chakra-ui/react"; 12 | import React from "react"; 13 | 14 | 15 | const CartComponent = ({ cart, handleCheckData, handleChangeQty, removeFromCart }) => { 16 | 17 | return ( 18 | 19 | 20 | 21 | 27 | 28 | {cart.title} 29 | 30 | removeFromCart(cart.id)} /> 31 | 32 | 33 | 34 | 35 | Sold by: 36 | 37 | {cart.brand} 38 | 39 | 40 | 41 | 45 | Qty: 46 | 47 | 60 | 61 | 62 | 63 | 64 | 71 | 72 | Rs.{cart.discounted_price * cart.qty} 73 | 74 | 79 | Rs.{cart.strike_price * cart.qty} 80 | 81 | 82 | {cart.discount} 83 | 84 | 85 | 86 | 87 | 88 | 93 | 94 | handleCheckData(cart.id, cart)} 101 | > 102 | 103 | 104 | 109 | 110 | {cart.title} 111 | 112 | removeFromCart(cart.id)} /> 113 | 114 | 115 | 116 | 117 | Sold by: 118 | 119 | {cart.brand} 120 | 121 | 122 | 123 | 127 | Qty: 128 | 129 | 142 | 143 | 144 | 145 | 146 | 153 | 154 | Rs.{cart.discounted_price * cart.qty} 155 | 156 | 161 | Rs.{cart.strike_price * cart.qty} 162 | 163 | 164 | {cart.discount} 165 | 166 | 167 | 168 | 169 | 170 | 171 | 172 | 173 | 174 | ); 175 | }; 176 | 177 | export default CartComponent; 178 | -------------------------------------------------------------------------------- /src/Redux/Admin/Admin.reducer.js: -------------------------------------------------------------------------------- 1 | import { ADD_ADMIN_CONTACT, 2 | ADD_ADMIN_EMAIL, 3 | ADD_ADMIN_NAME, 4 | ADD_ADMIN_PASSWORD, 5 | ADD_CURRENT_USER, 6 | ADD_KIDS_SUCCESS, 7 | ADD_MENS_SUCCESS, 8 | ADD_USERSLIST_DATA, 9 | ADD_WOMENS_SUCCESS, 10 | DELETE_PRODUCT_KIDS, 11 | DELETE_PRODUCT_MENS, 12 | DELETE_PRODUCT_WOMENS, 13 | DELETE_USERSLIST_DATA, 14 | GET_ADMINDATA_SUCCESS, 15 | GET_CURRENT_USER, 16 | GET_KIDS_SUCCESS, 17 | GET_MENS_SUCCESS, 18 | GET_PRODUCTS_ERROR, 19 | GET_PRODUCTS_LOADING, 20 | GET_USERSLIST_SUCCESS, 21 | GET_WOMENS_SUCCESS, 22 | UPDATE_CURRENT_USER, 23 | UPDATE_PRODUCT_KIDS, 24 | UPDATE_PRODUCT_MENS, 25 | UPDATE_PRODUCT_WOMENS, 26 | UPDATE_USERSLIST_DATA } from "./Admin.type" 27 | 28 | const initialState = { 29 | loading: false, 30 | error: false, 31 | mensData: [], 32 | womensData: [], 33 | kidsData: [], 34 | usersListData: [], 35 | adminData: {}, 36 | currentUserData: { 37 | email: "", 38 | name: "", 39 | password: "", 40 | logindetails: { 41 | createdAt: "", 42 | creationTime: "", 43 | lastLoginAt: "", 44 | lastSignInTime: "" 45 | }, 46 | image: "", 47 | contact: null, 48 | isAuth: false, 49 | }, 50 | } 51 | export const adminReducer = (state = initialState, { type, payload }) => { 52 | switch (type) { 53 | case GET_PRODUCTS_LOADING: { 54 | return { 55 | ...state, 56 | loading: true, 57 | } 58 | } 59 | case GET_PRODUCTS_ERROR: { 60 | return { 61 | ...state, 62 | loading: false, 63 | error: true, 64 | } 65 | } 66 | case ADD_MENS_SUCCESS: { 67 | return { 68 | ...state, 69 | loading: false, 70 | error: false, 71 | } 72 | } 73 | case ADD_WOMENS_SUCCESS: { 74 | return { 75 | ...state, 76 | loading: false, 77 | error: false, 78 | } 79 | } 80 | case ADD_KIDS_SUCCESS: { 81 | return { 82 | ...state, 83 | loading: false, 84 | error: false, 85 | } 86 | } 87 | case ADD_ADMIN_NAME: { 88 | return { 89 | ...state, 90 | loading: false, 91 | error: false, 92 | } 93 | } 94 | case ADD_ADMIN_EMAIL: { 95 | return { 96 | ...state, 97 | loading: false, 98 | error: false, 99 | } 100 | } 101 | case ADD_ADMIN_CONTACT: { 102 | return { 103 | ...state, 104 | loading: false, 105 | error: false, 106 | } 107 | } 108 | case ADD_ADMIN_PASSWORD: { 109 | return { 110 | ...state, 111 | loading: false, 112 | error: false, 113 | } 114 | } 115 | case ADD_CURRENT_USER:{ 116 | return{ 117 | ...state, 118 | loading:false, 119 | error:false, 120 | } 121 | } 122 | case ADD_USERSLIST_DATA:{ 123 | return{ 124 | ...state, 125 | loading:false, 126 | error:false, 127 | } 128 | } 129 | case GET_MENS_SUCCESS: { 130 | return { 131 | ...state, 132 | loading: false, 133 | error: false, 134 | mensData: payload, 135 | } 136 | } 137 | case GET_WOMENS_SUCCESS: { 138 | return { 139 | ...state, 140 | loading: false, 141 | error: false, 142 | womensData: payload, 143 | } 144 | } 145 | case GET_KIDS_SUCCESS: { 146 | return { 147 | ...state, 148 | loading: false, 149 | error: false, 150 | kidsData: payload, 151 | } 152 | } 153 | case GET_CURRENT_USER:{ 154 | return{ 155 | ...state, 156 | loading:false, 157 | error:false, 158 | currentUserData:payload, 159 | } 160 | } 161 | case UPDATE_PRODUCT_MENS: { 162 | return { 163 | ...state, 164 | loading: false, 165 | error: false, 166 | } 167 | } 168 | case UPDATE_PRODUCT_WOMENS: { 169 | return { 170 | ...state, 171 | loading: false, 172 | error: false, 173 | } 174 | } 175 | case UPDATE_PRODUCT_KIDS: { 176 | return { 177 | ...state, 178 | loading: false, 179 | error: false, 180 | } 181 | } 182 | case UPDATE_USERSLIST_DATA: { 183 | return { 184 | ...state, 185 | loading: false, 186 | error: false, 187 | } 188 | } 189 | case UPDATE_CURRENT_USER:{ 190 | return{ 191 | ...state, 192 | loading:false, 193 | error:false, 194 | 195 | } 196 | } 197 | case DELETE_PRODUCT_MENS: { 198 | return { 199 | ...state, 200 | loading: false, 201 | error: false, 202 | } 203 | } 204 | case DELETE_PRODUCT_WOMENS: { 205 | return { 206 | ...state, 207 | loading: false, 208 | error: false, 209 | } 210 | } 211 | case DELETE_PRODUCT_KIDS: { 212 | return { 213 | ...state, 214 | loading: false, 215 | error: false, 216 | } 217 | } 218 | case GET_USERSLIST_SUCCESS: { 219 | return { 220 | ...state, 221 | loading: false, 222 | error: false, 223 | usersListData: payload, 224 | } 225 | } 226 | case GET_ADMINDATA_SUCCESS: { 227 | return { 228 | ...state, 229 | loading: false, 230 | error: false, 231 | adminData: payload, 232 | } 233 | } 234 | case DELETE_USERSLIST_DATA: { 235 | return { 236 | ...state, 237 | loading: false, 238 | error: false, 239 | } 240 | } 241 | default: { 242 | return state 243 | } 244 | } 245 | } -------------------------------------------------------------------------------- /src/Components/Navbar/Navbar.css: -------------------------------------------------------------------------------- 1 | /* *{ 2 | word-wrap: break-word; 3 | word-wrap: normal; 4 | word-wrap: inherit; 5 | word-wrap: break-word; 6 | } */ 7 | .inp { 8 | height: 35px; 9 | width: 550px; 10 | background-color: rgb(245, 245, 246); 11 | border: none; 12 | border-radius: 5px; 13 | padding-left: 3%; 14 | } 15 | .inp1 { 16 | background-color: rgb(245, 245, 246); 17 | display: flex; 18 | margin-left: 3%; 19 | border-radius: 5px; 20 | } 21 | 22 | .link1:hover .ddown { 23 | display: block; 24 | } 25 | 26 | .link1 { 27 | margin-left: 1%; 28 | } 29 | 30 | .link1 img { 31 | margin-right: 20px; 32 | } 33 | 34 | /* 35 | for mini nav 36 | */ 37 | 38 | .inp1 > .sr { 39 | color: gray; 40 | height: 35px; 41 | margin-left: 2%; 42 | font-size: 15px; 43 | margin-right: 3%; 44 | } 45 | 46 | .men:hover { 47 | border-bottom: 5px solid #ee5f73; 48 | } 49 | 50 | .women:hover { 51 | border-bottom: 5px solid #fb56c1; 52 | } 53 | 54 | .kids:hover { 55 | border-bottom: 5px solid #f26a10; 56 | } 57 | 58 | .home:hover { 59 | border-bottom: 5px solid #f2c210; 60 | } 61 | 62 | .beauty:hover { 63 | border-bottom: 5px solid #0db7af; 64 | } 65 | .studio:hover { 66 | border-bottom: 5px solid crimson; 67 | } 68 | 69 | /* ul colour change */ 70 | 71 | .m > ul > :nth-child(1) { 72 | color: #ee5f73; 73 | font-weight: bold; 74 | } 75 | 76 | .w > ul > :nth-child(1) { 77 | color: #fb56c1; 78 | font-weight: bold; 79 | } 80 | 81 | .h > ul > :nth-child(1) { 82 | color: #f2c210; 83 | font-weight: bold; 84 | } 85 | 86 | .b > ul > :nth-child(1) { 87 | color: #0db7af; 88 | font-weight: bold; 89 | } 90 | 91 | .ddown { 92 | height: auto; 93 | width: 1100px; 94 | margin-left: -10px; 95 | background-color: rgb(255, 255, 255); 96 | z-index: 200; 97 | margin-top: 15px; 98 | position: absolute; 99 | display: none; 100 | /* box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px; */ 101 | text-align: left; 102 | padding-left: 1%; 103 | } 104 | 105 | /* .ddown{ 106 | overflow: auto; 107 | width: 1110px; 108 | left: 0; 109 | right: 0; 110 | position: absolute; 111 | margin: 0 auto; 112 | padding: 0 10px 10px 15px; 113 | -webkit-transition: all .2s ease-out; 114 | transition: all .2s ease-out; 115 | } */ 116 | 117 | 118 | 119 | .down>.flex>.a1 { 120 | width: 22%; 121 | height: 12cm 122 | } 123 | .down>.flex>.a1> li { 124 | list-style: none; 125 | padding: 1.5px; 126 | font-weight: 300; 127 | font-size: 14px; 128 | } 129 | 130 | 131 | 132 | 133 | 134 | 135 | .a1>ul > :nth-child(1) { 136 | font-size: 14px; 137 | font-weight: 700; 138 | /* color: #ee6779; */ 139 | /* background-color: black; */ 140 | padding: 12px 0px 10px 0px; 141 | /* margin-bottom: -15px; */ 142 | } 143 | 144 | .k>ul>:nth-child(1) 145 | { 146 | color:#f26a10; 147 | font-weight: bold; 148 | } 149 | 150 | 151 | 152 | .down>.flex>.a1>.ddown .nextul { 153 | border-top: solid 2px rgb(223, 235, 223); 154 | margin-top: 10px; 155 | /* background-color: #484849; */ 156 | } 157 | 158 | 159 | .down>.flex>.a2{ 160 | width: 22%; 161 | height: 12cm; 162 | background-color: rgb(245, 245, 246) 163 | } 164 | .down>.flex>.a2>li { 165 | list-style: none; 166 | padding: 1.5px; 167 | font-weight: 400; 168 | } 169 | .a2> ul > :nth-child(1) { 170 | font-size: 16px; 171 | font-weight: 700; 172 | /* color: #f28090; */ 173 | /* background-color: black; */ 174 | padding: 12px 0px 10px 0px; 175 | /* margin-bottom: 15px; */ 176 | } 177 | 178 | 179 | .down>.flex>.a2> .ddown .nextul { 180 | border-top: solid 2px rgb(223, 235, 223); 181 | margin-top: 10px; 182 | /* background-color: #484849; */ 183 | } 184 | .a1{ 185 | width: 30%; 186 | } 187 | .a2{ 188 | width: 30%; 189 | } 190 | 191 | li{ 192 | cursor: pointer; 193 | } 194 | li:hover{ 195 | font-weight: bold; 196 | } 197 | ul { 198 | list-style-type: none; 199 | 200 | } 201 | .flex{ 202 | display: flex; 203 | } 204 | 205 | .down > .flex > .a1 { 206 | width: 22%; 207 | height: 12cm; 208 | } 209 | .down > .flex > .a1 > li { 210 | list-style: none; 211 | padding: 1.5px; 212 | font-weight: 300; 213 | font-size: 14px; 214 | } 215 | 216 | .a1 > ul > :nth-child(1) { 217 | font-size: 14px; 218 | font-weight: 700; 219 | /* color: #ee6779; */ 220 | /* background-color: black; */ 221 | padding: 12px 0px 10px 0px; 222 | /* margin-bottom: -15px; */ 223 | } 224 | 225 | .k > ul > :nth-child(1) { 226 | color: #f26a10; 227 | font-weight: bold; 228 | } 229 | 230 | .down > .flex > .a1 > .ddown .nextul { 231 | border-top: solid 2px rgb(223, 235, 223); 232 | margin-top: 10px; 233 | /* background-color: #484849; */ 234 | } 235 | 236 | .down > .flex > .a2 { 237 | width: 22%; 238 | height: 12cm; 239 | background-color: rgb(245, 245, 246); 240 | } 241 | 242 | .down > .flex > .a2 > li { 243 | list-style: none; 244 | padding: 1.5px; 245 | font-weight: 400; 246 | } 247 | 248 | .a2 > ul > :nth-child(1) { 249 | font-size: 16px; 250 | font-weight: 700; 251 | /* color: #f28090; */ 252 | /* background-color: black; */ 253 | padding: 12px 0px 10px 0px; 254 | /* margin-bottom: 15px; */ 255 | } 256 | 257 | .down > .flex > .a2 > .ddown .nextul { 258 | border-top: solid 2px rgb(223, 235, 223); 259 | margin-top: 10px; 260 | /* background-color: #484849; */ 261 | } 262 | .a1 { 263 | width: 30%; 264 | } 265 | .a2 { 266 | width: 30%; 267 | } 268 | 269 | li { 270 | cursor: pointer; 271 | } 272 | li:hover { 273 | font-weight: bold; 274 | } 275 | ul { 276 | list-style-type: none; 277 | } 278 | 279 | .studioImg img { 280 | margin: 20px 220.9px 0 221px; 281 | } 282 | .studioImg p { 283 | text-align: center; 284 | } 285 | 286 | .explore_studio { 287 | min-width: 109px; 288 | font-family: Whitney; 289 | font-size: 14px; 290 | font-weight: 600; 291 | line-height: 1.43; 292 | text-align: center; 293 | color: #282c3f; 294 | /* background: white; */ 295 | /* background-color: white; */ 296 | 297 | /* visibility: hidden; */ 298 | /* text-align: left; */ 299 | pointer-events: auto; 300 | } 301 | 302 | .explore_studio button { 303 | margin-top: 10px; 304 | background: white; 305 | } 306 | 307 | /* .nw { 308 | color: crimson; 309 | font-weight: 600; 310 | font-size: 10px; 311 | margin-top: 0%; 312 | margin-left: 0.3%; 313 | } */ 314 | 315 | .rightLink{ 316 | font-weight: bold ; 317 | color: #000000 ; 318 | text-decoration: none; 319 | font-size: 12px; 320 | } 321 | 322 | .rightLink:hover{ 323 | color: crimson ; 324 | } -------------------------------------------------------------------------------- /src/Redux/Product/Product.action.js: -------------------------------------------------------------------------------- 1 | import { 2 | getFilterByBrand, 3 | getMensProductsAPI, 4 | getProductsSorting, 5 | getWomensFilterByBrand, 6 | getWomensProductsAPI, 7 | getWomensProductsSorting, 8 | getKidsFilterByBrand, 9 | getKidsProductsAPI, 10 | getKidsProductsSorting 11 | } from "./Product.api" 12 | import * as types from "./Product.type" 13 | 14 | export const getMensProducts = (page) => async (dispatch) => { 15 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 16 | try { 17 | let data = await getMensProductsAPI(page) 18 | // console.log("data:", data ) 19 | dispatch({ 20 | type: types.GET_PRODUCTS_SUCCESS, 21 | payload: data 22 | }) 23 | } catch (err) { 24 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 25 | } 26 | } 27 | export const getMainData = (page) => async (dispatch) => { 28 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 29 | try { 30 | let data = await getMensProductsAPI(page) 31 | // console.log("data:", data ) 32 | dispatch({ 33 | type: types.GET_MAIN_DATA_SUCCESS, 34 | payload: data 35 | }) 36 | } catch (err) { 37 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 38 | } 39 | } 40 | export const getFilteredProducts = (val) => async (dispatch) => { 41 | 42 | //console.log("val:", val) 43 | // dispatch({type:types.GET_PRODUCTS_LOADING}) 44 | 45 | try { 46 | 47 | dispatch({ 48 | type: types.GET_FILTERED_PRODUCTS, 49 | payload: val 50 | }) 51 | } catch (err) { 52 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 53 | } 54 | } 55 | 56 | export const getMensProductsSorted = (val, page) => async (dispatch) => { 57 | 58 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 59 | 60 | try { 61 | let data = await getProductsSorting(val, page) 62 | 63 | //console.log("data:", data) 64 | dispatch({ 65 | type: types.GET_PRODUCTS_SUCCESS, 66 | payload: data 67 | }) 68 | } catch (err) { 69 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 70 | } 71 | } 72 | 73 | export const getFilteredByBrand = (val, page) => async (dispatch) => { 74 | // console.log("Val:",val) 75 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 76 | 77 | try { 78 | let data = await getFilterByBrand(val, page) 79 | 80 | // console.log("data:", data ) 81 | dispatch({ 82 | type: types.GET_PRODUCTS_SUCCESS, 83 | payload: data 84 | }) 85 | } catch (err) { 86 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 87 | } 88 | } 89 | 90 | // --- 91 | 92 | export const getWomensProducts = (page) => async (dispatch) => { 93 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 94 | try { 95 | let data = await getWomensProductsAPI(page) 96 | // console.log("data:", data ) 97 | dispatch({ 98 | type: types.GET_PRODUCTS_SUCCESS, 99 | payload: data 100 | }) 101 | } catch (err) { 102 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 103 | } 104 | } 105 | export const getWomensMainData = (page) => async (dispatch) => { 106 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 107 | try { 108 | let data = await getWomensProductsAPI(page) 109 | // console.log("data:", data ) 110 | dispatch({ 111 | type: types.GET_MAIN_DATA_SUCCESS, 112 | payload: data 113 | }) 114 | } catch (err) { 115 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 116 | } 117 | } 118 | export const getWomensFilteredProducts = (val) => async (dispatch) => { 119 | 120 | //console.log("val:", val) 121 | // dispatch({type:types.GET_PRODUCTS_LOADING}) 122 | 123 | try { 124 | 125 | dispatch({ 126 | type: types.GET_FILTERED_PRODUCTS, 127 | payload: val 128 | }) 129 | } catch (err) { 130 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 131 | } 132 | } 133 | 134 | export const getWomensProductsSorted = (val, page) => async (dispatch) => { 135 | 136 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 137 | 138 | try { 139 | let data = await getWomensProductsSorting(val, page) 140 | 141 | //console.log("data:", data) 142 | dispatch({ 143 | type: types.GET_PRODUCTS_SUCCESS, 144 | payload: data 145 | }) 146 | } catch (err) { 147 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 148 | } 149 | } 150 | 151 | export const getWomensFilteredByBrand = (val, page) => async (dispatch) => { 152 | // console.log("Val:",val) 153 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 154 | 155 | try { 156 | let data = await getWomensFilterByBrand(val, page) 157 | 158 | // console.log("data:", data ) 159 | dispatch({ 160 | type: types.GET_PRODUCTS_SUCCESS, 161 | payload: data 162 | }) 163 | } catch (err) { 164 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 165 | } 166 | } 167 | 168 | // ---Kids Section 169 | 170 | export const getKidsProducts = (page) => async (dispatch) => { 171 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 172 | try { 173 | let data = await getKidsProductsAPI(page) 174 | // console.log("data:", data ) 175 | dispatch({ 176 | type: types.GET_PRODUCTS_SUCCESS, 177 | payload: data 178 | }) 179 | } catch (err) { 180 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 181 | } 182 | } 183 | export const getKidsMainData = (page) => async (dispatch) => { 184 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 185 | try { 186 | let data = await getKidsProductsAPI(page) 187 | // console.log("data:", data ) 188 | dispatch({ 189 | type: types.GET_MAIN_DATA_SUCCESS, 190 | payload: data 191 | }) 192 | } catch (err) { 193 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 194 | } 195 | } 196 | export const getKidsFilteredProducts = (val) => async (dispatch) => { 197 | 198 | //console.log("val:", val) 199 | // dispatch({type:types.GET_PRODUCTS_LOADING}) 200 | 201 | try { 202 | 203 | dispatch({ 204 | type: types.GET_FILTERED_PRODUCTS, 205 | payload: val 206 | }) 207 | } catch (err) { 208 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 209 | } 210 | } 211 | 212 | export const getKidsProductsSorted = (val, page) => async (dispatch) => { 213 | 214 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 215 | 216 | try { 217 | let data = await getKidsProductsSorting(val, page) 218 | 219 | //console.log("data:", data) 220 | dispatch({ 221 | type: types.GET_PRODUCTS_SUCCESS, 222 | payload: data 223 | }) 224 | } catch (err) { 225 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 226 | } 227 | } 228 | 229 | export const getKidsFilteredByBrand = (val, page) => async (dispatch) => { 230 | // console.log("Val:",val) 231 | dispatch({ type: types.GET_PRODUCTS_LOADING }) 232 | try { 233 | let data = await getKidsFilterByBrand(val, page) 234 | // console.log("data:", data ) 235 | dispatch({ 236 | type: types.GET_PRODUCTS_SUCCESS, 237 | payload: data 238 | }) 239 | } catch (err) { 240 | dispatch({ type: types.GET_PRODUCTS_ERROR }) 241 | } 242 | } 243 | -------------------------------------------------------------------------------- /src/Pages/Cart.jsx: -------------------------------------------------------------------------------- 1 | import { Box, Button, Flex, Text } from "@chakra-ui/react"; 2 | import axios from "axios"; 3 | import React from "react"; 4 | import { useEffect, useState } from "react"; 5 | import { useDispatch, useSelector } from "react-redux"; 6 | import { 7 | // deleteCartData, 8 | fetchCartData 9 | } from "../Redux/Cart/Cart.action"; 10 | import CartComponent from "./CartComponent"; 11 | import LoadingPage from "./LoadingPage"; 12 | import PageNotFound from "./PageNotFound"; 13 | import PaymentNavbar from "../Components/PaymentNavbar"; 14 | import { useNavigate } from "react-router-dom"; 15 | import { deleteCartAPI } from "../Redux/Cart/Cart.api"; 16 | import { postCheckoutData } from "../Redux/Checkout/Checkout.action"; 17 | 18 | const Cart = () => { 19 | const { loading, error } = useSelector((store) => store.cart); 20 | 21 | const dispatch = useDispatch(); 22 | const goToAddress = useNavigate() 23 | const [sampleData, setSampleData] = useState([]); 24 | 25 | const fetchCartAPI = async () => { 26 | let res = await axios.get(`https://vastra.onrender.com/cart`); 27 | const result = res?.data?.map((item) => { 28 | return { 29 | ...item, 30 | isChecked: false, 31 | qty: 1, 32 | }; 33 | }); 34 | setSampleData(result); 35 | }; 36 | useEffect(() => { 37 | dispatch(fetchCartData()); 38 | fetchCartAPI(); 39 | }, [dispatch]); 40 | 41 | const handleCheckData = (id, cart) => { 42 | const resultData = sampleData?.map((item) => { 43 | return item?.id === id ? { ...item, isChecked: !item?.isChecked } : item; 44 | }); 45 | setSampleData(resultData); 46 | dispatch(postCheckoutData(cart)); 47 | }; 48 | let resultcount; 49 | let resultStriked; 50 | const handleChangeQty = (value, id) => { 51 | const resultData = sampleData?.map((item) => { 52 | return item?.id === id ? { ...item, qty: value } : item; 53 | }); 54 | setSampleData(resultData); 55 | }; 56 | 57 | const removeFromCart = async (id) => { 58 | await deleteCartAPI(id) 59 | fetchCartAPI() 60 | } 61 | 62 | resultcount = 0; 63 | sampleData 64 | ?.filter((item) => item.isChecked === true) 65 | ?.map((item) => { 66 | resultcount = 67 | Number(resultcount) + Number(item.discounted_price) * Number(item.qty); 68 | return resultcount; 69 | }); 70 | resultStriked = 0; 71 | sampleData 72 | ?.filter((item) => item.isChecked === true) 73 | ?.map((item) => { 74 | resultStriked = 75 | Number(resultStriked) + Number(item.strike_price) * Number(item.qty); 76 | return resultStriked; 77 | }); 78 | //console.log("resultStriked", resultStriked); 79 | 80 | const resultTotalItem = sampleData?.filter((item) => ( 81 | item.isChecked === true 82 | )) 83 | // console.log("resultTotalItem",resultTotalItem) 84 | 85 | const placeOrderObj = { 86 | "Total MRP": resultcount, 87 | "Discount on MRP": resultStriked, 88 | }; 89 | // console.log(placeOrderObj); 90 | 91 | if (loading) { 92 | return ( 93 | <> 94 | 95 | 96 | ); 97 | } 98 | 99 | if (error) { 100 | return ( 101 | <> 102 | 103 | 104 | ); 105 | } 106 | 107 | const checkCount = sampleData?.filter((item) => { 108 | return item?.isChecked === true; 109 | }); 110 | 111 | return ( 112 | <> 113 | 114 | {/* */} 115 | 116 | 117 | 118 | 122 | 131 | 132 | 133 | 139 | 140 | Check Delivery time & services 141 | 142 | 154 | 155 | 156 | 157 | 163 | 168 | {`(${checkCount.length}/${sampleData.length}) ITEMS SELECTED`} 169 | 170 | 171 | 172 | 173 | {sampleData?.map((cart, i) => ( 174 | 181 | ))} 182 | 183 | 184 | 191 | 192 | PRICE DETAILS ({resultTotalItem.length}{" "}item) 193 | 194 | 195 | {Object.keys(placeOrderObj).map((item) => { 196 | return ( 197 | 198 | {item} 199 | {placeOrderObj[item]} 200 | 201 | ); 202 | })} 203 | 204 | 209 | 210 | 211 | 212 | 213 | ); 214 | }; 215 | 216 | export default Cart; 217 | -------------------------------------------------------------------------------- /src/Components/ProfileSection.jsx: -------------------------------------------------------------------------------- 1 | import { 2 | Popover, 3 | PopoverTrigger, 4 | PopoverContent, 5 | PopoverBody, 6 | PopoverArrow, 7 | IconButton, 8 | Button, 9 | Stack, 10 | Flex, 11 | Tag, 12 | Text, 13 | useColorModeValue, 14 | } from "@chakra-ui/react"; 15 | 16 | import { BiHeart } from "react-icons/bi"; 17 | import { 18 | MdOutlineCardGiftcard, 19 | MdOutlineContactPhone, 20 | MdOutlineCreditCard, 21 | MdOutlineDriveFileRenameOutline, 22 | MdOutlineMail, 23 | } from "react-icons/md"; 24 | import { AiOutlineLogin } from "react-icons/ai"; 25 | import { TbAddressBook } from "react-icons/tb"; 26 | import { CgProfile } from "react-icons/cg"; 27 | import { RiShutDownLine, RiCouponLine } from "react-icons/ri"; 28 | import { NavLink } from "react-router-dom"; 29 | import { useEffect } from "react"; 30 | import { useDispatch, useSelector } from "react-redux"; 31 | import { 32 | getCurrentUserData, 33 | getUsersListData, 34 | updateCurrentUserData, 35 | updateUsersListData, 36 | } from "../Redux/Admin/Admin.action"; 37 | 38 | export default function ProfileSection() { 39 | const dispatch = useDispatch(); 40 | const { usersListData, currentUserData } = useSelector( 41 | (store) => store.adminManager 42 | ); 43 | 44 | useEffect(() => { 45 | dispatch(getUsersListData()); 46 | dispatch(getCurrentUserData()); 47 | }, [dispatch]); 48 | //console.log("CrU",currentUserData); 49 | 50 | let booleanValue = Boolean(currentUserData.isAuth); 51 | 52 | const handleLogout = () => { 53 | for (let i = 0; i < usersListData.length; i++) { 54 | let el = usersListData[i]; 55 | if ( 56 | el.email === currentUserData.email && 57 | el.name === currentUserData.name && 58 | currentUserData.password === el.password 59 | ) { 60 | dispatch(updateUsersListData(el.id, false)).then(() => 61 | dispatch(getUsersListData()) 62 | ); 63 | dispatch(updateCurrentUserData(false)).then(() => 64 | dispatch(getCurrentUserData()) 65 | ); 66 | } 67 | //console.log("b",booleanValue); 68 | booleanValue = Boolean(currentUserData.isAuth); 69 | } 70 | }; 71 | return ( 72 | 73 | 74 | 75 | 91 | 92 | 93 | 94 | 95 | 96 | 107 | 120 | 133 | 144 | 155 | 166 | 184 | 195 | 206 | 217 | 231 | 232 | 233 | 234 | 235 | 236 | ); 237 | } 238 | -------------------------------------------------------------------------------- /src/Redux/Admin/Admin.action.js: -------------------------------------------------------------------------------- 1 | import { 2 | deleteAdminKidsdataAPI, 3 | deleteAdminMensdataAPI, 4 | deleteAdminWomensdataAPI, 5 | deleteUsersListdataAPI, 6 | getAdminDataAPI, 7 | getAdminKidsdataAPI, 8 | getAdminMensdataAPI, 9 | getAdminWomensdataAPI, 10 | getCurrentUserAPI, 11 | getUsersListAPI, 12 | postAdminKidsdataAPI, 13 | postAdminMensdataAPI, 14 | postAdminWomensdataAPI, 15 | postCurrentUserAPI, 16 | postUsersListAPI, 17 | updateAdminContactAPI, 18 | updateAdminEmailAPI, 19 | updateAdminKidsdataAPI, 20 | updateAdminMensdataAPI, 21 | updateAdminNameAPI, 22 | updateAdminPasswordAPI, 23 | updateAdminWomensdataAPI, 24 | updateCurrentUserAPI, 25 | updateUsersListAPI, 26 | } from "./Admin.api"; 27 | import { 28 | ADD_ADMIN_CONTACT, 29 | ADD_ADMIN_EMAIL, 30 | ADD_ADMIN_NAME, 31 | ADD_ADMIN_PASSWORD, 32 | ADD_CURRENT_USER, 33 | ADD_KIDS_SUCCESS, 34 | ADD_MENS_SUCCESS, 35 | ADD_USERSLIST_DATA, 36 | ADD_WOMENS_SUCCESS, 37 | DELETE_PRODUCT_KIDS, 38 | DELETE_PRODUCT_MENS, 39 | DELETE_PRODUCT_WOMENS, 40 | DELETE_USERSLIST_DATA, 41 | GET_ADMINDATA_SUCCESS, 42 | GET_CURRENT_USER, 43 | GET_KIDS_SUCCESS, 44 | GET_MENS_SUCCESS, 45 | GET_PRODUCTS_ERROR, 46 | GET_PRODUCTS_LOADING, 47 | GET_USERSLIST_SUCCESS, 48 | GET_WOMENS_SUCCESS, 49 | UPDATE_CURRENT_USER, 50 | UPDATE_PRODUCT_KIDS, 51 | UPDATE_PRODUCT_MENS, 52 | UPDATE_PRODUCT_WOMENS, 53 | UPDATE_USERSLIST_DATA, 54 | } from "./Admin.type"; 55 | 56 | //POST_FUNCTION 57 | export const postMensData = (mensProduct) => async (dispatch) => { 58 | console.log("Men", mensProduct); 59 | dispatch({ type: GET_PRODUCTS_LOADING }); 60 | try { 61 | await postAdminMensdataAPI(mensProduct); 62 | dispatch({ type: ADD_MENS_SUCCESS }); 63 | } catch (error) { 64 | dispatch({ type: GET_PRODUCTS_ERROR }); 65 | } 66 | }; 67 | 68 | export const postWomensData = (womensProduct) => async (dispatch) => { 69 | console.log("Women", womensProduct); 70 | dispatch({ type: GET_PRODUCTS_LOADING }); 71 | try { 72 | await postAdminWomensdataAPI(womensProduct); 73 | dispatch({ type: ADD_WOMENS_SUCCESS }); 74 | } catch (error) { 75 | dispatch({ type: GET_PRODUCTS_ERROR }); 76 | } 77 | }; 78 | 79 | export const postKidsData = (kidsProduct) => async (dispatch) => { 80 | console.log("Kid", kidsProduct); 81 | dispatch({ type: GET_PRODUCTS_LOADING }); 82 | try { 83 | await postAdminKidsdataAPI(kidsProduct); 84 | dispatch({ type: ADD_KIDS_SUCCESS }); 85 | } catch (error) { 86 | dispatch({ type: GET_PRODUCTS_ERROR }); 87 | } 88 | }; 89 | 90 | export const postUsersListData=(User)=>async(dispatch)=>{ 91 | dispatch({type:GET_PRODUCTS_LOADING}) 92 | try { 93 | await postUsersListAPI(User); 94 | dispatch({type:ADD_USERSLIST_DATA}) 95 | } catch (error) { 96 | dispatch({type:GET_PRODUCTS_ERROR}) 97 | } 98 | } 99 | 100 | export const postCurrentUserData=(currentUser)=>async(dispatch)=>{ 101 | dispatch({type:GET_PRODUCTS_LOADING}) 102 | try { 103 | await postCurrentUserAPI(currentUser); 104 | dispatch({type:ADD_CURRENT_USER}) 105 | } catch (error) { 106 | dispatch({type:GET_PRODUCTS_ERROR}) 107 | } 108 | } 109 | 110 | 111 | // GET-FUNCTION 112 | export const getMensData = () => async (dispatch) => { 113 | dispatch({ type: GET_PRODUCTS_LOADING }); 114 | try { 115 | let data = await getAdminMensdataAPI(); 116 | dispatch({ type: GET_MENS_SUCCESS, payload: data }); 117 | } catch (error) { 118 | dispatch({ type: GET_PRODUCTS_ERROR }); 119 | } 120 | }; 121 | 122 | export const getWomensData = () => async (dispatch) => { 123 | dispatch({ type: GET_PRODUCTS_LOADING }); 124 | try { 125 | let data = await getAdminWomensdataAPI(); 126 | dispatch({ type: GET_WOMENS_SUCCESS, payload: data }); 127 | } catch (error) { 128 | dispatch({ type: GET_PRODUCTS_ERROR }); 129 | } 130 | }; 131 | 132 | export const getKidsData = () => async (dispatch) => { 133 | dispatch({ type: GET_PRODUCTS_LOADING }); 134 | try { 135 | let data = await getAdminKidsdataAPI(); 136 | dispatch({ type: GET_KIDS_SUCCESS, payload: data }); 137 | } catch (error) { 138 | dispatch({ type: GET_PRODUCTS_ERROR }); 139 | } 140 | }; 141 | 142 | export const getUsersListData = () => async (dispatch) => { 143 | dispatch({ type: GET_PRODUCTS_LOADING }); 144 | try { 145 | let data = await getUsersListAPI(); 146 | dispatch({ type: GET_USERSLIST_SUCCESS, payload: data }); 147 | } catch (error) { 148 | dispatch({ type: GET_PRODUCTS_ERROR }); 149 | } 150 | }; 151 | 152 | export const getAdminData = () => async (dispatch) => { 153 | dispatch({ type: GET_PRODUCTS_LOADING }); 154 | try { 155 | let data = await getAdminDataAPI(); 156 | dispatch({ type: GET_ADMINDATA_SUCCESS, payload: data }); 157 | } catch (error) { 158 | dispatch({ type: GET_PRODUCTS_ERROR }); 159 | } 160 | }; 161 | 162 | export const getCurrentUserData=()=>async(dispatch)=>{ 163 | dispatch({type:GET_PRODUCTS_LOADING}) 164 | try { 165 | let data = await getCurrentUserAPI(); 166 | dispatch({type:GET_CURRENT_USER,payload:data}) 167 | } catch (error) { 168 | dispatch({type:GET_PRODUCTS_ERROR}) 169 | } 170 | } 171 | 172 | 173 | //DELETE-FUNCTION 174 | export const deleteMensData = (id) => async (dispatch) => { 175 | dispatch({ type: GET_PRODUCTS_LOADING }); 176 | try { 177 | await deleteAdminMensdataAPI(id); 178 | dispatch({ type: DELETE_PRODUCT_MENS }); 179 | } catch (error) { 180 | dispatch({ type: GET_PRODUCTS_ERROR }); 181 | } 182 | }; 183 | 184 | export const deleteWomensData = (id) => async (dispatch) => { 185 | dispatch({ type: GET_PRODUCTS_LOADING }); 186 | try { 187 | await deleteAdminWomensdataAPI(id); 188 | dispatch({ type: DELETE_PRODUCT_WOMENS }); 189 | } catch (error) { 190 | dispatch({ type: GET_PRODUCTS_ERROR }); 191 | } 192 | }; 193 | 194 | export const deleteUsersListData = (id) => async (dispatch) => { 195 | dispatch({ type: GET_PRODUCTS_LOADING }); 196 | try { 197 | await deleteUsersListdataAPI(id); 198 | dispatch({ type: DELETE_USERSLIST_DATA }); 199 | } catch (error) { 200 | dispatch({ type: GET_PRODUCTS_ERROR }); 201 | } 202 | }; 203 | 204 | export const deleteKidsData = (id) => async (dispatch) => { 205 | dispatch({ type: GET_PRODUCTS_LOADING }); 206 | try { 207 | await deleteAdminKidsdataAPI(id); 208 | dispatch({ type: DELETE_PRODUCT_KIDS }); 209 | } catch (error) { 210 | dispatch({ type: GET_PRODUCTS_ERROR }); 211 | } 212 | }; 213 | 214 | //UPDATE-FUNCTION 215 | export const updateMensData = 216 | (id, newPrice, newDiscount, newSrikePrice) => async (dispatch) => { 217 | dispatch({ type: GET_PRODUCTS_LOADING }); 218 | try { 219 | await updateAdminMensdataAPI(id, newPrice, newDiscount, newSrikePrice); 220 | dispatch({ type: UPDATE_PRODUCT_MENS }); 221 | } catch (error) { 222 | dispatch({ type: GET_PRODUCTS_ERROR }); 223 | } 224 | }; 225 | 226 | export const updateWomensData = 227 | (id, newPrice, newDiscount, newSrikePrice) => async (dispatch) => { 228 | dispatch({ type: GET_PRODUCTS_LOADING }); 229 | try { 230 | await updateAdminWomensdataAPI(id, newPrice, newDiscount, newSrikePrice); 231 | dispatch({ type: UPDATE_PRODUCT_WOMENS }); 232 | } catch (error) { 233 | dispatch({ type: GET_PRODUCTS_ERROR }); 234 | } 235 | }; 236 | 237 | export const updateKidsData = 238 | (id, newPrice, newDiscount, newSrikePrice) => async (dispatch) => { 239 | dispatch({ type: GET_PRODUCTS_LOADING }); 240 | try { 241 | await updateAdminKidsdataAPI(id, newPrice, newDiscount, newSrikePrice); 242 | dispatch({ type: UPDATE_PRODUCT_KIDS }); 243 | } catch (error) { 244 | dispatch({ type: GET_PRODUCTS_ERROR }); 245 | } 246 | }; 247 | 248 | export const updateAdminName = (data) => async (dispatch) => { 249 | dispatch({ type: GET_PRODUCTS_LOADING }); 250 | try { 251 | await updateAdminNameAPI(data); 252 | dispatch({ type: ADD_ADMIN_NAME }); 253 | } catch (error) { 254 | dispatch({ type: GET_PRODUCTS_ERROR }); 255 | } 256 | }; 257 | 258 | export const updateAdminEmail = (data) => async (dispatch) => { 259 | dispatch({ type: GET_PRODUCTS_LOADING }); 260 | try { 261 | await updateAdminEmailAPI(data); 262 | dispatch({ type: ADD_ADMIN_EMAIL }); 263 | } catch (error) { 264 | dispatch({ type: GET_PRODUCTS_ERROR }); 265 | } 266 | }; 267 | 268 | export const updateAdminContact = (data) => async (dispatch) => { 269 | dispatch({ type: GET_PRODUCTS_LOADING }); 270 | try { 271 | await updateAdminContactAPI(data); 272 | dispatch({ type: ADD_ADMIN_CONTACT }); 273 | } catch (error) { 274 | dispatch({ type: GET_PRODUCTS_ERROR }); 275 | } 276 | }; 277 | 278 | export const updateAdminPassword = (data) => async (dispatch) => { 279 | dispatch({ type: GET_PRODUCTS_LOADING }); 280 | try { 281 | await updateAdminPasswordAPI(data); 282 | dispatch({ type: ADD_ADMIN_PASSWORD }); 283 | } catch (error) { 284 | dispatch({ type: GET_PRODUCTS_ERROR }); 285 | } 286 | }; 287 | 288 | export const updateUsersListData = (id,state) => async (dispatch) => { 289 | dispatch({ type: GET_PRODUCTS_LOADING }); 290 | try { 291 | await updateUsersListAPI(id,state); 292 | dispatch({ type: UPDATE_USERSLIST_DATA}); 293 | } catch (error) { 294 | dispatch({ type: GET_PRODUCTS_ERROR }); 295 | } 296 | }; 297 | 298 | export const updateCurrentUserData=(state)=>async(dispatch)=>{ 299 | dispatch({type:GET_PRODUCTS_LOADING}) 300 | try { 301 | await updateCurrentUserAPI(state); 302 | dispatch({type:UPDATE_CURRENT_USER}) 303 | } catch (error) { 304 | dispatch({type:GET_PRODUCTS_ERROR}) 305 | } 306 | } 307 | --------------------------------------------------------------------------------