Some content is hidden

Large Commits have some content hidden by default. Use the searcx below for content that may be hidden.

43 files changed

+1605
-429
lines changed
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1-
node_modules/
1+
node_modules/
2+
*.log
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
const functions = require('firebase-functions');
1+
const functions = require("firebase-functions");
22

33
// // Create and Deploy Your First Cloud Functions
44
// // https://firebase.google.com/docs/functions/write-firebase-functions
@@ -9,33 +9,40 @@ const functions = require('firebase-functions');
99

1010
const express = require("express");
1111
const cors = require("cors");
12-
const stripe = require("stripe")('sk_test_51HeTtQImEgmfO9dxsYTv9vHitaqlfq2bW9QkRUzO89Uya2IlzyiJxbMiPY0GNF7sfaKMdWw8GarT0oxCjPZ9jTAf00I0kzR0bU');
12+
const stripe = require("stripe")(
13+
"sk_test_51HeTtQImEgmfO9dxsYTv9vHitaqlfq2bW9QkRUzO89Uya2IlzyiJxbMiPY0GNF7sfaKMdWw8GarT0oxCjPZ9jTAf00I0kzR0bU"
14+
);
1315

1416
// - App Config
1517
const app = express();
1618

1719
// - Middlrwares
18-
app.use(cors())
20+
app.use(cors());
1921
app.use(express.json());
2022

2123
// - API Routes
22-
app.get('/', (req, res) => res.status(200).send('welcome'))
24+
app.get("/", (req, res) => res.status(200).send("welcome"));
2325

24-
app.post('/payments/create', async (req, res) => {
25-
const total = req.query.total;
26-
27-
console.log('Payment request received. Amount ->>>', total)
26+
app.post("/payments/create/:total", async (req, res) => {
27+
28+
if (req.params.total > 0) {
29+
// only accept integer
30+
const total = parseFloat(req.params.total).toFixed(0);
31+
console.log("Payment request received. Amount ->>>", total);
2832

2933
const paymentIntent = await stripe.paymentIntents.create({
30-
amount: total,
31-
currency:"usd"
32-
})
33-
34+
amount: total,
35+
currency: "usd",
36+
});
3437
res.status(201).send({
35-
clientSecret: paymentIntent.client_secret
36-
})
37-
})
38+
clientSecret: paymentIntent.client_secret,
39+
});
40+
} else {
41+
res.status(201).send({
42+
clientSecret: 'no session id',
43+
})
44+
}
45+
});
3846

