diff --git a/app/[username]/layout.tsx b/app/[username]/layout.tsx index 5a30d51..312da31 100644 --- a/app/[username]/layout.tsx +++ b/app/[username]/layout.tsx @@ -1,9 +1,29 @@ import React from "react"; +import { DashboardSidebar } from "@/components/layout/SideBar"; +import { DashboardNavbar } from "@/components/layout/DashboardNavBar"; export default function PublicProfileLayout({ children, }: { children: React.ReactNode; }) { - return
{children}
; + return ( +
+ {/* Sidebar */} +
+ +
+ + {/* Main content area (navbar + page) */} +
+ {/* Top navbar */} + + + {/* Page content */} +
+ {children} +
+
+
+ ); } diff --git a/app/[username]/page.tsx b/app/[username]/page.tsx index 89e3f05..684c5d5 100644 --- a/app/[username]/page.tsx +++ b/app/[username]/page.tsx @@ -1,17 +1,78 @@ "use client"; + import React from "react"; +import { useParams } from "next/navigation"; +import DashboardMetrics from "@/components/dashboard/DashboardMetrics"; +import { UserTokenList } from "@/components/dashboard/UserTokenList"; +import { TokenData } from "@/components/dashboard/TokenList"; + +const mockUserTokens: TokenData[] = [ + { + tokenId: "0xa1b2c3", + name: "Vaccine Certificate", + type: "Health", + expiresIn: "3 years", + endorsements: 87, + }, + { + tokenId: "0xd4e5f6", + name: "University Degree", + type: "Education", + expiresIn: "Never", + endorsements: 142, + }, + { + tokenId: "0xg7h8i9", + name: "KYC Verified", + type: "Identity", + expiresIn: "2 years", + endorsements: 56, + }, + { + tokenId: "0xj0k1l2", + name: "Employment Record", + type: "Work", + expiresIn: "1 year", + endorsements: 24, + }, + { + tokenId: "0xm3n4o5", + name: "Open Source Contributor", + type: "Skill", + expiresIn: "Never", + endorsements: 203, + }, +]; + +export default function UsernamePage() { + const params = useParams<{ username: string }>(); + const username = params?.username ?? ""; -export default async function UsernamePage({ - params, -}: { - params: Promise<{ username: string }>; -}) { - const { username } = await params; return ( -
-

- @{username} -

-
+
+ + +
+ console.log("Endorsing token:", id)} + onRevoke={(id) => console.log("Revoking token:", id)} + /> +
+
); } diff --git a/components/dashboard/UserTokenList.tsx b/components/dashboard/UserTokenList.tsx new file mode 100644 index 0000000..28cd454 --- /dev/null +++ b/components/dashboard/UserTokenList.tsx @@ -0,0 +1,58 @@ +"use client"; + +import React from "react"; +import { TokenCard } from "../cards/TokenCard"; +import { TokenData } from "./TokenList"; + +interface UserTokenListProps { + tokens: TokenData[]; + className?: string; + onRevoke?: (tokenId: string) => void; + onEndorse?: (tokenId: string) => void; + onViewAll?: (tokenId: string) => void; +} + +export function UserTokenList({ + tokens, + className = "", + onRevoke, + onEndorse, + onViewAll, +}: UserTokenListProps) { + return ( +
+ {/* Section Title */} +

+ Tokens +

+ + {/* Token Cards */} +
+ {tokens.length === 0 ? ( +
+ No tokens found. +
+ ) : ( + tokens.map((token) => ( + onRevoke(token.tokenId) : undefined} + onEndorse={onEndorse ? () => onEndorse(token.tokenId) : undefined} + onViewAll={onViewAll ? () => onViewAll(token.tokenId) : undefined} + /> + )) + )} +
+
+ ); +} + +export default UserTokenList; diff --git a/components/layout/DashboardNavBar.tsx b/components/layout/DashboardNavBar.tsx index 43ebfc0..0bb6b88 100644 --- a/components/layout/DashboardNavBar.tsx +++ b/components/layout/DashboardNavBar.tsx @@ -20,6 +20,13 @@ export function DashboardNavbar() { setIsCreateModalOpen(false); }; + const knownRoutes = ["/", "/home", "/dashboard", "/discover", "/settings"]; + const firstSegment = pathname?.split("/").filter(Boolean)[0] ?? ""; + const isUserProfile = + pathname !== "/" && + !knownRoutes.includes(pathname) && + firstSegment.length > 0; + const isDiscover = pathname === "/discover"; const getPageTitle = () => { @@ -33,9 +40,11 @@ export function DashboardNavbar() { <>