Skip to content

Commit

Permalink
new features add
Browse files Browse the repository at this point in the history
  • Loading branch information
mkhedre committed Apr 4, 2022
1 parent 4974cfa commit 1ff69fb
Show file tree
Hide file tree
Showing 6 changed files with 741 additions and 155 deletions.
20 changes: 20 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"aos": "^2.3.4",
"axios": "^0.21.1",
"bootstrap": "^4.6.0",
"react": "^17.0.2",
Expand Down
116 changes: 57 additions & 59 deletions src/App.js
Original file line number Diff line number Diff line change
@@ -1,63 +1,62 @@
import Header from './components/Layout/Header';
import React from 'react';
import Products from './components/Products';
import { Switch, Route } from 'react-router-dom';
import Product from './components/Product';
import Cart from './components/Cart';
import Checkout from './components/Checkout';
import Signin from './components/Signin';
import Account from './components/Account';
import Footer from './components/Layout/Footer';
import Order from './components/Order'
import Payment from './components/Payment';
import OrderSuccess from './components/OrderSuccess';
import OrderHistory from './components/OrderHistory';
import EditProfile from './components/EditProfile';
import Header from "./components/Layout/Header";
import React, { useEffect } from "react";
import Products from "./components/Products";
import { Switch, Route } from "react-router-dom";
import Product from "./components/Product";
import Cart from "./components/Cart";
import Checkout from "./components/Checkout";
import Signin from "./components/Signin";
import Account from "./components/Account";
import Footer from "./components/Layout/Footer";
import Order from "./components/Order";
import Payment from "./components/Payment";
import OrderSuccess from "./components/OrderSuccess";
import OrderHistory from "./components/OrderHistory";
import EditProfile from "./components/EditProfile";

function App() {
return (
<>
<Header />
<Switch>
<Route path='/profile/edit'>
<EditProfile/>
return (
<>
<Header />
<Switch>
<Route path='/profile/edit'>
<EditProfile />
</Route>
<Route path='/orders/history' exact>
<OrderHistory />
</Route>
<Route path='/order/:id/success' exact>
<OrderSuccess />
</Route>
<Route path='/order/:id' exact>
<Payment />
</Route>

</Route>
<Route path="/orders/history" exact>
<OrderHistory/>
</Route>
<Route path="/order/:id/success" exact>
<OrderSuccess />
</Route>
<Route path="/order/:id" exact>
<Payment />
</Route>

<Route path="/cart/checkout/order" exact>
<Order />
</Route>
<Route path="/customer/account" exact>
<Account />
</Route>
<Route path="/signin" exact>
<Signin />
</Route>
<Route path="/cart/checkout" exact>
<Checkout />
</Route>
<Route path="/cart" exact>
<Cart />
</Route>
<Route path="/" exact>
<Products />
</Route>
<Route path="/:id" exact>
<Product />
</Route>
</Switch>
<Footer />
</>
);
<Route path='/cart/checkout/order' exact>
<Order />
</Route>
<Route path='/customer/account' exact>
<Account />
</Route>
<Route path='/signin' exact>
<Signin />
</Route>
<Route path='/cart/checkout' exact>
<Checkout />
</Route>
<Route path='/cart' exact>
<Cart />
</Route>
<Route path='/' exact>
<Products />
</Route>
<Route path='/:id' exact>
<Product />
</Route>
</Switch>
<Footer />
</>
);
}

export default App;
Expand All @@ -67,5 +66,4 @@ export default App;
<Product />
</Route> */


/* */
/* */
49 changes: 25 additions & 24 deletions src/components/Layout/Footer.js
Original file line number Diff line number Diff line change
@@ -1,29 +1,30 @@
const Footer = () => {
return (
<>
<footer
style={{
backgroundColor: 'green',
height: '5vh',
return (
<>
<footer
style={{
backgroundColor: "green",
height: "5vh",

color: 'black',
fontWeight: 'bold',
display: 'flex',
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
position: 'fixed',
bottom: '0',
left: '0',
width: '100%',
color: 'white',
zIndex : '1'
}}
>
Made with <i class="fas fa-heart" style={{ color: 'red', margin: '7px' }}></i> by Pulkit Sharma
</footer>
</>
);
color: "black",
fontWeight: "bold",
display: "flex",
flexDirection: "row",
justifyContent: "center",
alignItems: "center",
position: "fixed",
bottom: "0",
left: "0",
width: "100%",
color: "white",
zIndex: "1",
}}
>
you are welcome{" "}
<i class='fas fa-heart' style={{ color: "red", margin: "7px" }}></i>
</footer>
</>
);
};

