Skip to content

Commit c061946

Browse files
jlm0jlm0
authored
fix: panel adjustments, analytics, activity location, and more (#4692)
1 parent faa02b9 commit c061946

33 files changed

Lines changed: 1146 additions & 499 deletions

File tree

‎src/components/Navbar/SiteNavigation.tsx‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import { TransactionsList } from './components/TransactionList/TransactionsList'
1515
import { ChangeNetworksButton } from './components/Wallet/ChangeNetworksButton'
1616
import { WalletButton } from './components/Wallet/WalletButton'
1717
import ProtocolActivityToggle from 'components/ProtocolActivity/ProtocolActivityToggle'
18+
import { useRouter } from 'next/router'
1819

1920
export function SiteNavigation() {
2021
const [hasMounted, setHasMounted] = useState(false)
@@ -33,6 +34,12 @@ export function SiteNavigation() {
3334

3435
const DesktopSiteNavigation = () => {
3536
const { chainUnsupported } = useWallet()
37+
const router = useRouter()
38+
39+
// Hide protocol activity toggle on project pages
40+
const isProjectPage = router.pathname.startsWith('/v5/') || router.pathname.startsWith('/v4/')
41+
const isProjectRoute = /^\/(v4|v5)\/[^\/]+/.test(router.asPath)
42+
const showProtocolActivityToggle = !(isProjectPage && isProjectRoute)
3643

3744
return (
3845
<div className="z-20 w-full min-w-0 px-6 xl:px-20">
@@ -74,7 +81,7 @@ const DesktopSiteNavigation = () => {
7481
<NavLanguageSelector className="md:order-2" />
7582
<ThemePicker className="md:order-3" />
7683
<QuickProjectSearchButton className="md:order-1" />
77-
<ProtocolActivityToggle className="hidden md:flex md:order-4" />
84+
{showProtocolActivityToggle && <ProtocolActivityToggle className="hidden md:flex md:order-4" />}
7885
<TransactionsList listClassName="absolute top-full mt-4 right-0 md:-right-6 md:w-[320px] w-full" />
7986
</div>
8087
</div>
@@ -93,6 +100,12 @@ const DesktopSiteNavigation = () => {
93100

94101
const MobileSiteNavigation = () => {
95102
const { chainUnsupported } = useWallet()
103+
const router = useRouter()
104+
105+
// Hide protocol activity toggle on project pages
106+
const isProjectPage = router.pathname.startsWith('/v5/') || router.pathname.startsWith('/v4/')
107+
const isProjectRoute = /^\/(v4|v5)\/[^\/]+/.test(router.asPath)
108+
const showProtocolActivityToggle = !(isProjectPage && isProjectRoute)
96109

97110
return (
98111
<div className="fixed z-20 w-full min-w-0 md:static md:px-6 xl:px-20">
@@ -157,7 +170,7 @@ const MobileSiteNavigation = () => {
157170
<NavLanguageSelector className="md:order-2" />
158171
<ThemePicker className="md:order-3" />
159172
<QuickProjectSearchButton className="md:order-1" />
160-
<ProtocolActivityToggle className="hidden md:flex md:order-4" />
173+
{showProtocolActivityToggle && <ProtocolActivityToggle className="hidden md:flex md:order-4" />}
161174
<TransactionsList listClassName="absolute top-full mt-4 right-0 md:-right-6 md:w-[320px] w-full" />
162175
</div>
163176
</div>

‎src/components/ProjectPageSEO.tsx‎

Lines changed: 13 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { JBChainId, toJbUrn } from 'juice-sdk-core'
33
import { ProjectMetadata } from 'models/projectMetadata'
44
import { cidFromUrl, ipfsPublicGatewayUrl } from 'utils/ipfs'
55
import { stripHtmlTags } from 'utils/string'
6-
import { SEO } from './common/SEO/SEO'
6+
import { SEOHead } from './SEOHead'
77

88
const ProjectPageSEO: React.FC<{
99
metadata?: ProjectMetadata
@@ -14,25 +14,20 @@ const ProjectPageSEO: React.FC<{
1414
? ipfsPublicGatewayUrl(cidFromUrl(metadata.logoUri))
1515
: undefined
1616

17+
const description = metadata?.projectTagline
18+
? metadata.projectTagline
19+
: metadata?.description
20+
? stripHtmlTags(metadata.description)
21+
: undefined
22+
1723
return (
18-
<SEO
19-
// Set known values, leave others undefined to be overridden
24+
<SEOHead
2025
title={metadata?.name}
2126
url={url}
22-
description={
23-
metadata?.projectTagline
24-
? metadata.projectTagline
25-
: metadata?.description
26-
? stripHtmlTags(metadata.description)
27-
: undefined
28-
}
27+
description={description}
2928
image={projectImage}
30-
twitter={{
31-
card: 'summary_large_image',
32-
creator: metadata?.twitter,
33-
handle: metadata?.twitter,
34-
image: projectImage,
35-
}}
29+
twitterCard="summary_large_image"
30+
twitterCreator={metadata?.twitter}
3631
/>
3732
)
3833
}
@@ -50,9 +45,7 @@ export const V4ProjectSEO: React.FC<{
5045
projectId: number
5146
}> = ({ metadata, chainId, projectId }) => {
5247
const urn = toJbUrn(chainId, BigInt(projectId))
53-
return (
54-
<ProjectPageSEO metadata={metadata} url={`${SiteBaseUrl}v4/p/${urn}`} />
55-
)
48+
return <ProjectPageSEO metadata={metadata} url={`${SiteBaseUrl}v4/${urn}`} />
5649
}
5750

5851
export const V5ProjectSEO: React.FC<{
@@ -61,7 +54,5 @@ export const V5ProjectSEO: React.FC<{
6154
projectId: number
6255
}> = ({ metadata, chainId, projectId }) => {
6356
const urn = toJbUrn(chainId, BigInt(projectId))
64-
return (
65-
<ProjectPageSEO metadata={metadata} url={`${SiteBaseUrl}v5/p/${urn}`} />
66-
)
57+
return <ProjectPageSEO metadata={metadata} url={`${SiteBaseUrl}v5/${urn}`} />
6758
}

‎src/components/ProtocolActivity/ProtocolActivityElement.tsx‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
import EthereumAddress from 'components/EthereumAddress'
2+
import EtherscanLink from 'components/EtherscanLink'
3+
import ProjectLogo from 'components/ProjectLogo'
4+
import { JBChainId } from 'juice-sdk-react'
5+
import { ChainLogo } from 'packages/v4v5/components/ChainLogo'
6+
import { formatHistoricalDate } from 'utils/format/formatDate'
7+
8+
export interface ProtocolActivityElementEvent {
9+
id: string
10+
timestamp: number
11+
txHash: string
12+
chainId: number
13+
from: string
14+
projectId?: number
15+
projectName?: string | null
16+
projectHandle?: string | null
17+
}
18+
19+
export function ProtocolActivityElement({
20+
header,
21+
subject,
22+
event,
23+
projectName,
24+
}: {
25+
header: string | JSX.Element
26+
subject: string | JSX.Element | null
27+
event: ProtocolActivityElementEvent | null | undefined
28+
projectName: string
29+
}) {
30+
if (!event) return null
31+
32+
const displayName = projectName || `Project #${event.projectId || '?'}`
33+
34+
return (
35+
<div className="flex gap-3">
36+
{/* Project Logo - 48x48px */}
37+
<div className="flex-shrink-0">
38+
<ProjectLogo
39+
className="h-12 w-12"
40+
projectId={event.projectId}
41+
name={displayName}
42+
pv={'5'}
43+
/>
44+
</div>
45+
46+
{/* Content */}
47+
<div className="flex-1 min-w-0">
48+
{/* Row 1: Project Name + Chain Icon */}
49+
<div className="flex items-center justify-between gap-2 mb-1">
50+
<div className="font-medium text-base truncate max-w-[180px]">
51+
{displayName}
52+
</div>
53+
<ChainLogo
54+
chainId={event.chainId as JBChainId}
55+
width={18}
56+
height={18}
57+
/>
58+
</div>
59+
60+
{/* Row 2: Action Label + Amount */}
61+
<div className="flex items-baseline gap-2 mb-1">
62+
<span className="text-sm text-grey-600 dark:text-grey-400 capitalize">
63+
{header}
64+
</span>
65+
<div className="font-heading text-lg whitespace-nowrap">
66+
{subject}
67+
</div>
68+
</div>
69+
70+
{/* Row 3: Timestamp + From Address */}
71+
<div className="flex items-center gap-2 text-xs text-grey-500 dark:text-grey-500">
72+
<span>{formatHistoricalDate(event.timestamp * 1000)}</span>
73+
<span>·</span>
74+
<EtherscanLink
75+
value={event.txHash}
76+
type="tx"
77+
className="text-grey-500 dark:text-grey-500"
78+
chainId={event.chainId as JBChainId}
79+
/>
80+
<span>·</span>
81+
<EthereumAddress
82+
address={event.from}
83+
tooltipDisabled={false}
84+
linkDisabled
85+
/>
86+
</div>
87+
</div>
88+
</div>
89+
)
90+
}

0 commit comments

Comments
 (0)