Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

final code #91

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

final code #91

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions minishop/.gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
/node_modules
/.pnp
.pnp.js
/.env

# testing
/coverage
Expand Down
37 changes: 14 additions & 23 deletions minishop/src/Pages/Cart/Cart.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,19 +18,12 @@ import {
} from "@chakra-ui/react";
import React, { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import {
cartActions
} from "../../redux/Cart/Cart.actions";
import "./Cart.scss";
import { AiFillDelete } from "react-icons/ai";
import { Link, useNavigate } from "react-router-dom";
import Navbar from "../../components/Navbar/Navbar";
import { updateUser} from "../../redux/AddUser/User.actions";
import { updateUser } from "../../redux/Auth/auth.actions";
const Cart = () => {
const {loading,user} = useSelector(val=>val?.userAllData)
const currUser = user
const cartData = currUser.cart

const { isOpen, onOpen, onClose } = useDisclosure();
const handelOnSubtmi=()=>{
onClose()
Expand All @@ -39,7 +32,8 @@ const Cart = () => {
const {totalPrice} = useSelector((store) => store.cart);

const dispatch = useDispatch();
const {userData } = useSelector((val) => val.authUser);
const {userData,loading } = useSelector((val) => val.authUser);
const cartData = userData.cart
const changePrice = (str) => {
let res = str.replace(/\D/g, "");
return parseInt(res);
Expand All @@ -55,11 +49,10 @@ const Cart = () => {
);
}
useEffect(() => {
dispatch(cartActions(userData.name))
updatePrice()
// }
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [dispatch, cartData?.length, totalPrice, userData.name]);
}, [cartData?.length, totalPrice, userData.name]);

const toast = useToast();
//------Offer Function-------------------- //
Expand Down Expand Up @@ -95,19 +88,18 @@ const toast = useToast();
// --------------------------Delete cart item ----------------
const deleteCartItem = (el)=>{
// eslint-disable-next-line array-callback-return
let cartUpdate = currUser.cart.filter(e=>{
let cartUpdate = userData.cart.filter(e=>{
if(e.id!==el.id){
return el
}
})
currUser.cart = cartUpdate
dispatch(updateUser(currUser)).then(()=>dispatch(cartActions).then(()=>updatePrice()))
userData.cart = cartUpdate
dispatch(updateUser(userData.id,{cart:userData.cart})).then(()=>updatePrice())
}

const nav = useNavigate()
//-------------------Price Details hide Function----------------- //
const paymentFun = () => {
if(user.cart?.length===0){
if(userData.cart?.length===0){
toast({
title: "Cart Is Empty",
description: "Nothing To ckeckout",
Expand All @@ -118,36 +110,35 @@ const nav = useNavigate()
isClosable: true,
});
}else{
dispatch(updateUser({...user,orders:cartData,cart:[]}))
dispatch(updateUser(userData.id,{orders:cartData,cart:[]}))
nav('/address')
}
}
//------Quantity Increase Function---------------------------------- //
const quantityIncre = async(el) => {
currUser.cart.map(e=>{
userData.cart.map(e=>{
if(e.id===el.id){
e.qty=e.qty+1;
return e
}else{
return e
}
})
dispatch(updateUser(currUser)).then(()=> {
dispatch(cartActions());
dispatch(updateUser(userData.id,{cart:userData.cart})).then(()=> {
})
updatePrice()
}
//------Quantity Decrease Function------------------------------ //
const quantityDecre = async(el) => {
currUser.cart.map(e=>{
userData.cart.map(e=>{
if(e.id===el.id){
e.qty=e.qty-1;
return e
}else{
return e
}
})
dispatch(updateUser(currUser))
dispatch(updateUser(userData.id,{cart:userData.cart}))
updatePrice()
}

Expand Down Expand Up @@ -288,7 +279,7 @@ const nav = useNavigate()
textAlign: "left",
}}
>
<h3>You can Apply only one Once </h3>
<h3>You can Apply only Once </h3>
</div>
</div>
<div className="checkoutDiv">
Expand Down
52 changes: 0 additions & 52 deletions minishop/src/Pages/Cart/CartComponent.jsx
View file
Open in desktop

This file was deleted.

30 changes: 9 additions & 21 deletions minishop/src/Pages/Home/Home.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,10 @@

body {
margin: 0;
pad: 0;
/* border: 1px solid red; */
box-sizing: border-box;
}

.container {
/* width: 1000vw; */
/* width: 100vw; */
display: flex;
gap: 9px;
gap: 20px;
flex-wrap: wrap;
justify-content: center;
/* border: 2px solid red; */
}
}

.cord {
position: relative;
Expand All @@ -28,9 +19,9 @@ body {
box-shadow: inset 300px 0 50px rgba(0, 0, 0, 0.5);
border: 1px dotted gray;
}

.firstName {
color: black;
color: black;
font-weight: bolder;
box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}
Expand Down Expand Up @@ -64,7 +55,6 @@ body {
width: 100%;
height: 100%;
padding: 10px;

}

.cord:hover .imgBox {
Expand All @@ -85,8 +75,7 @@ body {
object-fit: cover;
justify-content: space-around;
align-items: center;

}
}

.details h3 {
color: rgb(0, 0, 0);
Expand All @@ -100,7 +89,6 @@ body {
font-size: 17px;
font-weight: bolder;
margin: auto;

}

.heart {
Expand Down Expand Up @@ -143,12 +131,12 @@ body {
}

@media (max-width: 768px) {
.cord{
.cord {
width: 310px;
height: 350px;
height: 350px;
}
.details h3 {
font-size: 30px;
font-size: 30px;
}
.details h5 {
font-size: 20px;
Expand Down
48 changes: 23 additions & 25 deletions minishop/src/Pages/Home/Home.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,11 +35,22 @@ function Home() {
<Box mt='65px' >
<HomeCarouselDemo/>
<Box w='100%' m={'auto'} >
{loading ? <Loaderskeleton/> : <Box >
<Heading style={{color:"#232f3e",textAlign:"center" }}>T-Shirt</Heading>
{loading ? <Loaderskeleton/> : <Box>
<Heading style={{color:"#232f3e",textAlign:"center" }}>Electronics</Heading>
<HomeProducts
data={Alldata.filter((item) => item.Categories === "t_shirt")}/>
</Box> }
data={Alldata.filter((item) => item.Categories === "Headphones")}/>
</Box>}
{loading ? <Loaderskeleton/> : <Box>
<Heading style={{color:"#232f3e",}}>Mobiles</Heading>
<HomeProducts
data={Alldata.filter((item) => item.Categories === "mobile")}/>
</Box>}
<Image m={'auto'} src="https://cdn.shopify.com/s/files/1/0057/8938/4802/files/WSC-Desktop_dad0fc88-3fc8-4ed8-becb-b7901e4b37f4_1400x.jpg?v=1673853393" alt='3'/>
{loading ? <Loaderskeleton/> : <Box>
<Heading style={{color:"#232f3e",textAlign:"center" }}>Watch</Heading>
<HomeProducts
data={Alldata.filter((item) => item.Categories === "watch")}/>
</Box>}
<Box mt='10px' mb='10px' >
<Similer data={Alldata.filter((item) => item.Categories === "shoes")} />
</Box>
Expand All @@ -53,7 +64,7 @@ function Home() {
<HomeProducts
data={Alldata.filter((item) => item.Categories === "Jacket")}/>
</Box>}
<Box mt='15px' mb='10px' backgroundColor={'white'} >
<Box mt='15px' mb='10px' backgroundColor={'white'} w='98%' margin={'auto'} >
<Carousel
dots= {false} infinite= {true}
slidesToShow = {4}
Expand All @@ -67,30 +78,17 @@ function Home() {
<HomeProducts
data={Alldata.filter((item) => item.Categories === "bags")} />
</Box>}
<Box mt='10px' mb='10px' >
<Box my='20'>
<Similer data={Alldata.filter((item) => item.Categories === "t_shirt")} />
</Box>
<Box w={"100%"} m={"auto"} mt='15px' mb='15px' border='2px' >
<Image src="https://cdn.shopify.com/s/files/1/0057/8938/4802/files/WSC-Desktop_dad0fc88-3fc8-4ed8-becb-b7901e4b37f4_1400x.jpg?v=1673853393" alt='3'/>
</Box>
{loading ? <Loaderskeleton/> : <Box>
<Heading style={{color:"#232f3e",textAlign:"center" }}>Watch</Heading>
<HomeProducts
data={Alldata.filter((item) => item.Categories === "watch")}/>
</Box>}
<Box w={"100%"} m={"auto"} mt='15px' mb='15px' border='2px' >
<Image src="https://cdn.shopify.com/s/files/1/0057/8938/4802/files/2000x650_f60dcd57-3f35-4f38-a32f-3f9666996225_1400x.jpg?v=1673538078" alt='4'/>
<Box w={"100%"} my='10'>
<Image src="https://cdn.shopify.com/s/files/1/0057/8938/4802/files/2000x650_f60dcd57-3f35-4f38-a32f-3f9666996225_1400x.jpg?v=1673538078" m={"auto"} alt='4'/>
</Box>
{loading ? <Loaderskeleton/> : <Box>
<Heading style={{color:"#232f3e",textAlign:"center" }}>Headphones</Heading>
<HomeProducts
data={Alldata.filter((item) => item.Categories === "Headphones")}/>
</Box>}
{loading ? <Loaderskeleton/> : <Box>
<Heading style={{color:"#232f3e",textAlign:"center" }}>Mobiles</Heading>
{loading ? <Loaderskeleton/> : <Box >
<Heading style={{color:"#232f3e",textAlign:"center" }}>T-Shirt</Heading>
<HomeProducts
data={Alldata.filter((item) => item.Categories === "mobile")}/>
</Box>}
data={Alldata.filter((item) => item.Categories === "t_shirt")}/>
</Box> }
{loading ? <Loaderskeleton/> : <Box>
<Heading style={{color:"#232f3e",textAlign:"center" }}>Shoes</Heading>
<HomeProducts
Expand Down
13 changes: 5 additions & 8 deletions minishop/src/Pages/Home/HomeProducts.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,17 @@
import { useToast } from "@chakra-ui/react";
import axios from "axios";
import "./Home.css";

import { BsFillHeartFill, BsHeart } from "react-icons/bs";
import { useDispatch, useSelector } from "react-redux";
import { Link} from "react-router-dom";
import { updateUser } from "../../redux/AddUser/User.actions";
import { updateUser } from "../../redux/Auth/auth.actions";
export default function HomeProducts(data) {
const {user} = useSelector(val=>val?.userAllData)
const {userData } = useSelector((val) => val.authUser);
const user = userData
const wishData = user?.wishlist
const toast = useToast();
const likeFuc = (itemDetail) => {
user.wishlist.push(itemDetail)
dispatch(updateUser(user))

user?.wishlist?.push(itemDetail)
dispatch(updateUser(user.id,{wishlist:user.wishlist}))
toast({
title: "Added to wishlist",
description: "We've added this item to wishlist",
Expand All @@ -22,7 +20,6 @@ export default function HomeProducts(data) {
duration: 3000,
isClosable: true,
});
return axios.post(`https://lackadaisical-volcano-larch.glitch.me/wishlist`, itemDetail);
};
const dispatch = useDispatch();
return (
Expand Down
7 changes: 4 additions & 3 deletions minishop/src/Pages/Order/DelOrderModal.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,18 @@ import { ModalCloseButton, ModalContent, ModalOverlay, Text,} from '@chakra-ui/r
import React from 'react'
import { Button, ModalBody, ModalFooter, ModalHeader } from 'react-bootstrap'
import { useDispatch, useSelector } from 'react-redux'
import { updateUser } from '../../redux/AddUser/User.actions'
import { updateUser } from '../../redux/Auth/auth.actions'

const DelOrderModal = ({onClose,data}) => {
const {loading,user} = useSelector(val=>val?.userAllData)
const { loading,userData } = useSelector((val) => val.authUser);
const user = userData
const dispatch = useDispatch();
const handleDelete = ()=>{
// eslint-disable-next-line array-callback-return
let updatedOrders = user.orders.filter(el=>{
if(el.id!==data.id){return el}
})
dispatch(updateUser({...user,orders:updatedOrders}))
dispatch(updateUser(user.id,{orders:updatedOrders}))
.then(()=>onClose())
}
return (
Expand Down
4 changes: 3 additions & 1 deletion minishop/src/Pages/Order/Order.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,9 @@ import { useState } from "react";
import { useSelector } from "react-redux";

const Order = () => {
const { user } = useSelector((val) => val?.userAllData);
// const { user } = useSelector((val) => val?.userAllData);
const {userData } = useSelector((val) => val.authUser);
const user = userData
const orderData = user.orders;
let today = new Date();
let date =
Expand Down
Loading