Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1import {
2 DEFAULT_COLLECT_TOKEN,
3 PERMISSIONS,
4 WRAPPED_NATIVE_TOKEN_SYMBOL
5} from "@hey/data/constants";
6import { useProStatsQuery } from "@hey/indexer";
7import Loader from "@/components/Shared/Loader";
8import NumberedStat from "@/components/Shared/NumberedStat";
9import { Card, CardHeader, ErrorMessage } from "@/components/Shared/UI";
10import { useAccountStore } from "@/store/persisted/useAccountStore";
11
12const Overview = () => {
13 const { currentAccount } = useAccountStore();
14
15 const { data, error, loading } = useProStatsQuery({
16 pollInterval: 3000,
17 variables: {
18 balancesBulkRequest: {
19 address: currentAccount?.owner,
20 tokens: [DEFAULT_COLLECT_TOKEN]
21 },
22 groupStatsRequest: { group: PERMISSIONS.SUBSCRIPTION }
23 }
24 });
25
26 if (loading) {
27 return (
28 <Card>
29 <Loader className="my-10" />
30 </Card>
31 );
32 }
33
34 if (error) {
35 return <ErrorMessage error={error} title="Failed to load pro stats" />;
36 }
37
38 return (
39 <Card>
40 <CardHeader title="Stats" />
41 <div className="flex flex-col gap-3 p-5">
42 <NumberedStat
43 count={
44 data?.balancesBulk?.[0]?.__typename === "Erc20Amount"
45 ? Number.parseFloat(data?.balancesBulk?.[0]?.value).toFixed(2)
46 : "N/A"
47 }
48 name="Total Balance"
49 suffix={WRAPPED_NATIVE_TOKEN_SYMBOL}
50 />
51 <NumberedStat
52 count={data?.groupStats?.totalMembers?.toString()}
53 name="Total Pro Members"
54 suffix="members"
55 />
56 </div>
57 </Card>
58 );
59};
60
61export default Overview;