add scalar react component

Author: joaquim-verges

apps/dashboard/package.json

@@ -45,6 +45,7 @@
     "@radix-ui/react-slot": "^1.2.0",
     "@radix-ui/react-switch": "^1.1.4",
     "@radix-ui/react-tooltip": "1.2.0",
+    "@scalar/api-reference-react": "^0.6.19",
     "@sentry/nextjs": "9.12.0",
     "@shazow/whatsabi": "0.21.0",
     "@tanstack/react-query": "5.72.1",

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

@@ -1,3 +1,16 @@
+"use client";
+import { ApiReferenceReact } from "@scalar/api-reference-react";
+import "@scalar/api-reference-react/style.css";
+import { THIRDWEB_ENGINE_CLOUD_URL } from "@/constants/env";
+
 export default function TransactionsExplorerPage() {
-  return <div>Explorer</div>;
+  return (
+    <div>
+      <ApiReferenceReact
+        configuration={{
+          url: `${THIRDWEB_ENGINE_CLOUD_URL}/openapi`,
+        }}
+      />
+    </div>
+  );
 }

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

@@ -4,8 +4,8 @@ import { TabPathLinks } from "@/components/ui/tabs";
 import { CloudIcon } from "lucide-react";
 import Link from "next/link";
 import { redirect } from "next/navigation";
-import { Badge } from "../../../../../@/components/ui/badge";
-import { THIRDWEB_ENGINE_CLOUD_URL } from "../../../../../@/constants/env";
+import { Badge } from "@/components/ui/badge";
+import { THIRDWEB_ENGINE_CLOUD_URL } from "@/constants/env";
 
 export default async function Page(props: {
   params: Promise<{ team_slug: string; project_slug: string }>;