Skip to content

Commit 4777956

Browse files
mxclmxcl
authored
Merge pull request #166 from pkgxdev/updated-stats
fix dynamic stats, fix images, move stats, add sepolia
2 parents b25a537 + af84f4b commit 4777956

File tree

1 file changed

+85
-57
lines changed

1 file changed

+85
-57
lines changed

‎src/pkgx.dev/TeaProtocol.tsx‎

Lines changed: 85 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,23 @@ import {
99
} from "@mui/material";
1010
import { Helmet } from "react-helmet";
1111
import backgroundPattern from "../assets/pkgx-bg-pattern-right.svg";
12+
import tea3dLogo from "../assets/tea-3d-logo.png";
13+
import teaGlitch from "../assets/tea-glitch.png";
1214

1315
const fallbackStats = {
14-
totalBlocks: "3.055M",
15-
dailyTransactions: "2.17M",
16-
totalTransactions: "90.155M",
17-
walletAddresses: "349.601M"
16+
assam: {
17+
totalBlocks: "3.055M",
18+
dailyTransactions: "2.17M",
19+
totalTransactions: "90.155M",
20+
walletAddresses: "349.601M"
21+
},
22+
sepolia: {
23+
totalBlocks: "303.2k",
24+
dailyTransactions: "329.2k",
25+
totalTransactions: "661.8k",
26+
walletAddresses: "687.8k",
27+
kycAttestations: "30.5k"
28+
}
1829
};
1930

