diff --git a/npm-packages/dashboard-common/src/features/agents/components/Agents.tsx b/npm-packages/dashboard-common/src/features/agents/components/Agents.tsx
new file mode 100644
index 000000000..930196a91
--- /dev/null
+++ b/npm-packages/dashboard-common/src/features/agents/components/Agents.tsx
@@ -0,0 +1,12 @@
+import { Nent } from "@common/lib/useNents";
+
+export function Agents({ nents: allNents }: { nents: Nent[] }) {
+ const nents = allNents.filter((nent) => nent.name !== null);
+ const usingAgentComponent = nents.some(
+ (nent) => nent.name === "agent" && nent.path === "agent"
+ );
+ if (usingAgentComponent) {
+ return
Using AI Agents... show dashboard
;
+ }
+ return Not using agents... follow docs to get set up
;
+}
diff --git a/npm-packages/dashboard-common/src/features/agents/components/AgentsView.tsx b/npm-packages/dashboard-common/src/features/agents/components/AgentsView.tsx
new file mode 100644
index 000000000..84fab5be3
--- /dev/null
+++ b/npm-packages/dashboard-common/src/features/agents/components/AgentsView.tsx
@@ -0,0 +1,15 @@
+import { DeploymentPageTitle } from "@common/elements/DeploymentPageTitle";
+import { LoadingTransition } from "@ui/Loading";
+import { PageContent } from "@common/elements/PageContent";
+import { useNents } from "@common/lib/useNents";
+import { Agents } from "@common/features/agents/components/Agents";
+
+export function AgentsView() {
+ const { nents } = useNents();
+ return (
+
+
+ {nents && }
+
+ );
+}
diff --git a/npm-packages/dashboard-common/src/layouts/DeploymentDashboardLayout.tsx b/npm-packages/dashboard-common/src/layouts/DeploymentDashboardLayout.tsx
index f2045c33a..dd0aa81eb 100644
--- a/npm-packages/dashboard-common/src/layouts/DeploymentDashboardLayout.tsx
+++ b/npm-packages/dashboard-common/src/layouts/DeploymentDashboardLayout.tsx
@@ -21,6 +21,7 @@ import { FunctionRunnerWrapper } from "@common/features/functionRunner/component
import { FunctionsProvider } from "@common/lib/functions/FunctionsProvider";
import { useIsGlobalRunnerShown } from "@common/features/functionRunner/lib/functionRunner";
import { useIsCloudDeploymentInSelfHostedDashboard } from "@common/lib/useIsCloudDeploymentInSelfHostedDashboard";
+import { BotIcon } from "@common/lib/logos/BotIcon";
type LayoutProps = {
children: JSX.Element;
@@ -79,6 +80,12 @@ export function DeploymentDashboardLayout({
),
href: `${uriPrefix}/logs`,
},
+ {
+ key: "agent",
+ label: "AI Agents",
+ Icon: (props: any) => ,
+ href: `${uriPrefix}/agents`,
+ },
];
const sidebarItems = [
@@ -125,7 +132,7 @@ export function DeploymentDashboardLayout({
{/* If the function runner is fully expanded, hide the content */}
@@ -155,7 +162,7 @@ function PauseBanner() {
const deploymentState = useQuery(udfs.deploymentState.deploymentState);
const { useCurrentTeam, useCurrentUsageBanner } = useContext(
- DeploymentInfoContext,
+ DeploymentInfoContext
);
const team = useCurrentTeam();
diff --git a/npm-packages/dashboard-common/src/lib/logos/BotIcon.tsx b/npm-packages/dashboard-common/src/lib/logos/BotIcon.tsx
new file mode 100644
index 000000000..c575d8f6f
--- /dev/null
+++ b/npm-packages/dashboard-common/src/lib/logos/BotIcon.tsx
@@ -0,0 +1,23 @@
+export function BotIcon() {
+ return (
+
+ );
+}
diff --git a/npm-packages/dashboard-self-hosted/src/pages/agents.tsx b/npm-packages/dashboard-self-hosted/src/pages/agents.tsx
new file mode 100644
index 000000000..186710458
--- /dev/null
+++ b/npm-packages/dashboard-self-hosted/src/pages/agents.tsx
@@ -0,0 +1,3 @@
+import { AgentsView } from "@common/features/agents/components/AgentsView";
+
+export default AgentsView;