Skip to content

Commit 8aa9e45

Browse files
OlaGreatOlaGreat
authored
Merge pull request OlaGreat#234 from blockchainrafik/profile_fixes
Profile fixes
2 parents 827d205 + 7748637 commit 8aa9e45

3 files changed

Lines changed: 89 additions & 40 deletions

File tree

‎frontend/src/app/dashboard/[campaignId]/page.tsx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
import { useEffect, useState } from "react";
44
import { useParams } from "next/navigation";
5+
import Link from "next/link";
56
import { AppShell } from "@/components/app-shell";
67
import {
78
AreaChart, Area, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer,
@@ -164,6 +165,10 @@ export default function DashboardPage() {
164165
return (
165166
<AppShell>
166167
<div className="mx-auto max-w-7xl space-y-8">
168+
<Link href={`/profile/${campaignId}`} className="text-sm text-indigo-500 hover:underline">
169+
← Back to profile
170+
</Link>
171+
167172
<header className="flex flex-col gap-2">
168173
<h1 className="text-3xl font-bold tracking-tight text-white">
169174
Campaign <span className="text-mint">Analytics</span>

‎frontend/src/app/profile/[username]/page.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,7 @@ export default async function ProfilePage({ params }: PageProps) {
107107
bio={profile.bio}
108108
walletAddress={profile.walletAddress}
109109
acceptedAssets={profile.acceptedAssets}
110+
avatarUrl={profile.avatarUrl || undefined}
110111
/>
111112

112113
<div className="px-2">

‎frontend/src/components/profile-card.tsx‎

Lines changed: 83 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ type ProfileCardProps = {
1313
bio: string;
1414
walletAddress: string;
1515
acceptedAssets: Asset[];
16+
avatarUrl?: string;
1617
email?: string;
1718
websiteUrl?: string;
1819
twitterHandle?: string;
@@ -25,12 +26,14 @@ export function ProfileCard({
2526
bio,
2627
walletAddress,
2728
acceptedAssets,
29+
avatarUrl,
2830
email,
2931
websiteUrl,
3032
twitterHandle,
3133
githubHandle,
3234
}: ProfileCardProps) {
3335
const [copied, setCopied] = useState(false);
36+
const [linkCopied, setLinkCopied] = useState(false);
3437
const isValid = isValidStellarAddress(walletAddress);
3538
const hasSocialLinks = email || websiteUrl || twitterHandle || githubHandle;
3639

@@ -40,53 +43,93 @@ export function ProfileCard({
4043
setTimeout(() => setCopied(false), 2000);
4144
};
4245

46+
const profileUrl = typeof window !== 'undefined'
47+
? `${window.location.origin}/profile/${username}`
48+
: `https://novasupport.xyz/profile/${username}`;
49+
50+
const handleCopyLink = async () => {
51+
await navigator.clipboard.writeText(profileUrl);
52+
setLinkCopied(true);
53+
setTimeout(() => setLinkCopied(false), 2000);
54+
};
55+
56+
const tweetText = encodeURIComponent(`Support me on NovaSupport: ${profileUrl}`);
57+
const tweetUrl = `https://twitter.com/intent/tweet?text=${tweetText}`;
58+
4359
const expertUrl = `https://stellar.expert/explorer/testnet/account/${walletAddress}`;
4460

4561
return (
4662
<article className="rounded-[2rem] border border-white/10 bg-white/[0.04] p-5 sm:p-7 shadow-xl shadow-black/15">
4763
<div className="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
48-
<div>
49-
<p className="text-xs uppercase tracking-[0.3em] text-mint">@{username}</p>
50-
<h1 className="mt-3 text-2xl sm:text-3xl font-semibold text-white">{displayName}</h1>
51-
<p className="mt-4 max-w-2xl text-sm sm:text-base leading-relaxed sm:leading-7 text-sky/80">{bio}</p>
52-
53-
{hasSocialLinks && (
54-
<div className="mt-4 flex flex-wrap gap-3">
55-
{websiteUrl && (
56-
<a
57-
href={websiteUrl}
58-
target="_blank"
59-
rel="noreferrer"
60-
className="text-xs text-sky/70 hover:text-mint transition"
61-
>
62-
🌐 Website
63-
</a>
64-
)}
65-
{twitterHandle && (
66-
<a
67-
href={`https://twitter.com/${twitterHandle}`}
68-
target="_blank"
69-
rel="noreferrer"
70-
className="text-xs text-sky/70 hover:text-mint transition"
71-
>
72-
𝕏 @{twitterHandle}
73-
</a>
74-
)}
75-
{githubHandle && (
76-
<a
77-
href={`https://github.com/${githubHandle}`}
78-
target="_blank"
79-
rel="noreferrer"
80-
className="text-xs text-sky/70 hover:text-mint transition"
81-
>
82-
GitHub
83-
</a>
84-
)}
85-
{email && (
86-
<span className="text-xs text-sky/50">{email}</span>
87-
)}
64+
<div className="flex gap-4">
65+
{avatarUrl ? (
66+
<img src={avatarUrl} alt={displayName} className="w-16 h-16 rounded-full object-cover" />
67+
) : (
68+
<div className="w-16 h-16 rounded-full bg-indigo-600 flex items-center justify-center text-white text-xl font-bold">
69+
{displayName.slice(0, 2).toUpperCase()}
8870
</div>
8971
)}
72+
<div>
73+
<p className="text-xs uppercase tracking-[0.3em] text-mint">@{username}</p>
74+
<h1 className="mt-3 text-2xl sm:text-3xl font-semibold text-white">{displayName}</h1>
75+
<p className="mt-4 max-w-2xl text-sm sm:text-base leading-relaxed sm:leading-7 text-sky/80">{bio}</p>
76+
77+
{/* Share Buttons */}
78+
<div className="mt-4 flex flex-wrap gap-2">
79+
<button
80+
onClick={handleCopyLink}
81+
className="rounded-full border border-white/10 bg-white/5 px-4 py-2 text-xs font-medium text-white hover:bg-white/10 transition-colors"
82+
>
83+
{linkCopied ? '✓ Link copied!' : '🔗 Copy link'}
84+
</button>
85+
<a
86+
href={tweetUrl}
87+
target="_blank"
88+
rel="noopener noreferrer"
89+
className="rounded-full border border-white/10 bg-white/5 px-4 py-2 text-xs font-medium text-white hover:bg-white/10 transition-colors inline-block"
90+
>
91+
𝕏 Share on X
92+
</a>
93+
</div>
94+
95+
{hasSocialLinks && (
96+
<div className="mt-4 flex flex-wrap gap-3">
97+
{websiteUrl && (
98+
<a
99+
href={websiteUrl}
100+
target="_blank"
101+
rel="noreferrer"
102+
className="text-xs text-sky/70 hover:text-mint transition"
103+
>
104+
🌐 Website
105+
</a>
106+
)}
107+
{twitterHandle && (
108+
<a
109+
href={`https://twitter.com/${twitterHandle}`}
110+
target="_blank"
111+
rel="noreferrer"
112+
className="text-xs text-sky/70 hover:text-mint transition"
113+
>
114+
𝕏 @{twitterHandle}
115+
</a>
116+
)}
117+
{githubHandle && (
118+
<a
119+
href={`https://github.com/${githubHandle}`}
120+
target="_blank"
121+
rel="noreferrer"
122+
className="text-xs text-sky/70 hover:text-mint transition"
123+
>
124+
GitHub
125+
</a>
126+
)}
127+
{email && (
128+
<span className="text-xs text-sky/50">{email}</span>
129+
)}
130+
</div>
131+
)}
132+
</div>
90133
</div>
91134
<div className="w-full sm:w-auto mt-4 sm:mt-0 rounded-3xl border border-mint/20 bg-ink/50 px-4 py-3 text-sm text-sky/80">
92135
<p className="font-semibold text-white">Stellar Wallet</p>

0 commit comments

Comments
 (0)