update

READMEE.md

@@ -78,8 +78,8 @@ PORT=7860
 NODE_ENV=production
 DB_URL=
 JWT_SECRET_KEY=
-APP_URL=https://mkcart2.onrender.com
-FRONTEND_URL=https://mkcart2.onrender.com
+APP_URL=https://kumar715-mkcart.hf.space
+FRONTEND_URL=https://kumar715-mkcart.hf.space
 ```
 
 #### Frontend (`frontend/.env`)

frontend/src/components/ItemSection.jsx

@@ -57,7 +57,7 @@ export default function ItemSection() {
 
   useEffect(() => {
     fetch(
-      `${process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com"}/api/products`,
+      `${process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space"}/api/products`,
     )
       .then((res) => res.json())
       .then((data) => {
@@ -276,14 +276,14 @@ export default function ItemSection() {
   return (
     <>
       <div className="modern-item-section">
-        {}
+        { }
         <motion.div
           className="hero-section"
           initial={{ opacity: 0, y: 50 }}
           animate={{ opacity: 1, y: 0 }}
           transition={{ duration: 0.8 }}
         >
-          {}
+          { }
           <div className="hero-floating-animations">
             {[...Array(10)].map((_, i) => (
               <motion.div
@@ -352,7 +352,7 @@ export default function ItemSection() {
           </div>
         </motion.div>
 
-        {}
+        { }
         {Object.keys(groupedProducts).map((category, categoryIndex) => (
           <motion.div
             key={category}
@@ -382,7 +382,7 @@ export default function ItemSection() {
               {(groupedProducts[category] || []).map((product) => (
                 <div className="modern-product-card" key={product._id}>
                   <div className="product-card-inner">
-                    {}
+                    { }
                     <div className="product-image-container">
                       <Link
                         to={`/product/${product._id}`}
@@ -396,7 +396,7 @@ export default function ItemSection() {
                           transition={{ duration: 0.3 }}
                         />
                       </Link>
-                      {}
+                      { }
                       <motion.button
                         className={`wishlist-btn ${wishlistProductIds.has(product._id) ? "active" : ""}`}
                         onClick={() => toggleWishlist(product._id, product)}
@@ -412,7 +412,7 @@ export default function ItemSection() {
                           }
                         />
                       </motion.button>
-                      {}
+                      { }
                       <motion.div
                         className="quick-view-btn"
                         whileHover={{ scale: 1.1 }}
@@ -422,7 +422,7 @@ export default function ItemSection() {
                         </Link>
                       </motion.div>
                     </div>
-                    {}
+                    { }
                     <div className="product-info">
                       <h1 className="product-title">
                         <Link to={`/product/${product._id}`}>
@@ -452,7 +452,7 @@ export default function ItemSection() {
                           style={{ color: "#00b894", fontWeight: 700 }}
                         >
                           {typeof product.price === "number" &&
-                          !isNaN(product.price)
+                            !isNaN(product.price)
                             ? product.price.toLocaleString()
                             : "N/A"}
                         </span>
@@ -464,7 +464,7 @@ export default function ItemSection() {
                               ? product.description.slice(0, 25) + "..."
                               : product.description
                             : product.description.slice(0, 50) +
-                              (product.description.length > 50 ? "..." : "")}
+                            (product.description.length > 50 ? "..." : "")}
                         </div>
                         <motion.div
                           whileHover={{ scale: 1.08 }}
@@ -478,7 +478,7 @@ export default function ItemSection() {
                           </Link>
                         </motion.div>
                       </div>
-                      {}
+                      { }
                       <div className="item-actions">
                         <motion.button
                           className={`add-to-cart-btn-premium${isInCart(product._id) ? " in-cart" : ""}`}

frontend/src/pages/Home.jsx

@@ -9,9 +9,9 @@ export default function Home() {
 
   useEffect(() => {
     fetch(
-      (process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com") +
-        "/api/products?" +
-        searchParams,
+      (process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space") +
+      "/api/products?" +
+      searchParams,
     )
       .then((res) => res.json())
       .then((res) => {

frontend/src/pages/LoginPage.jsx

@@ -41,8 +41,8 @@ const LoginPage = () => {
   const canvasRef = useRef(null);
   const BACKEND_URL =
     process.env.NODE_ENV === "production"
-      ? (process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com") +
-        "/api"
+      ? (process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space") +
+      "/api"
       : "http://localhost:7860/api";
   const dispatch = useDispatch();
   useEffect(() => {
@@ -239,10 +239,10 @@ const LoginPage = () => {
 
   return (
     <div className="login-page">
-      {}
+      { }
       <canvas ref={canvasRef} className="background-canvas" />
 
-      {}
+      { }
       <div className="floating-particles">
         {particles.map((particle) => (
           <motion.div
@@ -270,10 +270,10 @@ const LoginPage = () => {
         ))}
       </div>
 
-      {}
+      { }
       <div className="login-container">
         <div className="login-grid">
-          {}
+          { }
           <motion.div
             className="login-branding"
             initial={{ opacity: 0, x: -100 }}
@@ -352,7 +352,7 @@ const LoginPage = () => {
               </motion.div>
             </div>
 
-            {}
+            { }
             <div className="branding-decorations">
               <motion.div
                 className="decoration gem-1"
@@ -406,7 +406,7 @@ const LoginPage = () => {
             </div>
           </motion.div>
 
-          {}
+          { }
           <motion.div
             className="login-form-container"
             initial={{ opacity: 0, x: 100 }}
@@ -424,7 +424,7 @@ const LoginPage = () => {
                 <p>Enter your credentials to access your account</p>
               </motion.div>
 
-              {}
+              { }
               <motion.form
                 className="auth-form"
                 onSubmit={handleSubmit}

frontend/src/pages/ProductDetail.jsx

@@ -68,9 +68,9 @@ export default function ProductDetail() {
     window.scrollTo(0, 0);
     setLoading(true);
     fetch(
-      (process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com") +
-        "/api/product/" +
-        id,
+      (process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space") +
+      "/api/product/" +
+      id,
     )
       .then((res) => res.json())
       .then((res) => {
@@ -146,19 +146,19 @@ export default function ProductDetail() {
         const mappedCartItems = cartItemsFromRTK.map((i) =>
           i.product
             ? {
-                productId: i.product._id,
-                name: i.product.name,
-                price: i.product.price,
-                qty: i.qty,
-                category: i.product.category,
-                seller: i.product.seller,
-                stock: i.product.stock,
-                image:
-                  i.product.images && i.product.images[0]
-                    ? i.product.images[0].image
-                    : "",
-                ratings: i.product.ratings,
-              }
+              productId: i.product._id,
+              name: i.product.name,
+              price: i.product.price,
+              qty: i.qty,
+              category: i.product.category,
+              seller: i.product.seller,
+              stock: i.product.stock,
+              image:
+                i.product.images && i.product.images[0]
+                  ? i.product.images[0].image
+                  : "",
+              ratings: i.product.ratings,
+            }
             : i,
         );
 
@@ -337,7 +337,7 @@ export default function ProductDetail() {
     product && (
       <div className="modern-product-detail">
         <div className="container">
-          {}
+          { }
           <motion.div
             className="Premium-info-bar"
             initial={{ opacity: 0, y: -20 }}
@@ -385,7 +385,7 @@ export default function ProductDetail() {
             animate={{ opacity: 1, y: 0 }}
             transition={{ duration: 0.8 }}
           >
-            {}
+            { }
             <div className="product-images-section">
               <motion.div
                 className="main-image-container"
@@ -404,7 +404,7 @@ export default function ProductDetail() {
                 />
                 <div className="image-glow"></div>
 
-                {}
+                { }
                 <motion.button
                   className={`wishlist-btn-large ${wishlistProductIds.has(product._id) ? "active" : ""}`}
                   onClick={toggleWishlist}
@@ -420,7 +420,7 @@ export default function ProductDetail() {
                 </motion.button>
               </motion.div>
 
-              {}
+              { }
               {product.images.length > 1 && (
                 <div className="thumbnail-images">
                   {product.images.map((img, index) => (
@@ -441,7 +441,7 @@ export default function ProductDetail() {
               )}
             </div>
 
-            {}
+            { }
             <motion.div
               className="product-info-section"
               initial={{ opacity: 0, x: 50 }}
@@ -453,7 +453,7 @@ export default function ProductDetail() {
                 <p className="product-id">Product #{product._id}</p>
               </div>
 
-              {}
+              { }
               <div className="product-rating-section">
                 <div className="stars-large">
                   {renderStars(
@@ -469,7 +469,7 @@ export default function ProductDetail() {
                 </span>
               </div>
 
-              {}
+              { }
               <div className="price-section">
                 <div className="current-price">
                   <span className="currency">₹</span>
@@ -480,7 +480,7 @@ export default function ProductDetail() {
                 <div className="price-glow"></div>
               </div>
 
-              {}
+              { }
               <div className="stock-section">
                 <div
                   className={`stock-status ${product.stock > 0 ? "in-stock" : "out-of-stock"}`}
@@ -494,7 +494,7 @@ export default function ProductDetail() {
                 </div>
               </div>
 
-              {}
+              { }
               <div className="quantity-section">
                 <label className="quantity-label">Quantity:</label>
                 <div className="quantity-controls">
@@ -520,7 +520,7 @@ export default function ProductDetail() {
                 </div>
               </div>
 
-              {}
+              { }
               <div className="action-buttons">
                 <motion.button
                   className="add-to-cart-btn-blue"
@@ -546,7 +546,7 @@ export default function ProductDetail() {
                 </motion.button>
               </div>
 
-              {}
+              { }
               <div className="product-features">
                 <div className="feature">
                   <Truck size={20} />
@@ -562,13 +562,13 @@ export default function ProductDetail() {
                 </div>
               </div>
 
-              {}
+              { }
               <div className="description-section">
                 <h3 className="description-title">Description</h3>
                 <p className="description-text">{product.description}</p>
               </div>
 
-              {}
+              { }
               <div className="seller-section">
                 <h4 className="seller-title">Seller Information</h4>
                 <p className="seller-name">
@@ -576,7 +576,7 @@ export default function ProductDetail() {
                 </p>
               </div>
 
-              {}
+              { }
               {product.specifications && (
                 <motion.div
                   className="specifications-section glass-effect-strong"
@@ -603,7 +603,7 @@ export default function ProductDetail() {
                 </motion.div>
               )}
 
-              {}
+              { }
               {(product.warrantyDetails || product.afterSalesSupport) && (
                 <motion.div
                   className="warranty-section glass-effect-strong"
@@ -628,7 +628,7 @@ export default function ProductDetail() {
                 </motion.div>
               )}
 
-              {}
+              { }
               {product.reviews && product.reviews.length > 0 && (
                 <motion.div
                   className="reviews-section glass-effect-strong"
@@ -681,7 +681,7 @@ export default function ProductDetail() {
                             className="helpful-btn"
                             aria-label="Mark review as helpful"
                             tabIndex={0}
-                            onClick={() => {}}
+                            onClick={() => { }}
                           >
                             👍 Helpful
                           </button>

frontend/src/pages/ProductList.jsx

@@ -75,7 +75,7 @@ export default function ProductList() {
   }, []);
   useEffect(() => {
     fetch(
-      `${process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com"}/api/products`,
+      `${process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space"}/api/products`,
     )
       .then((res) => res.json())
       .then((data) => {
@@ -254,17 +254,17 @@ export default function ProductList() {
         : true;
       const matchesPrice = priceRange
         ? (priceRange === "low" && product.price < 500) ||
-          (priceRange === "mid" &&
-            product.price >= 500 &&
-            product.price <= 1500) ||
-          (priceRange === "high" && product.price > 1500)
+        (priceRange === "mid" &&
+          product.price >= 500 &&
+          product.price <= 1500) ||
+        (priceRange === "high" && product.price > 1500)
         : true;
       const matchesRating = ratingFilter
         ? product.ratings >= Number(ratingFilter)
         : true;
       const matchesKeyword = searchKeyword
         ? product.name.toLowerCase().includes(searchKeyword) ||
-          product.description?.toLowerCase().includes(searchKeyword)
+        product.description?.toLowerCase().includes(searchKeyword)
         : true;
       return matchesCategory && matchesPrice && matchesRating && matchesKeyword;
     });
@@ -312,7 +312,7 @@ export default function ProductList() {
   return (
     <div className="modern-product-list">
       <div className="container">
-        {}
+        { }
         {!searchKeyword ? (
           <motion.div
             className="page-header"
@@ -359,7 +359,7 @@ export default function ProductList() {
           </motion.div>
         )}
 
-        {}
+        { }
         <motion.div
           className="controls-section"
           initial={{ opacity: 0, y: 30 }}
@@ -404,7 +404,7 @@ export default function ProductList() {
         </motion.div>
 
         <div className="main-content">
-          {}
+          { }
           <motion.div
             className={`filters-sidebar ${showFilters ? "show" : ""}`}
             initial={{ x: -300, opacity: 0 }}
@@ -435,7 +435,7 @@ export default function ProductList() {
               </button>
               <h3 className="filters-title">Filters</h3>
 
-              {}
+              { }
               <div className="filter-group">
                 <h4 className="filter-group-title">Categories</h4>
                 <div className="filter-options">
@@ -461,7 +461,7 @@ export default function ProductList() {
                 </div>
               </div>
 
-              {}
+              { }
               <div className="filter-group">
                 <h4 className="filter-group-title">Price Range</h4>
                 <select
@@ -476,7 +476,7 @@ export default function ProductList() {
                 </select>
               </div>
 
-              {}
+              { }
               <div className="filter-group">
                 <h4 className="filter-group-title">Rating</h4>
                 <select
@@ -494,7 +494,7 @@ export default function ProductList() {
             </div>
           </motion.div>
 
-          {}
+          { }
           <div className="products-section">
             {filteredProducts.length > 0 ? (
               <motion.div
@@ -515,7 +515,7 @@ export default function ProductList() {
                   >
                     <div className="modern-product-card">
                       <div className="product-card-inner">
-                        {}
+                        { }
                         <div className="product-image-container">
                           <Link
                             to={`/product/${product._id}`}
@@ -533,7 +533,7 @@ export default function ProductList() {
                             />
                           </Link>
 
-                          {}
+                          { }
                           <motion.button
                             className={`wishlist-btn ${wishlistProductIds.has(product._id) ? "active" : ""}`}
                             onClick={() => toggleWishlist(product._id, product)}
@@ -550,7 +550,7 @@ export default function ProductList() {
                             />
                           </motion.button>
 
-                          {}
+                          { }
                           <motion.div
                             className="quick-view-btn"
                             whileHover={{ scale: 1.1 }}
@@ -561,7 +561,7 @@ export default function ProductList() {
                           </motion.div>
                         </div>
 
-                        {}
+                        { }
                         <div className="product-info">
                           <h3 className="product-title">
                             <Link to={`/product/${product._id}`}>
@@ -569,7 +569,7 @@ export default function ProductList() {
                             </Link>
                           </h3>
 
-                          {}
+                          { }
                           <div className="product-rating">
                             <div className="stars">
                               {renderStars(product.ratings)}
@@ -579,14 +579,14 @@ export default function ProductList() {
                             </span>
                           </div>
 
-                          {}
+                          { }
                           <div className="product-price-center">
                             <span className="price-symbol">₹</span>
                             <span className="price-amount">
                               {product.price}
                             </span>
                           </div>
-                          {}
+                          { }
                           <div className="info-row">
                             <div className="product-description-snippet">
                               {window.innerWidth <= 600
@@ -594,9 +594,9 @@ export default function ProductList() {
                                   ? product.description.slice(0, 25) + "..."
                                   : product.description
                                 : product.description.slice(0, 50) +
-                                  (product.description.length > 50
-                                    ? "..."
-                                    : "")}
+                                (product.description.length > 50
+                                  ? "..."
+                                  : "")}
                             </div>
 
                             <motion.div
@@ -611,7 +611,7 @@ export default function ProductList() {
                               </Link>
                             </motion.div>
                           </div>
-                          {}
+                          { }
                           <div className="item-actions">
                             <motion.button
                               className={`add-to-cart-btn-premium${isInCart(product._id) ? " in-cart" : ""}`}
@@ -654,7 +654,7 @@ export default function ProductList() {
           </div>
         </div>
 
-        {}
+        { }
         <motion.button
           onClick={scrollToTop}
           className="scroll-to-top-btn"

frontend/src/pages/ProfilePage.jsx

@@ -61,7 +61,7 @@ const ProfilePage = () => {
   const navigate = useNavigate();
   const [logoutAPI] = useLogoutAPIMutation();
   const BACKEND_URL =
-    (process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com") + "/api";
+    (process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space") + "/api";
   const canvasRef = useRef(null);
 
   const [products, setProducts] = useReactState([]);
@@ -214,7 +214,7 @@ const ProfilePage = () => {
 
   useEffect(() => {
     fetch(
-      `${process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com"}/api/products`,
+      `${process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space"}/api/products`,
     )
       .then((res) => res.json())
       .then((data) => {
@@ -674,7 +674,7 @@ const ProfilePage = () => {
                       >
                         {order.status
                           ? order.status.charAt(0).toUpperCase() +
-                            order.status.slice(1)
+                          order.status.slice(1)
                           : "Placed"}
                       </button>
                     </div>
@@ -714,7 +714,7 @@ const ProfilePage = () => {
           </motion.div>
         </div>
         <div style={{ margin: "24px" }}>
-          {}
+          { }
           <motion.div
             className="lux-profile-stats-card cart-preview-section"
             initial={{ opacity: 0, y: 40 }}
@@ -848,7 +848,7 @@ const ProfilePage = () => {
           </motion.div>
         </div>
         <div style={{ margin: "24px" }}>
-          {}
+          { }
           <motion.div
             className="lux-profile-stats-card"
             initial={{ opacity: 0, y: 40 }}
@@ -943,7 +943,7 @@ const ProfilePage = () => {
           </motion.div>
         </div>
         <div style={{ margin: "24px" }}>
-          {}
+          { }
           <motion.div
             className="lux-profile-stats-card"
             initial={{ opacity: 0, y: 40 }}
@@ -998,7 +998,7 @@ const ProfilePage = () => {
         </div>
         <div style={{ margin: "24px" }}></div>
         <div style={{ margin: "24px" }}>
-          {}
+          { }
           <motion.div
             className="lux-profile-activity-card"
             initial={{ opacity: 0, y: 40 }}
@@ -1032,7 +1032,7 @@ const ProfilePage = () => {
               ))}
             </div>
           </motion.div>
-          {}
+          { }
           <div style={{ margin: "24px" }}></div>
           <motion.div
             className="lux-profile-stats-card"
@@ -1079,7 +1079,7 @@ const ProfilePage = () => {
           </motion.div>
 
           <div style={{ margin: "24px" }}></div>
-          {}
+          { }
           <motion.div
             className="lux-profile-activity-card recommended-section"
             initial={{ opacity: 0, y: 40 }}
@@ -1135,7 +1135,7 @@ const ProfilePage = () => {
           </motion.div>
         </div>
         <div style={{ margin: "24px" }}>
-          {}
+          { }
           <motion.div
             className="lux-profile-activity-card"
             initial={{ opacity: 0, y: 40 }}
@@ -1203,7 +1203,7 @@ const ProfilePage = () => {
           </motion.div>
         </div>
         <div style={{ margin: "24px" }}>
-          {}
+          { }
           <motion.div
             className="lux-profile-activity-card"
             initial={{ opacity: 0, y: 40 }}

frontend/src/pages/RegisterPage.jsx

@@ -54,7 +54,7 @@ const RegisterPage = () => {
   const navigate = useNavigate();
   const canvasRef = useRef(null);
   const BACKEND_URL =
-    (process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com") + "/api";
+    (process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space") + "/api";
   const dispatch = useDispatch();
   const [register, { isLoading: isRegistering }] = useRegisterAPIMutation();
 
@@ -320,10 +320,10 @@ const RegisterPage = () => {
 
   return (
     <div className="auth-page register-page">
-      {}
+      { }
       <canvas ref={canvasRef} className="background-canvas" />
 
-      {}
+      { }
       <div className="floating-particles">
         {particles.map((particle) => (
           <motion.div
@@ -351,10 +351,10 @@ const RegisterPage = () => {
         ))}
       </div>
 
-      {}
+      { }
       <div className="auth-container">
         <div className="auth-grid register-grid">
-          {}
+          { }
           <motion.div
             className="auth-branding"
             initial={{ opacity: 0, x: -100 }}
@@ -434,7 +434,7 @@ const RegisterPage = () => {
               </motion.div>
             </div>
 
-            {}
+            { }
             <div className="branding-decorations">
               <motion.div
                 className="decoration gem-1"
@@ -504,7 +504,7 @@ const RegisterPage = () => {
             </div>
           </motion.div>
 
-          {}
+          { }
           <motion.div
             className="auth-form-container"
             initial={{ opacity: 0, x: 100 }}
@@ -512,8 +512,8 @@ const RegisterPage = () => {
             transition={{ duration: 0.8, delay: 0.2 }}
           >
             <div className="form-wrapper">
-              {}
-              {}
+              { }
+              { }
 
               <motion.div
                 className="form-header"
@@ -530,7 +530,7 @@ const RegisterPage = () => {
                 </p>
               </motion.div>
 
-              {}
+              { }
               {currentStep === 1 && (
                 <motion.div
                   className="social-login"
@@ -582,16 +582,16 @@ const RegisterPage = () => {
                 </motion.div>
               )}
 
-              {}
+              { }
               <motion.form
                 className="auth-form multi-step-form"
                 onSubmit={
                   currentStep === totalSteps
                     ? handleSubmit
                     : (e) => {
-                        e.preventDefault();
-                        handleNext();
-                      }
+                      e.preventDefault();
+                      handleNext();
+                    }
                 }
                 initial={{ opacity: 0, y: 30 }}
                 animate={{ opacity: 1, y: 0 }}
@@ -601,7 +601,7 @@ const RegisterPage = () => {
                 }}
               >
                 <AnimatePresence mode="wait">
-                  {}
+                  { }
                   {currentStep === 1 && (
                     <motion.div
                       key="step1"
@@ -749,7 +749,7 @@ const RegisterPage = () => {
                             )}
                           </button>
                         </div>
-                        {}
+                        { }
                         {formData.password && (
                           <motion.div
                             className="password-strength"
@@ -856,7 +856,7 @@ const RegisterPage = () => {
                     </motion.div>
                   )}
 
-                  {}
+                  { }
                   {currentStep === 2 && (
                     <motion.div
                       key="step2"
@@ -1067,7 +1067,7 @@ const RegisterPage = () => {
                   )}
                 </AnimatePresence>
 
-                {}
+                { }
                 <div className="form-navigation">
                   {currentStep > 1 && (
                     <motion.button
@@ -1139,7 +1139,7 @@ const RegisterPage = () => {
                 </div>
               </motion.form>
 
-              {}
+              { }
               <motion.div
                 className="trust-indicators"
                 initial={{ opacity: 0, y: 30 }}

frontend/src/pages/WishlistPage.jsx

@@ -100,13 +100,13 @@ export default function WishlistPage() {
 
   useEffect(() => {
     fetch(
-      `${process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com"}/api/products`,
+      `${process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space"}/api/products`,
     )
       .then((res) => res.json())
       .then((data) => {
         setAllCategories([...new Set(data.products.map((p) => p.category))]);
       })
-      .catch(() => {});
+      .catch(() => { });
   }, [location]);
 
   useEffect(() => {
@@ -203,7 +203,7 @@ export default function WishlistPage() {
       let product = null;
       try {
         const response = await fetch(
-          `${process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com"}/api/product/${productId}`,
+          `${process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space"}/api/product/${productId}`,
         );
         const data = await response.json();
         product = data.product;
@@ -387,11 +387,11 @@ export default function WishlistPage() {
   const wishlistAvgRating =
     Array.isArray(data?.wishlist) && data.wishlist.length > 0
       ? (
-          data.wishlist.reduce(
-            (total, item) => total + getAverageRating(item),
-            0,
-          ) / data.wishlist.length
-        ).toFixed(1)
+        data.wishlist.reduce(
+          (total, item) => total + getAverageRating(item),
+          0,
+        ) / data.wishlist.length
+      ).toFixed(1)
       : "0.0";
 
   const wishlistTotalPrice = (filteredAndSortedItems || []).reduce(
@@ -510,7 +510,7 @@ export default function WishlistPage() {
 
   return (
     <div className="Premium-wishlist-page">
-      {}
+      { }
       <div className="wishlist-cosmic-bg">
         <div className="cosmic-particles">
           {[...Array(30)].map((_, i) => (
@@ -563,7 +563,7 @@ export default function WishlistPage() {
       </div>
 
       <div className="container">
-        {}
+        { }
         <motion.div
           className="wishlist-header"
           initial={{ opacity: 0, y: -50 }}
@@ -629,7 +629,7 @@ export default function WishlistPage() {
               {data?.wishlist.length} items saved for later
             </div>
             <div className="premium-wishlist-actions-row">
-              {}
+              { }
               {actions}
             </div>
           </div>
@@ -637,7 +637,7 @@ export default function WishlistPage() {
 
         {data?.wishlist.length > 0 ? (
           <>
-            {}
+            { }
             <motion.div
               className="wishlist-controls"
               initial={{ opacity: 0, y: 30 }}
@@ -791,7 +791,7 @@ export default function WishlistPage() {
               </div>
             </motion.div>
 
-            {}
+            { }
             <motion.div
               className="wishlist-stats"
               initial={{ opacity: 0, y: 30 }}
@@ -845,7 +845,7 @@ export default function WishlistPage() {
               </div>
             </motion.div>
 
-            {}
+            { }
             <motion.div
               className={`wishlist-grid ${viewMode}`}
               initial={{ opacity: 0 }}
@@ -865,7 +865,7 @@ export default function WishlistPage() {
                     whileHover={{ y: -10 }}
                   >
                     <div className="item-card glass-effect-strong">
-                      {}
+                      { }
                       <div
                         className="wishlist-heart-icon"
                         style={{
@@ -882,7 +882,7 @@ export default function WishlistPage() {
                           style={{ filter: "drop-shadow(0 0 6px #ff4757aa)" }}
                         />
                       </div>
-                      {}
+                      { }
                       {item.stock <= 5 && item.stock > 0 && (
                         <div className="product-badge limited">
                           <Zap size={12} />
@@ -904,7 +904,7 @@ export default function WishlistPage() {
                         </div>
                       )}
 
-                      {}
+                      { }
                       <div
                         className="item-image-container big-centered"
                         onClick={() => navigate(`/product/${item.productId}`)}
@@ -921,7 +921,7 @@ export default function WishlistPage() {
                           transition={{ duration: 0.3 }}
                         />
 
-                        {}
+                        { }
                         <div className="quick-actions">
                           <motion.button
                             className="quick-action-btn view"
@@ -952,7 +952,7 @@ export default function WishlistPage() {
                         <div className="image-overlay"></div>
                       </div>
 
-                      {}
+                      { }
                       <div className="item-info">
                         <div className="item-category">{item.category}</div>
 
@@ -1089,7 +1089,7 @@ export default function WishlistPage() {
                 </Link>
               </motion.div>
 
-              {}
+              { }
               <div className="shopping-suggestions">
                 {[Gift, Crown, Sparkles, Star, TrendingUp, Award].map(
                   (Icon, index) => (

frontend/src/store/slices/apiSlice.jsx

@@ -7,7 +7,7 @@ const getApiUrl = () => {
       return "/api";
     }
     return (
-      (process.env.REACT_APP_API_URL || "https://mkcart2.onrender.com") + "/api"
+      (process.env.REACT_APP_API_URL || "https://kumar715-mkcart.hf.space") + "/api"
     );
   }
   return "http://localhost:7860/api";