done

ef-api/controllers/property.js

@@ -31,3 +31,12 @@ export const createProperty = async (req, res) => {
  
 };
 
+export const getUserProperties = async (req, res) => {
+  try {
+    const userId = req.params.userId;
+    const properties = await PropertyModal.find({ userId: userId });
+    res.status(200).json(properties);
+  } catch (error) {
+    res.status(500).json({ message: "Error retrieving properties", error });
+  }
+};

ef-api/index.js

@@ -33,7 +33,8 @@ app.use(
 );
 
 app.use("/users", userRouter);
-app.use("/property", propertyRouter);
+app.use("/properties", propertyRouter);
+
 
 app.get("/", (req, res) => {
   res.send("Welcome to EF-API");

ef-api/routes/property.js

@@ -1,9 +1,11 @@
 import express from 'express';
 const router = express.Router();
 import auth from '../middleware/auth.js';
-import { createProperty } from '../controllers/property.js';
+import { createProperty, getUserProperties } from '../controllers/property.js';
 
 router.post('/', auth, createProperty);
+router.get('/user/:userId', getUserProperties);
+
 
 
 

ef-ui/dist/index.html

@@ -42,7 +42,7 @@
 <!-- <script src="https://stackpath.bootstrapcdn.com/bootstrap/5.1.3/js/bootstrap.bundle.min.js"></script> -->
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js"></script>
 
-   <script type="module" crossorigin src="/assets/index-0-EQa57V.js"></script>
+   <script type="module" crossorigin src="/assets/index-CzVE7_Kd.js"></script>
    <link rel="stylesheet" crossorigin href="/assets/index-BrT2kTNU.css">
  </head>
 

ef-ui/src/App.jsx

@@ -46,7 +46,7 @@ const App = () => {
   element={<ResetPassword />}
 />
 
-<Route path="/addproperty" element={  <PrivateRoute><Addproperty /></PrivateRoute>}></Route>
+{/* <Route path="/addproperty" element={  <PrivateRoute><Addproperty /></PrivateRoute>}></Route> */}
 
 
 

ef-ui/src/components/Dashboard.jsx

@@ -1,21 +1,42 @@
-import { useState } from "react";
+import { useState,useEffect } from "react";
 import Footer from "./Footer";
 import Navbar from "./Navbar";
-import { useSelector } from "react-redux";
+import { useSelector, useDispatch } from "react-redux";
 import profilepic from "../img/samplepic.jpg";
 import Addproperty from "./Addproperty";
+import { fetchUserProperties } from "../redux/features/propertySlice";
 import "../dashboard.css";
     
 const Dashboard = () => {
+  const dispatch = useDispatch();
   const { user } = useSelector((state) => ({ ...state.auth }));
+  const { userProperties} = useSelector((state) => state.property);
   const [activeTab, setActiveTab] = useState("dashboard");
 
+    // Fetch user properties when "Active Properties" tab is selected
+    useEffect(() => {
+      if (activeTab === "activeProperties") {
+        dispatch(fetchUserProperties(user?.result?.userId));
+      }
+    }, [activeTab, dispatch, user?.result?.userId]);
+
   const renderTabContent = () => {
     switch (activeTab) {
       case "addProperty":
         return <Addproperty />;
       case "activeProperties":
-        return <p>Here are your active properties.</p>;
+        return   <div>
+        <h3>Active Properties</h3>
+        {userProperties.length > 0 ? (
+          <ul>
+            {userProperties.map((property) => (
+              <li key={property._id}>{property.title}</li>
+            ))}
+          </ul>
+        ) : (
+          <p>No active properties found.</p>
+        )}
+      </div>;
       case "closedProperties":
         return <p>These are your closed properties.</p>;
       default:

ef-ui/src/redux/api.js

@@ -19,5 +19,10 @@ API.interceptors.request.use((req) => {
 export const signUp = (formData) => API.post("/users/signup", formData);
 export const signIn = (formData) => API.post("/users/signin", formData);
 export const verifyEmail = (id, token, data) => API.get(`/users/${id}/verify/${token}`, data);
-export const submitProperty = (propertyData) => API.post("/property", propertyData);
+export const submitProperty = (propertyData) => API.post("/properties", propertyData);
+export const fetchUserProperties = (userId) => API.get(`/properties/user/${userId}`, userId);
+
+
+
+
 

ef-ui/src/redux/features/propertySlice.js

@@ -1,5 +1,5 @@
 import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
-// import axios from 'axios';
+import axios from 'axios';
 import * as api from "../api";
 
 export const submitProperty = createAsyncThunk(
@@ -14,12 +14,26 @@ export const submitProperty = createAsyncThunk(
   }
 );
 
+
+export const fetchUserProperties = createAsyncThunk(
+  'property/fetchUserProperties',
+  async (userId, { rejectWithValue }) => {
+    try {
+      const response = await api.fetchUserProperties(userId);
+      return response.data;
+    } catch (error) {
+      return rejectWithValue(error.response.data);
+    }
+  }
+);
+
 const propertySlice = createSlice({
   name: 'property',
   initialState: {
     property: {},
     status: 'idle',
     error: null,
+    userProperties: [],
   },
   reducers: {},
   extraReducers: (builder) => {
@@ -34,7 +48,19 @@ const propertySlice = createSlice({
       .addCase(submitProperty.rejected, (state, action) => {
         state.status = 'failed';
         state.error = action.payload;
-      });
+      })
+
+      .addCase(fetchUserProperties.pending, (state) => {
+        state.status = 'loading';
+      })
+      .addCase(fetchUserProperties.fulfilled, (state, action) => {
+        state.status = 'succeeded';
+        state.userProperties = action.payload;
+      })
+      .addCase(fetchUserProperties.rejected, (state, action) => {
+        state.status = 'failed';
+        state.error = action.payload;
+      })      ;
   },
 });