59 lines
1.6 KiB
React
59 lines
1.6 KiB
React
import React, { useState, useEffect } from 'react';
|
|
import { useParams } from "react-router-dom";
|
|
import MatrimonyProfile from "../components/profiledetail/MatrimonyProfile"
|
|
import PartnerPreferences from "../components/profiledetail/PartnerPreferences"
|
|
import MatchingList from "../components/profiledashboard/MatchingList";
|
|
import { getProfileDetail } from "../services/profileActionApi";
|
|
import { CircularProgress, Box } from "@mui/material";
|
|
|
|
const ProfileDetailPage = () => {
|
|
const { id } = useParams();
|
|
const [data, setData] = useState(null);
|
|
const [loading, setLoading] = useState(true);
|
|
|
|
const fetchDetail = async (showLoading = true) => {
|
|
if (showLoading) setLoading(true);
|
|
try {
|
|
const res = await getProfileDetail(id);
|
|
setData(res);
|
|
} catch (error) {
|
|
console.error("Failed to fetch profile details:", error);
|
|
} finally {
|
|
if (showLoading) setLoading(false);
|
|
}
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (id) {
|
|
fetchDetail();
|
|
}
|
|
}, [id]);
|
|
|
|
if (loading) {
|
|
return (
|
|
<Box sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center', minHeight: '100vh' }}>
|
|
<CircularProgress color="error" />
|
|
</Box>
|
|
);
|
|
}
|
|
|
|
if (!data) {
|
|
return (
|
|
<div className="text-center py-20 text-gray-500 text-xl">
|
|
Profile details not found.
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<div className="w-[100%] max-w-[1400px] mx-auto my-10">
|
|
<MatrimonyProfile data={data} onRefresh={fetchDetail} />
|
|
<PartnerPreferences data={data} />
|
|
<MatchingList matches={data.all_matches} />
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default ProfileDetailPage; |