1  "use client";
 2  
 3  import { Sidebar } from '@/components/Sidebar'
 4  import { ProfileHeader } from '@/components/ProfileHeader'
 5  import { Post } from '@/components/Post'
 6  import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
 7  import { useAccount } from 'wagmi'
 8  
 9  
10  export default function ProfilePage() {
11    const { address } = useAccount()
12    return (
13      <>
14        <aside className="md:col-span-1">
15          <Sidebar />
16        </aside>
17        <main className="md:col-span-2 border-x">
18          <ProfileHeader
19            username={address ? address : "Loading..."}
20            handle={address ? address : "Loading..."}
21            bio="Software developer | Coffee enthusiast | Dog lover"
22            location="San Francisco, CA"
23            website="https://janedoe.com"
24            joinDate="September 2021"
25            followersCount={1234}
26            followingCount={567}
27          />
28          <Tabs defaultValue="tweets" className="w-full">
29            <TabsList className="w-full justify-start h-auto p-0 bg-transparent border-b rounded-none">
30              <TabsTrigger value="tweets" className="flex-1 rounded-none border-b-2 border-transparent data-[state=active]:border-blue-500">Tweets</TabsTrigger>
31              <TabsTrigger value="replies" className="flex-1 rounded-none border-b-2 border-transparent data-[state=active]:border-blue-500">Replies</TabsTrigger>
32              <TabsTrigger value="media" className="flex-1 rounded-none border-b-2 border-transparent data-[state=active]:border-blue-500">Media</TabsTrigger>
33              <TabsTrigger value="likes" className="flex-1 rounded-none border-b-2 border-transparent data-[state=active]:border-blue-500">Likes</TabsTrigger>
34            </TabsList>
35            <TabsContent value="tweets">
36              <div className="divide-y">
37                <Post
38                  username="Jane Doe"
39                  handle="janedoe"
40                  content="Just finished a new project! #coding #webdev"
41                  timestamp="2h"
42                />
43                <Post
44                  username="Jane Doe"
45                  handle="janedoe"
46                  content="Morning coffee and code review. Perfect start to the day!"
47                  timestamp="1d"
48                />
49                <Post
50                  username="Jane Doe"
51                  handle="janedoe"
52                  content="Excited to attend the tech conference next week! Anyone else going?"
53                  timestamp="3d"
54                />
55              </div>
56            </TabsContent>
57            <TabsContent value="replies">
58              <div className="p-4 text-center text-gray-500">No replies yet.</div>
59            </TabsContent>
60            <TabsContent value="media">
61              <div className="p-4 text-center text-gray-500">No media tweets yet.</div>
62            </TabsContent>
63            <TabsContent value="likes">
64              <div className="p-4 text-center text-gray-500">No liked tweets yet.</div>
65            </TabsContent>
66          </Tabs>
67        </main>
68        <aside className="hidden md:block md:col-span-1">
69          {/* You can add a "Who to follow" section or trending topics here */}
70        </aside>
71      </>
72    )
73  }
74