Skip to content

Commit d952cd8

Browse files
tusharshah21tusharshah21
committed
frontend for twitter implemented
1 parent 3258fdd commit d952cd8

12 files changed

Lines changed: 92 additions & 3 deletions

File tree

‎frontend/.astro/settings.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"_variables": {
3-
"lastUpdateCheck": 1761559074026
3+
"lastUpdateCheck": 1770638442880
44
},
55
"eslint.validate": [
66
"javascript",

‎frontend/src/components/profiles/action-buttons/CreateProfileDialog.tsx‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ const formSchema = z.object({
3030
name: z.string().min(2, { message: "Name must be at least 2 characters." }),
3131
description: z.string().optional(),
3232
githubLogin: z.string().optional(),
33+
twitterHandle: z.string().optional(),
3334
});
3435

3536
type FormValues = z.infer<typeof formSchema>;
@@ -50,6 +51,7 @@ export function CreateProfileButton() {
5051
name: values.name,
5152
description: values.description || "",
5253
github_login: values.githubLogin || "",
54+
twitter_handle: values.twitterHandle || "",
5355
},
5456
});
5557
await queryClient.invalidateQueries({ queryKey: ["profiles"] });
@@ -120,6 +122,22 @@ export function CreateProfileButton() {
120122
</FormItem>
121123
)}
122124
/>
125+
<FormField
126+
control={form.control}
127+
name="twitterHandle"
128+
render={({ field }) => (
129+
<FormItem>
130+
<FormLabel>Twitter/X Handle</FormLabel>
131+
<FormControl>
132+
<div className="flex items-center gap-2">
133+
<span className="text-sm text-gray-500">@</span>
134+
<Input placeholder="username" {...field} />
135+
</div>
136+
</FormControl>
137+
<FormMessage />
138+
</FormItem>
139+
)}
140+
/>
123141
<div className="flex justify-end gap-2 pt-2">
124142
<DialogClose asChild>
125143
<Button type="button" variant="secondary">

‎frontend/src/components/profiles/action-buttons/EditProfileDialog.tsx‎

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,13 +30,15 @@ interface EditProfileDialogProps {
3030
name?: string;
3131
description?: string;
3232
githubLogin?: string;
33+
twitterHandle?: string;
3334
children: React.ReactNode;
3435
}
3536

3637
const formSchema = z.object({
3738
name: z.string().min(2, { message: "Name must be at least 2 characters." }),
3839
description: z.string().optional(),
3940
githubLogin: z.string().optional(),
41+
twitterHandle: z.string().optional(),
4042
});
4143

4244
type FormValues = z.infer<typeof formSchema>;
@@ -46,6 +48,7 @@ export function EditProfileDialog({
4648
name,
4749
description,
4850
githubLogin,
51+
twitterHandle,
4952
children,
5053
}: EditProfileDialogProps) {
5154
const [open, setOpen] = useState(false);
@@ -58,6 +61,7 @@ export function EditProfileDialog({
5861
name: name || "",
5962
description: description || "",
6063
githubLogin: githubLogin || "",
64+
twitterHandle: twitterHandle || "",
6165
},
6266
});
6367

@@ -67,9 +71,10 @@ export function EditProfileDialog({
6771
name: name || "",
6872
description: description || "",
6973
githubLogin: githubLogin || "",
74+
twitterHandle: twitterHandle || "",
7075
});
7176
}
72-
}, [open, name, description, githubLogin, form]);
77+
}, [open, name, description, githubLogin, twitterHandle, form]);
7378

