Skip to content

Commit

Permalink
updated react-scripts version , replaced Sidebar with Slidebar and ma…
Browse files Browse the repository at this point in the history 
…de filterbar and userbar as children to Slidebar added simple ErrorPage
  • Loading branch information
@redoC-A2k
redoC-A2k committed Jun 14, 2023
1 parent 0468980 commit d8bc88e
Show file tree
Hide file tree
Showing 24 changed files with 32,665 additions and 34,063 deletions.
3 changes: 2 additions & 1 deletion client/.gitignore
View file
Original file line number Diff line number Diff line change
@@ -1 +1,2 @@
node_modules
node_modules
build
45,059 changes: 22,351 additions & 22,708 deletions client/package-lock.json
View file

Large diffs are not rendered by default.

10 changes: 6 additions & 4 deletions client/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,13 @@
"react-dom": "^16.13.1",
"react-redux": "^7.2.1",
"react-router-dom": "^5.2.0",
"react-scripts": "3.4.3",
"react-scripts": "^5.0.1",
"redux": "^4.0.5",
"redux-persist": "^6.0.0",
"redux-thunk": "^2.3.0"
},
"scripts": {
"start": "react-scripts --openssl-legacy-provider start",
"build": "react-scripts --openssl-legacy-provider build",
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
Expand All @@ -36,5 +35,8 @@
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@babel/plugin-proposal-private-property-in-object": "^7.21.11"
}
}
4 changes: 2 additions & 2 deletions client/public/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@
<link rel="icon" href="%PUBLIC_URL%/covidmart_logo_back_transparent.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="Web site created using create-react-app" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<meta name="description" content="CovidMart - A place to meet all you covid precautionary" />
<!-- <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> -->
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
Expand Down
18 changes: 11 additions & 7 deletions client/src/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import UserAdminAuth from "./screens/UserAdminAuth.jsx";
import "./index.css";
import Footer from './components/Footer';
import Toast from './components/Toast';
import ErrorPage from './screens/ErrorPage';

