added frontend for social + feed partiali working

frontend/src/pages/social/ProfilePage.tsx

@@ -0,0 +1,50 @@
+import { useTranslation } from "react-i18next";
+import { FiLogOut, FiUser } from "react-icons/fi";
+import { Link } from "react-router-dom";
+import { useAuth } from "@/context/AuthContext";
+import Avatar from "@/components/ui/Avatar";
+import Card from "@/components/ui/Card";
+import EmptyState from "@/components/ui/EmptyState";
+
+export default function ProfilePage() {
+  const { t } = useTranslation("social");
+  const { user } = useAuth();
+
+  if (!user) return <EmptyState icon={<FiUser />} title="—" />;
+
+  return (
+    <div>
+      <header className="sticky top-0 z-10 border-b border-brand-lines/10 bg-brand-bg/80 px-4 py-3 backdrop-blur">
+        <h1 className="text-lg font-bold text-brand-text">{t("nav.profile")}</h1>
+      </header>
+
+      <div className="p-4">
+        <Card className="flex items-center gap-4">
+          <Avatar name={user.username || user.email} size={64} />
+          <div className="min-w-0 flex-1">
+            <div className="truncate text-lg font-semibold text-brand-text">
+              @{user.username}
+            </div>
+            {user.email && (
+              <div className="truncate text-sm text-brand-text/60">{user.email}</div>
+            )}
+            {(user.first_name || user.last_name) && (
+              <div className="text-sm text-brand-text/70">
+                {[user.first_name, user.last_name].filter(Boolean).join(" ")}
+              </div>
+            )}
+          </div>
+        </Card>
+
+        <div className="mt-4 flex justify-end">
+          <Link
+            to="/social/logout"
+            className="inline-flex items-center gap-2 rounded-xl border border-brand-lines/20 px-3 py-2 text-sm text-brand-text/80 hover:bg-brand-lines/10 hover:text-brand-accent"
+          >
+            <FiLogOut size={14} /> {t("nav.logout")}
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}