Merge pull request #722 from J-B-Mugundh/rbac-profile

Added End-to-End integration of rental, lease and sales products page
manikumarreddyu · Oct 30, 2024 · 71f0582 · 71f0582
2 parents 9137a82 + 40cc347
commit 71f0582
Show file tree

Hide file tree

Showing 4 changed files with 295 additions and 13 deletions.
diff --git a/backend/index.js b/backend/index.js
@@ -5,9 +5,10 @@ const dotenv = require("dotenv").config();
 const authRoutes = require('./routes/auth');
 const userRoutes = require('./routes/users');
 const contactRoutes = require('./routes/Contactroute');
-const shopRoutes = require('./routes/shop')
+const shopRoutes = require('./routes/shop');
+const agriProductRoutes = require('./routes/agriProductRoutes');
 const authMiddleware = require('./middleware/auth');
-const bcrypt = require('bcryptjs');
+const bcrypt = require('bcryptjs')
 const app = express();
 
 app.use(cors());
@@ -16,7 +17,8 @@ app.use('/auth', authRoutes);
 app.use('/api', contactRoutes);
 app.use('/api', shopRoutes);
 app.use('/api', userRoutes); 
-
+app.use('/api/products', agriProductRoutes);
+
 const PORT = process.env.PORT || 8080;
 
 // MongoDB connection

diff --git a/frontend/src/AgroRentAI/components/AgriProductListing.jsx b/frontend/src/AgroRentAI/components/AgriProductListing.jsx
@@ -1,20 +1,88 @@
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
+import axios from "axios";
+import { motion, AnimatePresence } from "framer-motion";
 import ProductCard from "./ProductCard";
 import ProductModal from "./ProductModal";
-import products from "../data/products";
+import productsBg from "../rent-assets/productsBg.png"
 
 const AgriProductListing = () => {
+  const [products, setProducts] = useState([]);
   const [selectedProduct, setSelectedProduct] = useState(null);
+  const [error, setError] = useState(null);
+
+  useEffect(() => {
+    const fetchProducts = async () => {
+      try {
+        const response = await axios.get("http://localhost:8080/api/products");
+        setProducts(response.data);
+      } catch (err) {
+        console.error("Error fetching products:", err);
+        setError("Error fetching products");
+      }
+    };
+    fetchProducts();
+  }, []);
+
+  // Framer Motion animation variants
+  const cardVariants = {
+    hidden: { opacity: 0, y: 20 },
+    visible: { opacity: 1, y: 0 },
+  };
+
+  const modalVariants = {
+    hidden: { opacity: 0, scale: 0.8 },
+    visible: { opacity: 1, scale: 1 },
+    exit: { opacity: 0, scale: 0.8 },
+  };
 
   return (
-    <div className="min-h-screen bg-gradient-to-r from-green-400 to-blue-500 flex flex-col items-center py-10 mt-16">
-      <h1 className="text-4xl font-bold text-white mb-8">Agricultural Products</h1>
-      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-8 max-w-6xl">
-        {products.map((product) => (
-          <ProductCard key={product.id} product={product} onClick={setSelectedProduct} />
-        ))}
-      </div>
-      {selectedProduct && <ProductModal product={selectedProduct} onClose={() => setSelectedProduct(null)} />}
+    <div className="min-h-screen flex flex-col items-center py-10 mt-16 bg-cover bg-center"
+      style={{ backgroundImage: `url(${productsBg})` }}>
+
+      <motion.h1
+        className="text-4xl font-bold text-white mb-8"
+        initial={{ opacity: 0, y: -50 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.6 }}
+      >
+        Agricultural Products
+      </motion.h1>
+
+      {error ? (
+        <motion.p className="text-red-500" initial={{ opacity: 0 }} animate={{ opacity: 1 }}>
+          {error}
+        </motion.p>
+      ) : (
+        <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-8 max-w-6xl">
+          {products.map((product, index) => (
+            <motion.div
+              key={product._id}
+              variants={cardVariants}
+              initial="hidden"
+              animate="visible"
+              transition={{ duration: 0.5, delay: index * 0.1 }}
+              className="border-2 border-green-500 rounded-lg shadow-lg overflow-hidden"
+            >
+              <ProductCard product={product} onClick={() => setSelectedProduct(product)} />
+            </motion.div>
+          ))}
+        </div>
+      )}
+
+      <AnimatePresence>
+        {selectedProduct && (
+          <motion.div
+            variants={modalVariants}
+            initial="hidden"
+            animate="visible"
+            exit="exit"
+            transition={{ duration: 0.3 }}
+            className="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50"
+          >
+            <ProductModal product={selectedProduct} onClose={() => setSelectedProduct(null)} />
+          </motion.div>
+        )}
+      </AnimatePresence>
     </div>
   );
 };