export default Footer;
137 changes: 68 additions & 69 deletions src/components/Products.js
Original file line number Diff line number Diff line change
@@ -1,35 +1,33 @@
import { Container, Row, Col, Card, Button } from 'react-bootstrap';
import { useEffect, useState } from 'react';
import axios from 'axios';
import { useHistory } from 'react-router-dom';
import { cartActions } from '../store/CartSlice';
import { useDispatch, useSelector } from 'react-redux';

import { Container, Row, Col, Card, Button } from "react-bootstrap";
import { useEffect, useState } from "react";
import axios from "axios";
import { useHistory } from "react-router-dom";
import { cartActions } from "../store/CartSlice";
import { useDispatch, useSelector } from "react-redux";

const Products = () => {
const [products, setProducts] = useState([]);
const [loading, setLoading] = useState(true);
const {isAuth} = useSelector(state => state.auth);
const history = useHistory();
const dispatch = useDispatch();
useEffect(() => {
const fetch = async () => {

try {
const [products, setProducts] = useState([]);
const [loading, setLoading] = useState(true);
const { isAuth } = useSelector((state) => state.auth);
const history = useHistory();
const dispatch = useDispatch();
useEffect(() => {
const fetch = async () => {
try {
const { data } = await axios.get(
"https://shoppall.herokuapp.com/products"
);
console.log(data);
setProducts(data);
setLoading(false);
} catch (error) {
console.log(error);
}
};

const { data } = await axios.get('https://shoppall.herokuapp.com/products');
console.log(data);
setProducts(data);
setLoading(false);
fetch();

} catch (error) {
console.log(error);
}
};

fetch();

/*const fetchCart = async () => {
/*const fetchCart = async () => {
try {
const { data } = await axios.get('http://localhost:8000/cart');
Expand All @@ -46,49 +44,50 @@ const Products = () => {
fetchCart();
} */


}, []);
}, []);

console.log(products);
console.log(products);

const clickHandler = (id) => {
history.push(id);
};
const clickHandler = (id) => {
history.push(id);
};

return (
<Container style={{ paddingTop: '25px' }}>
{loading ? (
<h2>Loading ....</h2>
) : (
<Row>
{products?.map((product) => {
return (
<Col style={{ paddingBottom: '25px' }}>
<Card style={{ width: '18rem' }}>
<Card.Img variant="top" src={product.image} />
<Card.Body>
<Card.Title>{product.name}</Card.Title>
<Card.Text>
<p>{`Brand - ${product.brand}`}</p>
<h3>{`$${product.price} `}</h3>
<div>
{product.numReviews > 1
? `${product.numReviews} reviews`
: `${product.numReviews} review`}
</div>
</Card.Text>
<Button variant="success" onClick={() => clickHandler(product._id)}>
Know More
</Button>
</Card.Body>
</Card>
</Col>
);
})}
</Row>
)}
</Container>
);
return (
<Container style={{ paddingTop: "25px" }}>
{loading ? (
<h2>Loading ....</h2>
) : (
<Row>
{products?.map((product) => {
return (
<Col style={{ paddingBottom: "25px" }}>
<Card style={{ width: "18rem" }}>
<Card.Img variant='top' src={product.image} />
<Card.Body>
<Card.Title>{product.name}</Card.Title>
<Card.Text>
<p>{`Brand - ${product.brand}`}</p>
<h3>{`$${product.price} `}</h3>
<div>
{product.numReviews > 1
? `${product.numReviews} reviews`
: `${product.numReviews} review`}
</div>
</Card.Text>
<Button
variant='success'
onClick={() => clickHandler(product._id)}
>
Know More
</Button>
</Card.Body>
</Card>
</Col>
);
})}
</Row>
)}
</Container>
);
};
export default Products;
Loading

0 comments on commit 1ff69fb

Please sign in to comment.