lint

Author: gregfromstl

apps/dashboard/src/app/team/[team_slug]/[project_slug]/components/EmptyState.tsx

@@ -23,10 +23,10 @@ export function EmptyState() {
           <AnimatedIcons />
           <div className="flex flex-col gap-0.5 text-center">
             <h3 className="font-semibold text-2xl text-foreground">
-              Project Overview is Coming Soon
+              Get Started with the Connect SDK
             </h3>
             <p className="text-base text-muted-foreground">
-              Understand how users are interacting with your project
+              Add the Connect SDK to your app to start collecting analytics.
             </p>
           </div>
           <div className="flex flex-wrap items-center justify-center gap-2">

apps/dashboard/src/app/team/[team_slug]/[project_slug]/components/PieChart.tsx

@@ -16,11 +16,12 @@ export function PieChart({
   data: { value: number; label: string; fill?: string }[];
 }) {
   const chartConfig: ChartConfig = Object.fromEntries(
-    Object.entries(data).map(([_name, value]) => [
+    Object.entries(data).map(([name, value]) => [
       value.label,
       {
         label: value.label,
         color: value.fill,
+        name,
       },
     ]),
   );

apps/dashboard/src/app/team/[team_slug]/[project_slug]/page.tsx

@@ -20,9 +20,9 @@ import {
   defineChain,
   getChainMetadata,
 } from "thirdweb/chains";
-import { resolveScheme } from "thirdweb/storage";
 import { type WalletId, getWalletInfo } from "thirdweb/wallets";
 
+import { resolveSchemeWithErrorHandler } from "@/lib/resolveSchemeWithErrorHandler";
 import { CombinedBarChartCard } from "./components/CombinedBarChartCard";
 import { EmptyState } from "./components/EmptyState";
 import { PieChartCard } from "./components/PieChartCard";
@@ -105,7 +105,7 @@ export default async function ProjectOverviewPage(props: PageProps) {
   ]);
 
   const isEmpty =
-    walletUserStatsTimeSeries.length === 0 &&
+    !walletUserStatsTimeSeries.some((w) => w.totalUsers !== 0) &&
     walletConnections.length === 0 &&
     inAppWalletUsage.length === 0 &&
     userOpUsage.length === 0;
@@ -125,7 +125,7 @@ export default async function ProjectOverviewPage(props: PageProps) {
         </div>
       ) : (
         <div className="space-y-6 md:container md:p-6">
-          {walletUserStatsTimeSeries.length > 0 && (
+          {walletUserStatsTimeSeries.some((w) => w.totalUsers !== 0) && (
             <div className="">
               <UsersChartCard
                 chartKey={
@@ -288,6 +288,7 @@ async function TotalSponsoredCard({ data }: { data: UserOpStatsByChain[] }) {
   const chains = await Promise.all(
     data.map(
       (item) =>
+        // eslint-disable-next-line no-restricted-syntax
         item.chainId && getChainMetadata(defineChain(Number(item.chainId))),
     ),
   ).then((chains) => chains.filter((c) => c) as ChainMetadata[]);
@@ -305,7 +306,7 @@ async function TotalSponsoredCard({ data }: { data: UserOpStatsByChain[] }) {
             value: item.sponsoredUsd,
             icon: chain?.icon?.url ? (
               <img
-                src={resolveScheme({
+                src={resolveSchemeWithErrorHandler({
                   client: getThirdwebClient(),
                   uri: chain?.icon.url,
                 })}
@@ -326,6 +327,7 @@ async function UserOpUsageCard({ data }: { data: UserOpStatsByChain[] }) {
   const chains = await Promise.all(
     data.map(
       (item) =>
+        // eslint-disable-next-line no-restricted-syntax
         item.chainId && getChainMetadata(defineChain(Number(item.chainId))),
     ),
   ).then((chains) => chains.filter((c) => c) as ChainMetadata[]);
@@ -337,14 +339,16 @@ async function UserOpUsageCard({ data }: { data: UserOpStatsByChain[] }) {
         .sort((a, b) => b.successful - a.successful)
         .map((item, index) => {
           const chain = chains.find((c) => c.chainId === Number(item.chainId));
+
           return {
             label: chain?.name || item.chainId || "Unknown",
             value: item.successful + item.failed,
             icon: chain?.icon?.url ? (
+              // eslint-disable-next-line @next/next/no-img-element
               <img
-                src={resolveScheme({
+                src={resolveSchemeWithErrorHandler({
                   client: getThirdwebClient(),
-                  uri: chain?.icon.url,
+                  uri: chain.icon.url,
                 })}
                 width={chain?.icon?.width}
                 height={chain?.icon?.height}