Skip to content

Commit c4a78dc

Browse files
corwintinescorwintines
authored
Merge pull request #15969 from ethereum/master
Master
2 parents 1660385 + 5085005 commit c4a78dc

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

48 files changed

+2001
-219
lines changed

‎.env.example

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,3 @@ ANALYZE=false
4848
# Use mock data for development. Set to "false" to use live data but you must have the
4949
# environment variables set to make api requests
5050
USE_MOCK_DATA=true
51-
52-
# Google Sheet ID for torch holders
53-
GOOGLE_SHEET_ID_TORCH_HOLDERS=

‎app/[locale]/10years/_components/CountDown/index.tsx

Lines changed: 76 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,18 @@ interface CountDownProps {
1010
className?: string
1111
timeLeftLabels: TimeLeftLabels
1212
expiredLabel: string
13+
dateTime: string
14+
hideZeroUnits?: boolean
15+
onExpired?: () => void
1316
}
1417

1518
const CountDown = ({
1619
className,
1720
timeLeftLabels,
1821
expiredLabel,
22+
dateTime,
23+
hideZeroUnits = false,
24+
onExpired,
1925
}: CountDownProps) => {
2026
const [timeLeft, setTimeLeft] = useState({
2127
days: 0,
@@ -26,7 +32,7 @@ const CountDown = ({
2632
const [isExpired, setIsExpired] = useState(false)
2733

2834
useEffect(() => {
29-
const targetDate = new Date("2025-07-30T15:44:00Z")
35+
const targetDate = new Date(dateTime)
3036

3137
const calculateTimeLeft = () => {
3238
const now = new Date()
@@ -41,7 +47,10 @@ const CountDown = ({
4147
seconds: Math.floor((difference / 1000) % 60),
4248
})
4349
} else {
44-
setIsExpired(true)
50+
if (!isExpired) {
51+
setIsExpired(true)
52+
onExpired?.()
53+
}
4554
}
4655
}
4756

@@ -51,74 +60,81 @@ const CountDown = ({
5160
const timer = setInterval(calculateTimeLeft, 1000)
5261

5362
return () => clearInterval(timer)
54-
}, [])
63+
}, [isExpired, onExpired, dateTime])
5564

5665
if (isExpired) {
5766
return <div className="text-center text-2xl font-bold">{expiredLabel}</div>
5867
}
5968

6069
return (
61-
<div className="flex items-center justify-center gap-10">
62-
<div
63-
className={cn(
64-
"flex h-20 w-20 flex-col items-center justify-center rounded-2xl border text-center [box-shadow:-2.372px_2.372px_14.234px_1.186px_rgba(52,43,64,0.02),-18.979px_18.979px_14.234px_-3.559px_rgba(52,43,64,0.02),-37.958px_37.958px_28.469px_-7.117px_rgba(52,43,64,0.02),-47.448px_47.448px_47.448px_-14.234px_rgba(88,55,131,0.04)] dark:bg-[#171717]",
65-
className
66-
)}
67-
>
68-
<div className="font-mono text-4xl font-bold text-accent-a">
69-
{timeLeft.days}
70+
<div className="flex items-center justify-center gap-10 text-accent-a">
71+
{(!hideZeroUnits || timeLeft.days > 0) && (
72+
<div
73+
className={cn(
74+
"flex h-20 w-20 flex-col items-center justify-center rounded-2xl border text-center [box-shadow:-2.372px_2.372px_14.234px_1.186px_rgba(52,43,64,0.02),-18.979px_18.979px_14.234px_-3.559px_rgba(52,43,64,0.02),-37.958px_37.958px_28.469px_-7.117px_rgba(52,43,64,0.02),-47.448px_47.448px_47.448px_-14.234px_rgba(88,55,131,0.04)] dark:bg-[#171717]",
75+
className
76+
)}
77+
>
78+
<div className="font-mono text-4xl font-bold">{timeLeft.days}</div>
79+
<div className="font-mono text-xs">
80+
{timeLeft.days === 1
81+
? timeLeftLabels.days.singular
82+
: timeLeftLabels.days.plural}
83+
</div>
7084
</div>
71-
<div className="font-mono text-xs text-accent-a">
72-
{timeLeft.days === 1
73-
? timeLeftLabels.days.singular
74-
: timeLeftLabels.days.plural}
85+
)}
86+
{(!hideZeroUnits || timeLeft.days > 0 || timeLeft.hours > 0) && (
87+
<div
88+
className={cn(
89+
"flex h-20 w-20 flex-col items-center justify-center rounded-2xl border text-center [box-shadow:-2.372px_2.372px_14.234px_1.186px_rgba(52,43,64,0.02),-18.979px_18.979px_14.234px_-3.559px_rgba(52,43,64,0.02),-37.958px_37.958px_28.469px_-7.117px_rgba(52,43,64,0.02),-47.448px_47.448px_47.448px_-14.234px_rgba(88,55,131,0.04)] dark:bg-[#171717]",
90+
className
91+
)}
92+
>
93+
<div className="font-mono text-4xl font-bold">{timeLeft.hours}</div>
94+
<div className="font-mono text-xs">
95+
{timeLeft.hours === 1
96+
? timeLeftLabels.hours.singular
97+
: timeLeftLabels.hours.plural}
98+
</div>
7599
</div>
76-
</div>
77-
<div
78-
className={cn(
79-
"flex h-20 w-20 flex-col items-center justify-center rounded-2xl border text-center [box-shadow:-2.372px_2.372px_14.234px_1.186px_rgba(52,43,64,0.02),-18.979px_18.979px_14.234px_-3.559px_rgba(52,43,64,0.02),-37.958px_37.958px_28.469px_-7.117px_rgba(52,43,64,0.02),-47.448px_47.448px_47.448px_-14.234px_rgba(88,55,131,0.04)] dark:bg-[#171717]",
80-
className
81-
)}
82-
>
83-
<div className="font-mono text-4xl font-bold text-accent-a">
84-
{timeLeft.hours}
100+
)}
101+
{(!hideZeroUnits ||
102+
timeLeft.days > 0 ||
103+
timeLeft.hours > 0 ||
104+
timeLeft.minutes > 0) && (
105+
<div
106+
className={cn(
107+
"flex h-20 w-20 flex-col items-center justify-center rounded-2xl border text-center [box-shadow:-2.372px_2.372px_14.234px_1.186px_rgba(52,43,64,0.02),-18.979px_18.979px_14.234px_-3.559px_rgba(52,43,64,0.02),-37.958px_37.958px_28.469px_-7.117px_rgba(52,43,64,0.02),-47.448px_47.448px_47.448px_-14.234px_rgba(88,55,131,0.04)] dark:bg-[#171717]",
108+
className
109+
)}
110+
>
111+
<div className="font-mono text-4xl font-bold">{timeLeft.minutes}</div>
112+
<div className="font-mono text-xs">
113+
{timeLeft.minutes === 1
114+
? timeLeftLabels.minutes.singular
115+
: timeLeftLabels.minutes.plural}
116+
</div>
85117
</div>
86-
<div className="font-mono text-xs text-accent-a">
87-
{timeLeft.hours === 1
88-
? timeLeftLabels.hours.singular
89-
: timeLeftLabels.hours.plural}
118+
)}
119+
{(!hideZeroUnits ||
120+
timeLeft.days > 0 ||
121+
timeLeft.hours > 0 ||
122+
timeLeft.minutes > 0 ||
123+
timeLeft.seconds > 0) && (
124+
<div
125+
className={cn(
126+
"hidden h-20 w-20 flex-col items-center justify-center rounded-2xl border text-center [box-shadow:-2.372px_2.372px_14.234px_1.186px_rgba(52,43,64,0.02),-18.979px_18.979px_14.234px_-3.559px_rgba(52,43,64,0.02),-37.958px_37.958px_28.469px_-7.117px_rgba(52,43,64,0.02),-47.448px_47.448px_47.448px_-14.234px_rgba(88,55,131,0.04)] lg:flex dark:bg-[#171717]",
127+
className
128+
)}
129+
>
130+
<div className="font-mono text-4xl font-bold">{timeLeft.seconds}</div>
131+
<div className="font-mono text-xs">
132+
{timeLeft.seconds === 1
133+
? timeLeftLabels.seconds.singular
134+
: timeLeftLabels.seconds.plural}
135+
</div>
90136
</div>
91-
</div>
92-
<div
93-
className={cn(
94-
"flex h-20 w-20 flex-col items-center justify-center rounded-2xl border text-center [box-shadow:-2.372px_2.372px_14.234px_1.186px_rgba(52,43,64,0.02),-18.979px_18.979px_14.234px_-3.559px_rgba(52,43,64,0.02),-37.958px_37.958px_28.469px_-7.117px_rgba(52,43,64,0.02),-47.448px_47.448px_47.448px_-14.234px_rgba(88,55,131,0.04)] dark:bg-[#171717]",
95-
className
96-
)}
97-
>
98-
<div className="font-mono text-4xl font-bold text-accent-a">
99-
{timeLeft.minutes}
100-
</div>
101-
<div className="font-mono text-xs text-accent-a">
102-
{timeLeft.minutes === 1
103-
? timeLeftLabels.minutes.singular
104-
: timeLeftLabels.minutes.plural}
105-
</div>
106-
</div>
107-
<div
108-
className={cn(
109-
"hidden h-20 w-20 flex-col items-center justify-center rounded-2xl border text-center [box-shadow:-2.372px_2.372px_14.234px_1.186px_rgba(52,43,64,0.02),-18.979px_18.979px_14.234px_-3.559px_rgba(52,43,64,0.02),-37.958px_37.958px_28.469px_-7.117px_rgba(52,43,64,0.02),-47.448px_47.448px_47.448px_-14.234px_rgba(88,55,131,0.04)] lg:flex dark:bg-[#171717]",
110-
className
111-
)}
112-
>
113-
<div className="font-mono text-4xl font-bold text-accent-a">
114-
{timeLeft.seconds}
115-
</div>
116-
<div className="font-mono text-xs text-accent-a">
117-
{timeLeft.seconds === 1
118-
? timeLeftLabels.seconds.singular
119-
: timeLeftLabels.seconds.plural}
120-
</div>
121-
</div>
137+
)}
122138
</div>
123139
)
124140
}

‎app/[locale]/10years/_components/NFTMintCard/Connected.tsx

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import { Address } from "viem"
2+
import { useDisconnect, useSwitchChain } from "wagmi"
3+
4+
import { Avatar } from "@/components/ui/avatar"
5+
import { Button } from "@/components/ui/buttons/Button"
6+
7+
import { useNetworkContract } from "@/hooks/useNetworkContract"
8+
import {
9+
formatAddress,
10+
getAddressEtherscanUrl,
11+
getBlockieImage,
12+
} from "@/lib/torch"
13+
14+
export default function Connected({
15+
address,
16+
ensName,
17+
}: {
18+
address: Address
19+
ensName?: string | null
20+
}) {
21+
const { disconnect } = useDisconnect()
22+
const { isSupportedNetwork, networkName, chainId } = useNetworkContract()
23+
const { switchChain, isPending } = useSwitchChain()
24+
25+
const handleSwitchNetwork = () => {
26+
switchChain({ chainId })
27+
}
28+
29+
return (
30+
<div className="flex flex-col items-center justify-between space-y-2">
31+
{/* Wallet Info */}
32+
<div className="flex items-center gap-4">
33+
<Avatar
34+
className="h-6 w-6 !shadow-none"
35+
src={getBlockieImage(address)}
36+
href={getAddressEtherscanUrl(address)}
37+
name={ensName || formatAddress(address)}
38+
/>
39+
<div>{ensName || formatAddress(address)}</div>
40+
</div>
41+
42+
{/* Network Status */}
43+
<div className="text-center">
44+
{isSupportedNetwork ? (
45+
<div className="flex items-center gap-2 text-sm text-success">
46+
<div className="h-2 w-2 rounded-full bg-success"></div>
47+
<span>Connected to {networkName}</span>
48+
</div>
49+
) : (
50+
<div className="flex flex-col items-center gap-2">
51+
<div className="flex items-center gap-2 text-sm text-error">
52+
<div className="h-2 w-2 rounded-full bg-error"></div>
53+
<span>Unsupported Network</span>
54+
</div>
55+
<Button
56+
size="sm"
57+
onClick={handleSwitchNetwork}
58+
disabled={isPending}
59+
>
60+
{isPending ? "Switching..." : `Switch to ${networkName}`}
61+
</Button>
62+
</div>
63+
)}
64+
</div>
65+
66+
{/* Disconnect Button */}
67+
<Button
68+
variant="link"
69+
size="sm"
70+
onClick={() => disconnect()}
71+
className="text-body-medium"
72+
>
73+
disconnect
74+
</Button>
75+
</div>
76+
)
77+
}

‎app/[locale]/10years/_components/NFTMintCard/Connection.tsx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { useAccount } from "wagmi"
2+
3+
import MintConnect from "./views/MintConnect"
4+
import Prechecks from "./Prechecks"
5+
6+
export default function Connection() {
7+
const { address, isConnected } = useAccount()
8+
9+
if (!isConnected || !address) {
10+
return <MintConnect />
11+
}
12+
13+
return <Prechecks address={address} />
14+
}

‎app/[locale]/10years/_components/NFTMintCard/GasFeeInformation.tsx

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import { Info } from "lucide-react"
2+
3+
import {
4+
Alert,
5+
AlertContent,
6+
AlertDescription,
7+
AlertTitle,
8+
} from "@/components/ui/alert"
9+
10+
const GasFeeInformation = () => {
11+
return (
12+
<Alert variant="warning" className="w-full rounded-none border-none">
13+
<Info className="h-5 w-5 !text-yellow-600" />
14+
<AlertContent>
15+
<AlertTitle className="!text-yellow-800">About Network Fees</AlertTitle>
16+
<AlertDescription className="text-sm text-yellow-700">
17+
While the NFT is free, you&apos;ll need to pay Ethereum network fees
18+
to complete the transaction. Network fees vary throughout the day -
19+
consider waiting for lower network fees periods to save on costs.
20+
</AlertDescription>
21+
</AlertContent>
22+
</Alert>
23+
)
24+
}
25+
26+
export default GasFeeInformation

0 commit comments

Comments
 (0)