Update: Added nodemon and SwaggerJS

hoangsonww · Oct 20, 2024 · 07472a8 · 07472a8
1 parent d09de72
commit 07472a8
Show file tree

Hide file tree

Showing 22 changed files with 37 additions and 376 deletions.
diff --git a/build/android-chrome-192x192.png b/build/android-chrome-192x192.png
diff --git a/build/android-chrome-512x512.png b/build/android-chrome-512x512.png
diff --git a/build/apple-touch-icon.png b/build/apple-touch-icon.png
diff --git a/build/asset-manifest.json b/build/asset-manifest.json
diff --git a/build/favicon-16x16.png b/build/favicon-16x16.png
diff --git a/build/favicon-32x32.png b/build/favicon-32x32.png
diff --git a/build/favicon.ico b/build/favicon.ico
diff --git a/build/index.html b/build/index.html
diff --git a/build/manifest.json b/build/manifest.json
diff --git a/build/robots.txt b/build/robots.txt
diff --git a/build/static/css/main.23cc7afe.css b/build/static/css/main.23cc7afe.css
diff --git a/build/static/css/main.23cc7afe.css.map b/build/static/css/main.23cc7afe.css.map
diff --git a/build/static/js/999.0a44bdc0.chunk.js b/build/static/js/999.0a44bdc0.chunk.js
diff --git a/build/static/js/999.0a44bdc0.chunk.js.map b/build/static/js/999.0a44bdc0.chunk.js.map
diff --git a/build/static/js/main.a9a0490a.js b/build/static/js/main.a9a0490a.js
diff --git a/build/static/js/main.a9a0490a.js.LICENSE.txt b/build/static/js/main.a9a0490a.js.LICENSE.txt
diff --git a/build/static/js/main.a9a0490a.js.map b/build/static/js/main.a9a0490a.js.map
diff --git a/src/assets/images/summer-sale.jpg b/src/assets/images/summer-sale.jpg
diff --git a/src/assets/images/tech-gadgets.jpg b/src/assets/images/tech-gadgets.jpg
diff --git a/src/assets/images/trending-fashion.jpg b/src/assets/images/trending-fashion.jpg
diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx
@@ -2,6 +2,9 @@ import * as React from 'react';
 import { Typography, Grid, Box, Container, Button, CircularProgress, Alert, Paper, styled } from '@mui/material';
 import Carousel from 'react-material-ui-carousel';
 import ProductCard from '../components/ProductCard';
+import summerSaleImage from '../assets/images/summer-sale.jpg';
+import techGadgetsImage from '../assets/images/tech-gadgets.jpg';
+import trendingFashionImage from '../assets/images/trending-fashion.jpg';
 
 const StyledCarousel = styled(Carousel)({
   '& .Carousel-indicators-container': {
@@ -23,17 +26,17 @@ const StyledCarousel = styled(Carousel)({
 function Home({ products, addToCart, error, loading }) {
   const bannerImages = [
     {
-      url: 'https://thumbs.dreamstime.com/b/electronics-sale-banner-devices-online-shopping-delivery-basket-273419752.jpg',
+      url: summerSaleImage,
       title: 'Summer Sale - Up to 50% Off',
       description: 'Shop now for the best deals on summer essentials!',
     },
     {
-      url: 'https://magesolution.com/wp-content/uploads/2022/07/1_7u7eYPpkr5baaBOzYcdNHw.jpeg',
+      url: techGadgetsImage,
       title: 'New Tech Gadgets',
       description: 'Explore the latest in tech and gadgets.',
     },
     {
-      url: 'https://images.pexels.com/photos/3768005/pexels-photo-3768005.jpeg?cs=srgb&dl=pexels-willoworld-3768005.jpg&fm=jpg',
+      url: trendingFashionImage,
       title: 'Trending Fashion',
       description: 'Discover the newest fashion trends for this season.',
     },
@@ -48,7 +51,7 @@ function Home({ products, addToCart, error, loading }) {
         <StyledCarousel
           animation="slide"
           autoPlay={true}
-          interval={5000}
+          interval={2500}
           navButtonsAlwaysVisible={true}
           navButtonsProps={{
             style: {

diff --git a/src/pages/Shop.jsx b/src/pages/Shop.jsx
@@ -1,12 +1,20 @@
 import * as React from 'react';
-import { Grid, Typography, Container, Box, FormControl, InputLabel, Select, MenuItem, Pagination } from '@mui/material';
+import { Grid, Typography, Container, Box, FormControl, InputLabel, Select, MenuItem, Pagination, CircularProgress } from '@mui/material';
 import ProductCard from '../components/ProductCard';
 
 function Shop({ products, addToCart }) {
   const [categoryFilter, setCategoryFilter] = React.useState('all');
   const [page, setPage] = React.useState(1);
+  const [loading, setLoading] = React.useState(true); // Loading state
   const itemsPerPage = 6;
 
+  React.useEffect(() => {
+    // Simulating an API call to fetch products
+    setTimeout(() => {
+      setLoading(false); // Set loading to false after data is loaded
+    }, 1000); // Adjust this timeout to match the actual API call duration
+  }, []);
+
   const uniqueCategories = Array.from(new Set(products.map(product => product.category)));
 
   const filteredProducts = categoryFilter === 'all' ? products : products.filter(product => product.category === categoryFilter);
@@ -26,6 +34,27 @@ function Shop({ products, addToCart }) {
     setPage(1);
   };
 
+  if (loading) {
+    return (
+      <Box
+        sx={{
+          position: 'fixed',
+          top: 0,
+          left: 0,
+          width: '100%',
+          height: '100%',
+          backgroundColor: 'rgba(255, 255, 255, 0.8)',
+          display: 'flex',
+          justifyContent: 'center',
+          alignItems: 'center',
+          zIndex: 1000,
+        }}
+      >
+        <CircularProgress />
+      </Box>
+    );
+  }
+
   return (
     <Container maxWidth="lg">
       <Typography variant="h4" sx={{ my: 2 }}>