diff --git a/frontend/src/AgroRentAI/data/products.json b/frontend/src/AgroRentAI/data/products.json
@@ -0,0 +1,212 @@
+[
+  {
+    "_id": 1,
+    "productName": "John Deere Tractor",
+    "productType": "Equipment",
+    "description": "High-performance tractor suitable for all terrains.",
+    "price": 500,
+    "priceType": "Rent",
+    "availability": {
+      "startDate": "2023-10-01",
+      "endDate": "2023-12-01"
+    },
+    "location": {
+      "city": "Nashik",
+      "state": "Maharashtra"
+    },
+    "contactDetails": {
+      "phone": "123-456-7890",
+      "email": "[email protected]"
+    },
+    "condition": "New",
+    "imageUrl": "https://www.deere.co.in/assets/images/region-1/products/tractors/john-deere-d-series-tractor.jpg",
+    "isAvailable": true
+  },
+  {
+    "_id": 2,
+    "productName": "Mahindra Plough",
+    "productType": "Equipment",
+    "description": "Efficient plough for soil preparation and land management.",
+    "price": 300,
+    "priceType": "Lease",
+    "availability": {
+      "startDate": "2023-11-01",
+      "endDate": "2024-01-15"
+    },
+    "location": {
+      "city": "Indore",
+      "state": "Madhya Pradesh"
+    },
+    "contactDetails": {
+      "phone": "789-456-1230",
+      "email": "[email protected]"
+    },
+    "condition": "Used",
+    "imageUrl": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTrQ1Xyp7qhuSZzHikEi6I1BH3W7Ig5Bi4XhA&s",
+    "isAvailable": true
+  },
+  {
+    "_id": 3,
+    "productName": "Organic Wheat Seeds",
+    "productType": "Seeds",
+    "description": "High-quality organic wheat seeds suitable for all seasons.",
+    "price": 80,
+    "priceType": "Sell",
+    "location": {
+      "city": "Kanpur",
+      "state": "Uttar Pradesh"
+    },
+    "contactDetails": {
+      "phone": "234-567-8901",
+      "email": "[email protected]"
+    },
+    "condition": "New",
+    "imageUrl": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ9u3GS6ZBautjOTdq_GGsjefpuuhWHeQOIxw&s",
+    "isAvailable": true
+  },
+  {
+    "_id": 4,
+    "productName": "Fertilizer Pack",
+    "productType": "Fertilizers",
+    "description": "Nutrient-rich fertilizer pack for soil enhancement.",
+    "price": 50,
+    "priceType": "Buy",
+    "location": {
+      "city": "Pune",
+      "state": "Maharashtra"
+    },
+    "contactDetails": {
+      "phone": "345-678-9012",
+      "email": "[email protected]"
+    },
+    "condition": "New",
+    "imageUrl": "https://hips.hearstapps.com/hmg-prod/images/farmer-giving-granulated-fertilizer-to-young-tomato-royalty-free-image-1676657512.jpg",
+    "isAvailable": true
+  },
+  {
+    "_id": 5,
+    "productName": "Agricultural Land",
+    "productType": "Land",
+    "description": "Fertile agricultural land available for lease.",
+    "price": 1000,
+    "priceType": "Lease",
+    "availability": {
+      "startDate": "2023-10-15",
+      "endDate": "2024-03-01"
+    },
+    "location": {
+      "city": "Hyderabad",
+      "state": "Telangana"
+    },
+    "contactDetails": {
+      "phone": "456-789-0123",
+      "email": "[email protected]"
+    },
+    "condition": "N/A",
+    "imageUrl": "https://img.etimg.com/thumb/width-1200,height-900,imgsize-275796,resizemode-75,msid-91981175/news/economy/agriculture/indian-institute-of-management-ahmedabad-launches-agri-land-price-index.jpg",
+    "isAvailable": false
+  },
+  {
+    "_id": 6,
+    "productName": "Greenhouse",
+    "productType": "Equipment",
+    "description": "Greenhouse equipment for plant protection and growth.",
+    "price": 1500,
+    "priceType": "Rent",
+    "availability": {
+      "startDate": "2023-09-01",
+      "endDate": "2024-05-01"
+    },
+    "location": {
+      "city": "Bangalore",
+      "state": "Karnataka"
+    },
+    "contactDetails": {
+      "phone": "567-890-1234",
+      "email": "[email protected]"
+    },
+    "condition": "Used",
+    "imageUrl": "https://upload.wikimedia.org/wikipedia/commons/thumb/9/9a/Botanical_Garden_V.L._Komarov_Botanical_Institute.jpg/640px-Botanical_Garden_V.L._Komarov_Botanical_Institute.jpg",
+    "isAvailable": true
+  },
+  {
+    "_id": 7,
+    "productName": "Irrigation Pipes",
+    "productType": "Equipment",
+    "description": "Durable irrigation pipes for water distribution.",
+    "price": 200,
+    "priceType": "Sell",
+    "location": {
+      "city": "Ahmedabad",
+      "state": "Gujarat"
+    },
+    "contactDetails": {
+      "phone": "678-901-2345",
+      "email": "[email protected]"
+    },
+    "condition": "New",
+    "imageUrl": "https://internationalpipe.com/wp-content/uploads/2023/05/Unravel-the-Mysteries-of-Sprinkler-Irrigation-Pipe-Systems.jpg",
+    "isAvailable": true
+  },
+  {
+    "_id": 8,
+    "productName": "Compost Maker",
+    "productType": "Equipment",
+    "description": "Compact compost maker for organic waste management.",
+    "price": 250,
+    "priceType": "Sell",
+    "location": {
+      "city": "Jaipur",
+      "state": "Rajasthan"
+    },
+    "contactDetails": {
+      "phone": "789-012-3456",
+      "email": "[email protected]"
+    },
+    "condition": "New",
+    "imageUrl": "https://static.wixstatic.com/media/86eefd_fba4ab1002194862badb92e3cc8778b9~mv2.jpg/v1/fill/w_480,h_356,al_c,q_80,usm_0.66_1.00_0.01,enc_auto/86eefd_fba4ab1002194862badb92e3cc8778b9~mv2.jpg",
+    "isAvailable": false
+  },
+  {
+    "_id": 9,
+    "productName": "Organic Rice Seeds",
+    "productType": "Seeds",
+    "description": "Organic rice seeds, ideal for paddy fields.",
+    "price": 90,
+    "priceType": "Sell",
+    "location": {
+      "city": "Guwahati",
+      "state": "Assam"
+    },
+    "contactDetails": {
+      "phone": "890-123-4567",
+      "email": "[email protected]"
+    },
+    "condition": "New",
+    "imageUrl": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ9u3GS6ZBautjOTdq_GGsjefpuuhWHeQOIxw&s",
+    "isAvailable": true
+  },
+  {
+    "_id": 10,
+    "productName": "Sprinkler System",
+    "productType": "Equipment",
+    "description": "Automatic sprinkler system for efficient irrigation.",
+    "price": 400,
+    "priceType": "Rent",
+    "availability": {
+      "startDate": "2023-11-10",
+      "endDate": "2024-04-10"
+    },
+    "location": {
+      "city": "Chandigarh",
+      "state": "Punjab"
+    },
+    "contactDetails": {
+      "phone": "901-234-5678",
+      "email": "[email protected]"
+    },
+    "condition": "Used",
+    "imageUrl": "https://internationalpipe.com/wp-content/uploads/2023/05/Unravel-the-Mysteries-of-Sprinkler-Irrigation-Pipe-Systems.jpg",
+    "isAvailable": true
+  }
+]
diff --git a/frontend/src/AgroRentAI/rent-assets/productsBg.png b/frontend/src/AgroRentAI/rent-assets/productsBg.png