feat: add disclaimer

Author: rokitgg

apps/nextjs/src/app/_components/protocols.tsx

@@ -34,7 +34,7 @@ export async function Protocols({ address }: { address: string }) {
 export function ProtocolsSkeleton() {
   return (
     <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6 w-full">
-      {Array.from({ length: 3 }).map((_, index) => (
+      {Array.from({ length: 2 }).map((_, index) => (
         // biome-ignore lint/suspicious/noArrayIndexKey: <explanation>
         <Skeleton key={index} className="bg-input h-96 w-full rounded-md" />
       ))}

apps/nextjs/src/app/address/[address]/page.tsx

@@ -1,25 +1,15 @@
 import { Badge } from "@acme/ui/badge";
-import { Button, buttonVariants } from "@acme/ui/button";
-import { Copy, ExternalLink, Eye } from "lucide-react";
+import { Info } from "lucide-react";
 import { HypePoints } from "~/app/_components/hype-points";
 import { Protocols, ProtocolsSkeleton } from "~/app/_components/protocols";
 import { isAddress } from "viem";
 import { notFound } from "next/navigation";
 import { Suspense } from "react";
-import { cn } from "@acme/ui";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogDescription,
-  DialogFooter,
-  DialogTrigger,
-} from "@acme/ui/dialog";
-import Link from "next/link";
+
 import Image from "next/image";
 import { Address } from "./_components/address";
 import { Actions } from "./_components/actions";
+import { Alert, AlertDescription, AlertTitle } from "@acme/ui/alert";
 
 export default async function AddressPage({
   params,
@@ -33,20 +23,31 @@ export default async function AddressPage({
   return (
     <main className="container h-screen py-12">
       <div className="flex flex-col items-center justify-center gap-6">
-        <div className="flex flex-row gap-3 w-full justify-start items-center">
-          <h1 className="text-2xl font-semibold text-foreground">
-            Address Overview
-          </h1>
-          <Badge variant="outline" className="rounded-full space-x-2">
-            <Image
-              src="/hype.png"
-              alt="HyperEvm"
-              width={16}
-              height={16}
-              className="rounded-full"
-            />
-            <span className="text-sm font-medium">HyperEVM</span>
-          </Badge>
+        <div className="flex flex-row gap-3 w-full justify-between items-center">
+          <div className="flex flex-row gap-3 items-center">
+            <h1 className="text-2xl font-semibold text-foreground">
+              Address Overview
+            </h1>
+            <Badge variant="outline" className="rounded-full space-x-2">
+              <Image
+                src="/hype.png"
+                alt="HyperEvm"
+                width={16}
+                height={16}
+                className="rounded-full"
+              />
+              <span className="text-sm font-medium">HyperEVM</span>
+            </Badge>
+          </div>
+          <Alert className="max-w-lg">
+            <Info className="w-4 h-4" />
+            <AlertTitle className="font-semibold">Disclaimer</AlertTitle>
+            <AlertDescription className="text-muted-foreground text-balance">
+              Some protocols may arise issues with their API which will be fixed
+              as soon as possible. More protocols will be added in the near
+              future.
+            </AlertDescription>
+          </Alert>
         </div>
         <div className="flex flex-row gap-3 w-full justify-between items-center">
           <Address address={address} />