2031
const features = [
@@ -41,42 +52,40 @@ const features = [
4152
];
4253

4354
const TeaProtocol = () => {
44-
const [stats, setStats] = React.useState(fallbackStats);
55+
const [assamStats, setAssamStats] = React.useState(fallbackStats['assam']);
56+
const [sepoliaStats, setSepoliaStats] = React.useState(fallbackStats['sepolia']);
4557

4658
React.useEffect(() => {
4759
const fetchStats = async () => {
48-
try {
49-
const format = (val: string | number) => parseInt(val.toString()).toLocaleString();
50-
51-
const fetchJSON = async (url: string) => {
52-
const res = await fetch(url);
53-
if (!res.ok) throw new Error("Request failed");
54-
return res.json();
55-
};
56-
57-
const [blocksRes, txsRes, walletsRes] = await Promise.all([
58-
fetchJSON("https://assam.tea.xyz/api?module=proxy&action=eth_blockNumber"),
59-
fetchJSON("https://assam.tea.xyz/api?module=stats&action=txsCount"),
60-
fetchJSON("https://assam.tea.xyz/api?module=stats&action=addressCount")
61-
]);
62-
63-
const totalBlocks = format(parseInt(blocksRes.result, 16));
64-
const totalTransactions = format(txsRes.result);
65-
const walletAddresses = format(walletsRes.result);
66-
67-
setStats({
68-
totalBlocks,
69-
totalTransactions,
70-
walletAddresses,
71-
dailyTransactions: fallbackStats.dailyTransactions
72-
});
73-
} catch (err) {
74-
console.warn("Using fallback stats due to error:", err);
75-
setStats(fallbackStats);
76-
}
60+
// lambda proxy to bypass CORS
61+
const response = await fetch(`https://yo2fkzmf2rh33u2b3bi3xhtqyi0toyqz.lambda-url.us-east-1.on.aws/?url=/stats&network=assam`);
62+
const data = await response.json();
63+
64+
setAssamStats({
65+
totalBlocks: parseInt(data.total_blocks).toLocaleString(),
66+
dailyTransactions: `${(parseInt(data.transactions_today) / 1000000).toFixed(2)}M`,
67+
totalTransactions: parseInt(data.total_transactions).toLocaleString(),
68+
walletAddresses: parseInt(data.total_addresses).toLocaleString()
69+
});
70+
71+
const response2 = await fetch(`https://yo2fkzmf2rh33u2b3bi3xhtqyi0toyqz.lambda-url.us-east-1.on.aws/?url=/stats&network=sepolia`);
72+
const data2 = await response2.json();
73+
74+
setSepoliaStats({
75+
totalBlocks: parseInt(data2.total_blocks).toLocaleString(),
76+
dailyTransactions: `${(parseInt(data2.transactions_today) / 1000000).toFixed(2)}M`,
77+
totalTransactions: parseInt(data2.total_transactions).toLocaleString(),
78+
walletAddresses: parseInt(data2.total_addresses).toLocaleString(),
79+
kycAttestations: "30.5k"
80+
});
7781
};
7882

79-
fetchStats();
83+
fetchStats().catch((error) => {
84+
console.error("Error fetching stats:", error);
85+
setAssamStats(fallbackStats['assam']);
86+
setSepoliaStats(fallbackStats['sepolia']);
87+
});
88+
8089
}, []);
8190

8291
return (
@@ -101,6 +110,45 @@ const TeaProtocol = () => {
101110
width: "100%"
102111
}}
103112
>
113+
114+
{/* Metrics Section */}
115+
<Container maxWidth="lg" sx={{ textAlign: "center", py: { xs: 6, md: 10 } }}>
116+
<Box sx={{ maxWidth: "700px", mx: "auto" }}>
117+
<Typography variant="h2" gutterBottom sx={{ fontWeight: 800, fontSize: "32px", lineHeight: "42px", color: "#EDF2EF" }}>
118+
Everyone's <span style={{ color: "#F26212" }}>sipping the tea</span>.
119+
</Typography>
120+
<Typography variant="body1" paragraph sx={{ color: "#EDF2EF" }}>
121+
tea Protocol is trusted by hundreds of thousands of developers, contributors, and organizations worldwide. See the impact we've made in the open-source community.
122+
</Typography>
123+
</Box>
124+
<Box>
125+
<Typography variant="h3" gutterBottom sx={{ fontWeight: 800, fontSize: "24px", lineHeight: "32px", color: "#EDF2EF" }}>
126+
Sepolia Network Stats
127+
</Typography>
128+
<Grid container spacing={4} justifyContent="center">
129+
{Object.entries(sepoliaStats).map(([key, value]) => (
130+
<Grid item xs={12} sm={6} md={2} key={key}>
131+
<Typography sx={{ fontWeight: "bold", fontSize: "32px", color: "#EDF2EF" }}>{value}</Typography>
132+
<Typography variant="body1" sx={{ color: "#EDF2EF" }}>{key.replace(/([A-Z])/g, ' $1').replace(/^./, str => str.toUpperCase())}</Typography>
133+
</Grid>
134+
))}
135+
</Grid>
136+
</Box>
137+
<Box>
138+
<Typography variant="h3" gutterBottom sx={{ fontWeight: 800, fontSize: "24px", lineHeight: "32px", color: "#EDF2EF" }}>
139+
Assam Network Stats (deprecated)
140+
</Typography>
141+
<Grid container spacing={4} justifyContent="center">
142+
{Object.entries(assamStats).map(([key, value]) => (
143+
<Grid item xs={12} sm={6} md={2} key={key}>
144+
<Typography sx={{ fontWeight: "bold", fontSize: "32px", color: "#EDF2EF" }}>{value}</Typography>
145+
<Typography variant="body1" sx={{ color: "#EDF2EF" }}>{key.replace(/([A-Z])/g, ' $1').replace(/^./, str => str.toUpperCase())}</Typography>
146+
</Grid>
147+
))}
148+
</Grid>
149+
</Box>
150+
</Container>
151+
104152
{/* Hero Section */}
105153
<Container maxWidth="lg" sx={{ py: { xs: 6, md: 10 } }}>
106154
<Grid container spacing={{ xs: 4, md: 8 }} alignItems="stretch" direction={{ xs: 'column-reverse', md: 'row' }}>
@@ -138,37 +186,17 @@ const TeaProtocol = () => {
138186
width: "100%"
139187
}}
140188
>
141-
<Box component="img" src="/src/assets/tea-3d-logo.png" alt="tea logo" sx={{ width: "80%", maxWidth: "300px" }} />
189+
<Box component="img" src={tea3dLogo} alt="tea logo" sx={{ width: "80%", maxWidth: "300px" }} />
142190
</Box>
143191
</Grid>
144192
</Grid>
145193
</Container>
146194

147-
{/* Metrics Section */}
148-
<Container maxWidth="lg" sx={{ textAlign: "center", py: { xs: 6, md: 10 } }}>
149-
<Box sx={{ maxWidth: "700px", mx: "auto" }}>
150-
<Typography variant="h2" gutterBottom sx={{ fontWeight: 800, fontSize: "32px", lineHeight: "42px", color: "#EDF2EF" }}>
151-
Everyone's <span style={{ color: "#F26212" }}>sipping the tea</span>.
152-
</Typography>
153-
<Typography variant="body1" paragraph sx={{ color: "#EDF2EF" }}>
154-
tea Protocol is trusted by hundreds of thousands of developers, contributors, and organizations worldwide. See the impact we've made in the open-source community.
155-
</Typography>
156-
</Box>
157-
<Grid container spacing={4} justifyContent="center">
158-
{Object.entries(stats).map(([key, value]) => (
159-
<Grid item xs={12} sm={6} md={3} key={key}>
160-
<Typography sx={{ fontWeight: "bold", fontSize: "32px", color: "#EDF2EF" }}>{value}</Typography>
161-
<Typography variant="body1" sx={{ color: "#EDF2EF" }}>{key.replace(/([A-Z])/g, ' $1').replace(/^./, str => str.toUpperCase())}</Typography>
162-
</Grid>
163-
))}
164-
</Grid>
165-
</Container>
166-
167195
{/* Feature Section */}
168196
<Container maxWidth="lg" sx={{ py: { xs: 6, md: 10 } }}>
169197
<Grid container spacing={4} alignItems="center">
170198
<Grid item xs={12} md={4}>
171-
<Box component="img" src="/src/assets/tea-glitch.png" alt="tea glitch image" sx={{ width: "100%", aspectRatio: "1 / 1", borderRadius: "8px", mb: 3 }} />
199+
<Box component="img" src={teaGlitch} alt="tea glitch image" sx={{ width: "100%", aspectRatio: "1 / 1", borderRadius: "8px", mb: 3 }} />
172200
<Typography variant="h2" sx={{ fontWeight: 800, fontSize: "32px", lineHeight: "42px", color: "#EDF2EF", mb: 2 }}>
173201
There's something brewing for <span style={{ color: "#F26212" }}>everyone</span>.
174202
</Typography>

0 commit comments

Comments
 (0)