consolidate gateway navbar

Author: jnsdls

apps/dashboard/redirects.js

@@ -115,6 +115,16 @@ const projectPageRedirects = [
     permanent: false,
     source: `${projectRoute}/connect/analytics`,
   },
+  {
+    destination: `${projectRoute}/insight/:path*`,
+    permanent: false,
+    source: `${projectRoute}/gateway/indexer/:path*`,
+  },
+  {
+    destination: `${projectRoute}/rpc/:path*`,
+    permanent: false,
+    source: `${projectRoute}/gateway/rpc/:path*`,
+  },
 ];
 
 const teamPageRedirects = [

apps/dashboard/src/app/(app)/(dashboard)/(chain)/components/server/products.ts

@@ -1,7 +1,6 @@
 import { ConnectSDKIcon } from "@/icons/ConnectSDKIcon";
 import { ContractIcon } from "@/icons/ContractIcon";
 import { EngineIcon } from "@/icons/EngineIcon";
-import { InsightIcon } from "@/icons/InsightIcon";
 import { NebulaIcon } from "@/icons/NebulaIcon";
 import { PayIcon } from "@/icons/PayIcon";
 import { RPCIcon } from "@/icons/RPCIcon";
@@ -51,13 +50,6 @@ export const products = [
     link: "https://portal.thirdweb.com/payments",
     name: "Payments",
   },
-  {
-    description: "Query and analyze blockchain data",
-    icon: InsightIcon,
-    id: "insight",
-    link: "https://thirdweb.com/insight",
-    name: "Insight",
-  },
   {
     description: "The most powerful AI for interacting with the blockchain",
     icon: NebulaIcon,

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectFTUX/ProjectFTUX.tsx

@@ -13,7 +13,6 @@ import { TypeScriptIcon } from "@/icons/brand-icons/TypeScriptIcon";
 import { UnityIcon } from "@/icons/brand-icons/UnityIcon";
 import { UnrealIcon } from "@/icons/brand-icons/UnrealIcon";
 import { ContractIcon } from "@/icons/ContractIcon";
-import { InsightIcon } from "@/icons/InsightIcon";
 import { PayIcon } from "@/icons/PayIcon";
 import { ClientIDSection } from "./ClientIDSection";
 import { SecretKeySection } from "./SecretKeySection";
@@ -111,13 +110,6 @@ function ProductsSection(props: { teamSlug: string; projectSlug: string }) {
       icon: ContractIcon,
       title: "Contracts",
     },
-    {
-      description:
-        "Add indexing capabilities to retrieve real-time onchain data",
-      href: `/team/${props.teamSlug}/${props.projectSlug}/insight`,
-      icon: InsightIcon,
-      title: "Insight",
-    },
     {
       description:
         "Bridge, swap, and purchase cryptocurrencies with any fiat options or tokens via cross-chain routing",

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx

@@ -15,7 +15,6 @@ import {
 } from "@/components/blocks/full-width-sidebar-layout";
 import { BridgeIcon } from "@/icons/BridgeIcon";
 import { ContractIcon } from "@/icons/ContractIcon";
-import { InsightIcon } from "@/icons/InsightIcon";
 import { NebulaIcon } from "@/icons/NebulaIcon";
 import { PayIcon } from "@/icons/PayIcon";
 import { TokenIcon } from "@/icons/TokenIcon";
@@ -104,14 +103,20 @@ export function ProjectSidebarLayout(props: {
       group: "Scale",
       links: [
         {
-          href: `${props.layoutPath}/insight`,
-          icon: InsightIcon,
-          label: "Insight",
-        },
-        {
-          href: `${props.layoutPath}/rpc`,
-          icon: RssIcon,
-          label: "RPC",
+          subMenu: {
+            icon: RssIcon,
+            label: "Gateway",
+          },
+          links: [
+            {
+              href: `${props.layoutPath}/gateway/rpc`,
+              label: "RPC",
+            },
+            {
+              href: `${props.layoutPath}/gateway/indexer`,
+              label: "Indexer",
+            },
+          ],
         },
         // linkely want to move this to `team` level eventually
         {

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/insight/components/InsightAnalytics.tsx renamed to apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/gateway/indexer/components/InsightAnalytics.tsx

@@ -13,7 +13,7 @@ import {
   TableHeader,
   TableRow,
 } from "@/components/ui/table";
-import { CardHeading } from "../../payments/components/common";
+import { CardHeading } from "../../../payments/components/common";
 
 export function TopInsightChainsTable(props: {
   data: InsightChainStats[];

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/insight/components/InsightAnalyticsFilter.tsx renamed to apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/gateway/indexer/components/InsightAnalyticsFilter.tsx

@@ -13,7 +13,7 @@ import {
   TableHeader,
   TableRow,
 } from "@/components/ui/table";
-import { CardHeading } from "../../payments/components/common";
+import { CardHeading } from "../../../payments/components/common";
 
 export function TopInsightEndpointsTable(props: {
   data: InsightEndpointStats[];

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/insight/components/RequestsByStatusGraph.tsx renamed to apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/gateway/indexer/components/RequestsByStatusGraph.tsx

@@ -0,0 +1,30 @@
+export function InsightFTUX(_props: { clientId: string }) {
+  return (
+    <div className="rounded-lg border bg-card">
+      <div className="border-b px-4 py-4 lg:px-6">
+        <h2 className="font-semibold text-xl tracking-tight">Indexer</h2>
+      </div>
+      <div className="px-4 py-6 lg:p-6">
+        <p className="text-muted-foreground text-sm">
+          Indexed data is automatially used when using the thirdweb SDKs and API
+          where appropriate.
+        </p>
+        <p className="text-muted-foreground text-sm">
+          Once you have integrated thirdweb into your application you will start
+          seeing usage patterns here.
+        </p>
+      </div>
+      <div className="flex flex-col gap-3 border-t p-4 lg:flex-row lg:items-center lg:justify-between lg:p-6">
+        <div className="flex gap-3"></div>
+
+        <p className="flex items-center gap-2 rounded-full border bg-background px-3.5 py-1.5 text-sm">
+          <span className="!pointer-events-auto relative flex size-2">
+            <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-sky-400 opacity-75" />
+            <span className="relative inline-flex size-2 rounded-full bg-primary" />
+          </span>
+          Waiting for integration
+        </p>
+      </div>
+    </div>
+  );
+}