3947
// - Listen Command
40-
exports.api = functions.https.onRequest(app)
41-
48+
exports.amazonStripeApi = functions.https.onRequest(app);
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
"logs": "firebase functions:log"
1111
},
1212
"engines": {
13-
"node": "8"
13+
"node": "12"
1414
},
1515
"dependencies": {
1616
"cors": "^2.8.5",
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,15 @@
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6+
"@ant-design/icons": "^4.3.0",
67
"@brainhubeu/react-carousel": "2.0.1",
78
"@reduxjs/toolkit": "^1.4.0",
89
"@stripe/react-stripe-js": "^1.1.2",
910
"@stripe/stripe-js": "^1.10.0",
1011
"@testing-library/jest-dom": "^4.2.4",
1112
"@testing-library/react": "^9.3.2",
1213
"@testing-library/user-event": "^7.1.2",
14+
"antd": "^4.8.4",
1315
"axios": "^0.20.0",
1416
"bootstrap": "^4.5.2",
1517
"firebase": "^7.23.0",
@@ -21,6 +23,7 @@
2123
"react-bootstrap": "^1.3.0",
2224
"react-currency-format": "^1.0.0",
2325
"react-dom": "^16.13.1",
26+
"react-image-gallery": "^1.0.8",
2427
"react-redux": "^7.2.1",
2528
"react-router-dom": "^6.0.0-beta.0",
2629
"react-scripts": "3.4.3",
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,14 @@
77
@import "./components/card/Card.scss";
88
@import "./components/card/ProductCard.scss";
99
@import "./components/home/ShopBySection.scss";
10-
@import "./components/home/DiscoverSection.scss";
1110
@import "./components/carousel/Carousel.scss";
1211
@import "./components/shop/ShopPage.scss";
1312
@import './components/footer/Footer.scss';
1413
@import './views/auth/Register.scss';
1514
@import './views/auth/Login.scss';
1615
@import './layouts/MainLayout/MainLayout.scss';
1716
@import './layouts/AuthLayout/AuthLayout.scss';
18-
@import './views/checkout//Checkout.scss';
17+
@import './views/checkout/Checkout.scss';
1918
@import './components/card/CheckoutCard.scss';
2019
@import './views/product/Product.scss';
2120
@import './views/payment/Payment.scss';
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
import axios from "axios";
22

33
const instance = axios.create({
4-
baseURL:'http://localhost:5001/-c5c88/us-central1/api'
4+
baseURL:'https://us-central1--c5c88.cloudfunctions.net/amazonStripeApi'
55
})
66

7+
export const source = axios.CancelToken.source();
8+
79
export default instance;
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,18 @@
11
import React from "react";
22
import { Card, Button } from "react-bootstrap";
3+
import RouterLink from "../link/RouterLink";
34

45
const SharedCard = ({ title, imgUrl, linkInfo }) => {
56
return (
67
<div>
78
<Card className="card">
8-
<Card.Body>
9-
<Card.Title>{title}</Card.Title>
10-
<Card.Img variant="top" src={imgUrl} />
11-
<Button variant="link">{linkInfo}</Button>
12-
</Card.Body>
9+
<RouterLink to="/shop">
10+
<Card.Body>
11+
<Card.Title>{title}</Card.Title>
12+
<Card.Img variant="top" src={imgUrl} />
13+
<Button variant="link">{linkInfo}</Button>
14+
</Card.Body>
15+
</RouterLink>
1316
</Card>
1417
</div>
1518
);
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
.card {
2-
min-width: 350px !important;
3-
width: 18rem;
2+
min-width: 320px !important;
3+
width: 320px;
44
}
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ const CheckoutCard = ({
4949
<span>Enable for FREE Delivery </span>
5050
</div>
5151
{
52-
!hiddenAction && <div className="checkout-card__action">
52+
!hiddenAction && <div className="checkout-card__action">
5353
<div className="checkout-card__action__qty">
5454
<Form>
5555
<Form.Group>
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,13 @@
11
.checkout-card {
22
display: flex;
3-
3+
44
&__img {
5+
@include breakpoint(l) {
6+
width: 8rem;
7+
margin: 1rem;
8+
}
59
width: 8rem;
10+
object-fit: contain;
611
margin: 1rem;
712
}
813
&__body {
@@ -48,7 +53,10 @@
4853
}
4954
&__price {
5055
font-weight: 600;
51-
padding-left: 6rem;
56+
@include breakpoint(l) {
57+
padding-left: 6rem;
58+
}
59+
padding-left: .6rem;
5260
}
5361
&__content {
5462
flex-grow: 1;
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,29 @@ import { Card, Button } from "react-bootstrap";
66
import "./Carousel.scss";
77
import RouterLink from "./../link/RouterLink";
88

9-
const SharedCarousel = ({ title, imgs, alt, linkInfo }) => {
9+
const SharedCarousel = ({ title, imgs, alt, linkInfo,id }) => {
10+
11+
let slidesToShow
12+
const width =
13+
window.innerWidth ||
14+
document.documentElement.clientWidth ||
15+
document.body.clientWidth;
16+
if (width > 768) {
17+
slidesToShow = 5
18+
} else if(width ===768) {
19+
slidesToShow = 4
20+
} else {
21+
slidesToShow =1
22+
}
23+
1024
const settings = {
1125
infinite: true,
1226
speed: 500,
13-
slidesToShow: 5,
27+
slidesToShow,
1428
slidesToScroll: 1,
1529
};
30+
31+
1632
return (
1733
<Card className="carousel">
1834
<Card.Body>
@@ -27,7 +43,7 @@ const SharedCarousel = ({ title, imgs, alt, linkInfo }) => {
2743
<Slider {...settings}>
2844
{imgs.map((el, index) => (
2945
<div key={index}>
30-
<RouterLink to="/shop">
46+
<RouterLink to={`/product/${el.id}`}>
3147
<img
3248
src={el.imgUrl}
3349
alt={alt}
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const Footer = () => {
2828
<p>Reload Your Balance</p>
2929
<p>Amazon Currency Converter</p>
3030
</div>
31-
<div>
31+
{/* <div>
3232
<p className="footer__title">Let Us Help You</p>
3333
<p>Amazon and Covid-19</p>
3434
<p>Your Account</p>
@@ -38,7 +38,7 @@ const Footer = () => {
3838
<p>Manage Your Content and Devices</p>
3939
<p>Amazon Assistant</p>
4040
<p>Help</p>
41-
</div>
41+
</div> */}
4242
</div>
4343
<div className="footer__copyright">
4444
<div className="footer__copyright__info">
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
justify-content: space-around;
88
margin: 0 auto;
99
padding: 2rem;
10+
gap: 1rem;
1011
}
1112

1213
&__title {
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from "react";
1+
import React, { useState } from "react";
22
import { selectUser } from "../../redux/userSlice";
33
import { useSelector } from "react-redux";
44
import RouterLink from "../link/RouterLink";
@@ -11,35 +11,87 @@ import { InputGroup, FormControl, Form } from "react-bootstrap";
1111
import { auth } from "../../firebase.utils";
1212
import { selectCartItemsCount } from "../../redux/cartSelector";
1313
import { useNavigate } from "react-router-dom";
14+
import { Drawer,Divider} from "antd";
15+
16+
1417

1518
const Header = () => {
19+
const [showMenu, setShowMenu] = useState(false);
1620
const user = useSelector(selectUser);
1721
const cartCount = useSelector((state) => selectCartItemsCount(state));
1822

23+
1924
const navigate = useNavigate();
2025

26+
2127
const signOut = () => {
2228
if (user) auth.signOut();
2329
};
2430

2531
const handleSearch = (e) => {
26-
e.preventDefault();
27-
navigate("/shop");
32+
e.preventDefault();
33+
navigate("/shop");
2834
};
2935
return (
3036
<>
37+
<Drawer
38+
title={`Hello, ${user ? user.name : "Sign In"}`}
39+
headerStyle={{ backgroundColor: "#232F3E", color: "#fff" }}
40+
width={360}
41+
placement="left"
42+
onClose={() => setShowMenu(false)}
43+
visible={showMenu}
44+
footer={
45+
<div className="menuFooter">
46+
<p>Help & Settings</p>
47+
<p>Account</p>
48+
<p>Customer Service</p>
49+
<p>Sign Out</p>
50+
</div>
51+
}
52+
>
53+
<div className="menu__body">
54+
<p className='menu__body__title'>Treading</p>
55+
<p>Best Sellers</p>
56+
<p>New Releases</p>
57+
<p>Movers and Shakers</p>
58+
<Divider/>
59+
60+
<p className='menu__body__title'>Digital Content And Devices</p>
61+
<p>Amazon Fire TV</p>
62+
<p> Video</p>
63+
<p>Amazon Music</p>
64+
<p>Audible Audiobooks</p>
65+
66+
<Divider />
67+
<p className='menu__body__title'>Shop By Department</p>
68+
<p>Books</p>
69+
<p>Music, Movies & Games</p>
70+
<p>Computers</p>
71+
<p>Electronics</p>
72+
<p>Home</p>
73+
<p>Baby</p>
74+
<p>Toys & Game</p>
75+
<p>Women's Clothing</p>
76+
<p>Men's Clothing</p>
77+
<p>Shoes</p>
78+
79+
</div>
80+
</Drawer>
81+
3182
<div className="header">
3283
<div className="header__menu">
33-
<RouterLink to="/shop">
34-
<Menu className="header__menu__icon" />
35-
</RouterLink>
84+
<Menu
85+
onClick={() => setShowMenu(true)}
86+
className="header__menu__icon"
87+
/>
3688
</div>
3789
<RouterLink to="/">
3890
<div className="header__logo">
3991
<img src={logo} alt="logo" />
4092
</div>
4193
</RouterLink>
42-
<div className="header__search">
94+
<div className="header__search">
4395
<Form>
4496
<InputGroup>
4597
<InputGroup.Prepend>
@@ -69,9 +121,11 @@ const Header = () => {
69121
</div>
70122
</RouterLink>
71123
<RouterLink to="/orders">
72-
<div className="header__nav__option">
124+
<div className="header__nav__option">
73125
<span>returns</span>
74-
<span>&orders</span>
126+
127+
128+
<span>&orders</span>
75129
</div>
76130
</RouterLink>
77131
<RouterLink to="/checkout">
@@ -94,6 +148,8 @@ const Header = () => {
94148
<div className="sub-header__link">
95149
<span>Today's Deals</span>
96150
<span>Customer Service</span>
151+
152+
97153
<span>Gift Cards</span>
98154
<span>Registry</span>
99155
<span>Sell</span>

0 commit comments

Comments
 (0)