function App() {
return (
Expand All @@ -21,13 +22,16 @@ function App() {
<BrowserRouter>
<Toast/>
<Header/>
<Switch>
{<Route exact path="/auth" component={UserAdminAuth} />
/*<Route exact path="/addproduct" component={AdminPage} />*/}
<Route exact path="/user/cart" component={Cart} />
<Route exact path="/product/:productId" component={Product} />
<Route exact path="/" component={Home} />
</Switch>
<section id="main" className='container'>
<Switch>
<Route exact path="/auth" component={UserAdminAuth} />
{/*<Route exact path="/addproduct" component={AdminPage} />*/}
<Route exact path="/user/cart" component={Cart} />
<Route exact path="/product/:productId" component={Product} />
<Route exact path="/" component={Home} />
<Route path = "*" component={ErrorPage} />
</Switch>
</section>
<Footer/>
</BrowserRouter>
{/* </PersistGate> */}
Expand Down
35 changes: 10 additions & 25 deletions client/src/components/Actions.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,35 +6,23 @@ import {showToast} from '../assets/js/showToast';
// TODO: Make this component responsive on phone
export default function Actions (props) {
// console.log(props.product)
const [isInCart,setIsInCart] = useState(false);

useEffect(()=>{
props.user.cart.map((eachItem)=>{
if(eachItem.productId === props.product._id)
{
setIsInCart(true);
}
else{
setIsInCart(false)
}
})
},[props])
// const [isInCart,setIsInCart] = useState(false);

let handleBuyNow = function() {

}

let handleAddCart = ()=>{
props.addToCart(props.product._id, props.product.price, props.product.title);
setIsInCart(true)
showToast("product added to Cart");
// setIsInCart(true)
showToast("Product Added to Cart");
}

let handleRemoveCart = ()=>{
props.deleteFromCart(props.user._id,props.product._id)
setIsInCart(false);
showToast("product removed from cart");
}
// let handleRemoveCart = ()=>{
// props.deleteFromCart(props.user._id,props.product._id)
// setIsInCart(false);
// showToast("product removed from cart");
// }

let List = function (props) {
return (
Expand Down Expand Up @@ -90,13 +78,10 @@ export default function Actions (props) {
<Ratings product={props.product} />
<hr/>
<div className='btndiv row'>
{/* TODO: Only Allow adding here and increment product when more than once add to cart button has been added */}
<div className="col-sm-7 offset-1">
<button id="buynow" onClick={handleBuyNow} className='type1 w-100'><span className="background"></span><span className='text'>Buy Now</span><span className="fa-solid fa-bag-shopping icon"></span></button>
{isInCart
?
(<button id="removefromcart" onClick={handleRemoveCart} className='type2 w-100'><span className="background"></span><span className='text'>Remove from Cart</span><span className="fa-solid fa-cart-shopping icon"></span></button>)
:
(<button id="addtocart" onClick={handleAddCart} className='type2 w-100'><span className="background"></span><span className='text'>Add to Cart</span><span className="fa-solid fa-cart-shopping icon"></span></button>)}
<button id="addtocart" onClick={handleAddCart} className='type2 w-100'><span className="background"></span><span className='text'>Add to Cart</span><span className="fa-solid fa-cart-shopping icon"></span></button>
</div>
</div>
</div>
Expand Down
156 changes: 76 additions & 80 deletions client/src/components/Cart.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,35 +1,44 @@
import React, { Component, useState } from 'react'
import { useEffect } from 'react';
// import { Row, Col, Button, Divider } from 'antd';
import { connect } from "react-redux";
// import { DeleteOutlined } from '@ant-design/icons';
import { deleteProductFromCart } from '../redux/ActionCreators/deleteProductFromCart'
import { fetchcart } from '../redux/ActionCreators/fetchCart';
import Header from './Header';
import { Link } from 'react-router-dom/cjs/react-router-dom';


const mapStateToProps = state => {
return { mycart: state.cart }
}
const mapDispatchToProps = dispatch => {
return {
fetchcart: () => { dispatch(fetchcart()) },
deleteProductFromCart: (userId, productId) => { dispatch(deleteProductFromCart(userId, productId)) }
fetchcart: (setPrice) => { dispatch(fetchcart(setPrice)) },
deleteProductFromCart: (userId, productId, setPrice) => { dispatch(deleteProductFromCart(userId, productId, setPrice)) }
}
}
function Cart(props) {
const [totalprice,setTotalPrice] = useState(0)

function setPrice(price){
setTotalPrice(price);
}

// function setCart(newCart){
// setUserCart(newCart);
// }


useEffect(()=>{
console.log("fetching ..")
props.fetchcart()
//razorpay script loading
// console.log("fetching ..")
props.fetchcart(setPrice)
//razorpay scrript loading
const script = document.createElement("script");
script.src = "https://checkout.razorpay.com/v1/checkout.js";
script.async = true;
document.body.appendChild(script);
},[])

let openPayModal = (amount, fetchcart, setTotalpricezero) => {

let openPayModal = (amount, fetchcart, setPrice) => {
amount = amount * 100;
amount = Math.ceil(amount)
let options = {
Expand All @@ -55,8 +64,7 @@ function Cart(props) {
.then(data => {
if (data.message === "ok") {
console.log("if runs")
fetchcart()
setTotalpricezero()
fetchcart(setPrice)
alert("Payment successful")
}
})
Expand All @@ -82,80 +90,68 @@ function Cart(props) {
}

let setTotalpricezero = () => {
setTotalPrice(0
// window.location.reload()
)
setTotalPrice(0)
}
let MyCart = () => {
let sum = 0;
if (props.mycart && props.mycart[0].productId != "empty") {
let myproductsarray = props.mycart.map((eachProduct, ind) => {
sum = sum + eachProduct.quantity * eachProduct.price
if ((props.mycart.length - 1 === ind) && (totalprice === 0)) {
setTotalPrice({ totalprice: sum })
}
return (
<div className="row" key={ind} style={{ width: "100%" }}>
<div className="col-4">
{eachProduct.title}
</div>
<div className="col-2">
{eachProduct.quantity}
</div>
<div className='col-2'>
{eachProduct.price}
</div>
<div className='col-2'>
{eachProduct.quantity * eachProduct.price}
</div>
<div className='col-2'>
<span onClick={() => { props.deleteProductFromCart(localStorage.getItem("userId"), eachProduct.productId) }} > Delete </span>
</div>
</div>
)
})
return myproductsarray
}
else {
return (<h4 style={{ textAlign: "center", width: "100%" }}>cart is empty</h4>)
}
}
// if((props.mycart.length-1===ind)&&(state.totalprice===0))
// totalprice=sum
// // setState({totalprice:sum})
return (
<div className='row'style={{ width: "100%" }}>
{/*</div><div style={{ display: 'none' }}>
<Header />
</div>*/}
<div className='col-12'>
<h1 style={{ textAlign: "center" }}>Cart</h1>
</div>
<div className='ro' style={{ width: "100%" }}>
<div className='col-4'>
<h3>Product title</h3>
<section className='container' id="cart">
<div className="row">
<div className='col-12'>
<h2 className='gradient' style={{ textAlign: "center" }}>Cart</h2>
</div>
<div className='col-2'>
<h3>Product qunatity</h3>
</div>
<div className='col-2'>
<h3>Product price</h3>
</div>
{totalprice?
(<div className='row'>
<table className='table hoverable'>
<thead className='dark'>
<tr>
<th scope='col'></th>
<th scope='col'>Product<br/>Title</th>
<th scope='col'>Product<br/>Quantity</th>
<th scope='col'>Product<br/>Price</th>
<th scope='col'>Total<br/>Price</th>
<th></th>
</tr>
</thead>
<tbody>
{props.mycart && props.mycart.length!=0?
props.mycart.map((eachItem,ind)=>{
return (
<tr key={ind}>
<td>{ind+1}</td>
<td><Link to={`/product/${eachItem.productId}`}>{eachItem.title}</Link></td>
<td>{eachItem.quantity}</td>
<td>{eachItem.price}₹</td>
<td>{eachItem.quantity * eachItem.price}₹</td>
<td><i className="fa-regular fa-trash-can" onClick={() => { props.deleteProductFromCart(localStorage.getItem("userId"), eachItem.productId, setPrice) }}> </i></td>
</tr>
)
})
:
<></>}
<tr>
<td></td>
<td></td>
<td></td>
<td style={{fontWeight:600}}>Amount Payable : </td>
<td style={{fontWeight:600}}>{totalprice}₹</td>
<td></td>
</tr>
</tbody>
</table>
<hr />
<div className='row w-100' style={{ justifyContent: "center" }}>
<button className="type1 " onClick={() => {
console.log(totalprice)
openPayModal(totalprice, fetchcart, setPrice)
}}><span className='background'></span><span className='text'>pay</span><span className='fa-solid fa-indian-rupee-sign icon'></span></button>
</div>
<div className='col-2'>
<h3>Total price</h3>
</div>):
( <div className="row">
<div className="col-12">
<center>Cart is Empty</center>
</div>
</div>
<div className='row' style={{ width: "100%" }}>
<MyCart />
</div>
<hr />
<div className='row' style={{ width: "100%", justifyContent: "center" }}>
<button onClick={() => {
console.log(totalprice)
openPayModal(totalprice, fetchcart, setTotalpricezero)
}}>Proceed to pay </button>
</div>
</div>
</div> )}
</section>
)
}

Expand Down
Loading

0 comments on commit d8bc88e

Please sign in to comment.