51 lines
1.2 KiB
JavaScript
51 lines
1.2 KiB
JavaScript
import { useEffect } from "react";
|
|
import { useDispatch, useSelector } from "react-redux";
|
|
import { useParams } from "react-router-dom";
|
|
import { fetchPropertyById } from "../redux/features/propertySlice";
|
|
|
|
|
|
|
|
const PropertyView = () => {
|
|
const { id } = useParams(); // Extract the property ID from the route
|
|
const dispatch = useDispatch();
|
|
const { selectedProperty, status, error } = useSelector((state) => state.property);
|
|
|
|
useEffect(() => {
|
|
// Fetch the property by ID when the component loads
|
|
if (id) {
|
|
dispatch(fetchPropertyById(id));
|
|
}
|
|
}, [id, dispatch]);
|
|
|
|
if (status === "loading") {
|
|
return <p>Loading property details...</p>;
|
|
}
|
|
|
|
if (status === "failed") {
|
|
return <p>Error loading property: {error}</p>;
|
|
}
|
|
|
|
// console.log("selectedProperty", selectedProperty);
|
|
|
|
return (
|
|
<>
|
|
|
|
<div className="container property-view">
|
|
{selectedProperty ? (
|
|
<div className="property-details">
|
|
<h1>{selectedProperty.title}</h1>
|
|
|
|
<p>Email: {selectedProperty.useremail}</p>
|
|
{/* Add more property details as needed */}
|
|
</div>
|
|
) : (
|
|
<p>Property not found.</p>
|
|
)}
|
|
</div>
|
|
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default PropertyView;
|