profile page

src/app/(admin)/(others-pages)/profile/page.tsx

@@ -1,14 +1,32 @@
-"use client"
+"use client";
 
 import UserAddressCard from "@/components/user-profile/UserAddressCard";
 import UserInfoCard from "@/components/user-profile/UserInfoCard";
-import UserMetaCard from "@/components/user-profile/UserMetaCard";
+import UserMetaCard, { UserMetaCardProps } from "@/components/user-profile/UserMetaCard";
+import { apiGetCurrentUser } from "@/service/auth";
 import { RootState } from "@/store/store";
+import { useEffect, useState } from "react";
 import { useSelector } from "react-redux";
 
 export default function Profile() {
-  const user = useSelector((state: RootState) => state.user.data);
-  console.log("Current User:", user);
+  const [user, setUser] = useState<UserMetaCardProps | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    const fetchUser = async () => {
+      try {
+        const result = await apiGetCurrentUser();
+        console.log("Current User:", result);
+        setUser(result);
+      } catch (err) {
+        console.error("Lỗi:", err);
+      } finally {
+        setLoading(false);
+      }
+    };
+    fetchUser();
+  }, []);
+
   return (
     <div>
       <div className="rounded-2xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-white/[0.03] lg:p-6">
@@ -16,7 +34,7 @@ export default function Profile() {
           Profile
         </h3>
         <div className="space-y-6">
-          <UserMetaCard />
+          <UserMetaCard data={user ?? {}} />
           <UserInfoCard />
           <UserAddressCard />
         </div>