7479
const onSubmit = async (values: FormValues) => {
7580
try {
@@ -78,6 +83,7 @@ export function EditProfileDialog({
7883
name: values.name,
7984
description: values.description || "",
8085
github_login: values.githubLogin || "",
86+
twitter_handle: values.twitterHandle || "",
8187
},
8288
});
8389
await queryClient.invalidateQueries({ queryKey: ["profiles"] });
@@ -145,6 +151,22 @@ export function EditProfileDialog({
145151
</FormItem>
146152
)}
147153
/>
154+
<FormField
155+
control={form.control}
156+
name="twitterHandle"
157+
render={({ field }) => (
158+
<FormItem>
159+
<FormLabel>Twitter/X Handle</FormLabel>
160+
<FormControl>
161+
<div className="flex items-center gap-2">
162+
<span className="text-sm text-gray-500">@</span>
163+
<Input placeholder="username" {...field} />
164+
</div>
165+
</FormControl>
166+
<FormMessage />
167+
</FormItem>
168+
)}
169+
/>
148170
<div className="flex justify-end gap-2 pt-2">
149171
<DialogClose asChild>
150172
<Button type="button" variant="secondary">

‎frontend/src/components/profiles/list/ProfileCard.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ interface ProfileCardProps {
2020
description?: string;
2121
avatar?: string;
2222
githubLogin?: string;
23+
twitterHandle?: string;
2324
attestationCount: number;
2425
attestations: Array<{
2526
id: string;
@@ -35,6 +36,7 @@ export function ProfileCard({
3536
description,
3637
avatar,
3738
githubLogin,
39+
twitterHandle,
3840
attestationCount,
3941
attestations,
4042
}: ProfileCardProps) {
@@ -96,6 +98,7 @@ export function ProfileCard({
9698
name={name}
9799
description={description}
98100
githubLogin={githubLogin}
101+
twitterHandle={twitterHandle}
99102
>
100103
<Button
101104
variant="ghost"

‎frontend/src/components/profiles/list/ProfilesList.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ export function ProfilesList() {
2222
name: p.name || "",
2323
description: p.description || "",
2424
githubLogin: p.github_login,
25+
twitterHandle: p.twitter_handle,
2526
attestationCount: 0,
2627
attestations: [],
2728
}))
@@ -116,6 +117,7 @@ export function ProfilesList() {
116117
name={profile.name}
117118
description={profile.description}
118119
githubLogin={profile.githubLogin}
120+
twitterHandle={profile.twitterHandle}
119121
attestationCount={profile.attestationCount}
120122
attestations={profile.attestations}
121123
/>

‎frontend/src/components/profiles/profile-page/ProfileActions.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,13 @@ export function ProfileActions({
1010
name,
1111
description,
1212
githubLogin,
13+
twitterHandle,
1314
}: {
1415
address?: string;
1516
name?: string;
1617
description?: string;
1718
githubLogin?: string;
19+
twitterHandle?: string;
1820
}) {
1921
const { address: connectedAddress } = useAccount();
2022
const isOwner =
@@ -30,6 +32,7 @@ export function ProfileActions({
3032
name={name}
3133
description={description}
3234
githubLogin={githubLogin}
35+
twitterHandle={twitterHandle}
3336
>
3437
<Button variant="outline" className="flex items-center gap-2">
3538
<Edit className="h-4 w-4" /> Edit Profile

‎frontend/src/components/profiles/profile-page/ProfileHeader.tsx‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,21 @@ import { useAccount } from "wagmi";
33
import AddressTokenBalance from "@/components/AddressTokenBalance";
44
import CopyAddressToClipboard from "@/components/CopyAddressToClipboard";
55
import { GithubIcon } from "@/components/ui/GithubIcon";
6+
import { XIcon } from "@/components/ui/XIcon";
67

78
interface ProfileHeaderProps {
89
address: string;
910
name?: string;
1011
description?: string;
1112
githubLogin?: string;
13+
twitterHandle?: string;
1214
}
1315

1416
export function ProfileHeader({
1517
address,
1618
name,
1719
githubLogin,
20+
twitterHandle,
1821
}: ProfileHeaderProps) {
1922
const displayName = name || (address ? `${address.slice(0, 6)}...${address.slice(-4)}` : "Profile");
2023
const displayAddress = address ? `${address.slice(0, 6)}...${address.slice(-4)}` : "";
@@ -60,6 +63,19 @@ export function ProfileHeader({
6063
</a>
6164
</div>
6265
)}
66+
{twitterHandle && (
67+
<div className="flex items-center gap-1.5 mt-1">
68+
<XIcon className="h-4 w-4 text-gray-500" />
69+
<a
70+
href={`https://x.com/${twitterHandle}`}
71+
target="_blank"
72+
rel="noopener noreferrer"
73+
className="text-sm text-gray-700 hover:text-indigo-600 hover:underline"
74+
>
75+
@{twitterHandle}
76+
</a>
77+
</div>
78+
)}
6379
<AddressTokenBalance address={address as `0x${string}`} />
6480
</div>
6581
</header>

‎frontend/src/components/profiles/profile-page/ProfileMain.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,13 +24,15 @@ export function ProfileMain({ address }: { address: string }) {
2424
name={profile?.name}
2525
description={profile?.description}
2626
githubLogin={profile?.github_login}
27+
twitterHandle={profile?.twitter_handle}
2728
/>
2829
<div className="mt-6">
2930
<ProfileActions
3031
address={address}
3132
name={profile?.name}
3233
description={profile?.description}
3334
githubLogin={profile?.github_login}
35+
twitterHandle={profile?.twitter_handle}
3436
/>
3537
</div>
3638
<ProfileDescription description={profile?.description} />

‎frontend/src/components/ui/XIcon.tsx‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
interface XIconProps {
2+
className?: string;
3+
}
4+
5+
export function XIcon({ className = "h-4 w-4" }: XIconProps) {
6+
return (
7+
<svg
8+
className={className}
9+
viewBox="0 0 24 24"
10+
fill="currentColor"
11+
xmlns="http://www.w3.org/2000/svg"
12+
>
13+
<path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
14+
</svg>
15+
);
16+
}

‎frontend/src/lib/constants/profileConstants.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ export const PROFILES: Profile[] = [
66
name: "Alice Developer",
77
description: "Full-stack developer passionate about Web3 and Rust",
88
githubLogin: "alice-dev",
9+
twitterHandle: "alice_dev",
910
attestationCount: 5,
1011
attestations: [
1112
{
@@ -33,6 +34,7 @@ export const PROFILES: Profile[] = [
3334
name: "Bob Builder",
3435
description: "Smart contract developer and DeFi enthusiast",
3536
githubLogin: "bob-builder",
37+
twitterHandle: "bob_builder",
3638
attestationCount: 3,
3739
attestations: [
3840
{
@@ -53,7 +55,8 @@ export const PROFILES: Profile[] = [
5355
address: "0x5555...7777",
5456
name: "",
5557
description: "",
56-
githubLogin: undefined,
58+
githubLogin: undefined,
59+
twitterHandle: undefined,
5760
attestationCount: 2,
5861
attestations: [
5962
{

0 commit comments

Comments
 (0)