feat(sidebar): add Connectors nav item to workspace sidebar

This commit is contained in:
Anish Sarkar 2026-07-23 23:37:26 +05:30
parent 9c16b7f407
commit e705a73ae9
2 changed files with 27 additions and 2 deletions

View file

@ -2,7 +2,7 @@
import { useQuery } from "@tanstack/react-query";
import { useAtomValue, useSetAtom } from "jotai";
import { AlarmClock, AlertTriangle, Shapes, SquareTerminal } from "lucide-react";
import { AlarmClock, AlertTriangle, Shapes, SquareTerminal, Unplug } from "lucide-react";
import { useParams, usePathname, useRouter } from "next/navigation";
import { useTranslations } from "next-intl";
import { useTheme } from "next-themes";
@ -300,6 +300,7 @@ export function LayoutDataProvider({
const isAutomationsActive = pathname?.includes("/automations") === true;
const isArtifactsActive = pathname?.endsWith("/artifacts") === true;
const isPlaygroundRoute = pathname?.includes("/playground") === true;
const isConnectorsRoute = pathname?.includes("/connectors") === true;
const navItems: NavItem[] = useMemo(
() =>
(
@ -316,6 +317,12 @@ export function LayoutDataProvider({
icon: Shapes,
isActive: isArtifactsActive,
},
{
title: "Connectors",
url: `/dashboard/${workspaceId}/connectors`,
icon: Unplug,
isActive: isConnectorsRoute,
},
{
title: "Playground",
url: `/dashboard/${workspaceId}/playground`,
@ -324,7 +331,7 @@ export function LayoutDataProvider({
},
] as (NavItem | null)[]
).filter((item): item is NavItem => item !== null),
[workspaceId, isAutomationsActive, isArtifactsActive, isPlaygroundRoute]
[workspaceId, isAutomationsActive, isArtifactsActive, isConnectorsRoute, isPlaygroundRoute]
);
// Handlers
@ -631,6 +638,7 @@ export function LayoutDataProvider({
const isAutomationsPage = pathname?.includes("/automations") === true;
const isArtifactsPage = pathname?.endsWith("/artifacts") === true;
const isPlaygroundPage = pathname?.includes("/playground") === true;
const isConnectorsPage = pathname?.includes("/connectors") === true;
const isAllChatsPage = pathname?.endsWith("/chats") === true;
const handleChatsClick = useCallback(() => {
router.push(`/dashboard/${workspaceId}/chats`);
@ -650,6 +658,7 @@ export function LayoutDataProvider({
isAutomationsPage ||
isArtifactsPage ||
isPlaygroundPage ||
isConnectorsPage ||
isAllChatsPage;
return (
@ -702,6 +711,7 @@ export function LayoutDataProvider({
isAutomationsPage ||
isArtifactsPage ||
isPlaygroundPage ||
isConnectorsPage ||
isAllChatsPage
? "items-start justify-center px-6 py-8 md:px-10 md:pb-10 md:pt-16"
: undefined

View file

@ -140,6 +140,10 @@ export function Sidebar({
() => navItems.find((item) => item.url.endsWith("/artifacts")),
[navItems]
);
const connectorsItem = useMemo(
() => navItems.find((item) => item.url.endsWith("/connectors")),
[navItems]
);
const playgroundItem = useMemo(
() => navItems.find((item) => item.url.endsWith("/playground")),
[navItems]
@ -150,6 +154,7 @@ export function Sidebar({
(item) =>
!item.url.endsWith("/automations") &&
!item.url.endsWith("/artifacts") &&
!item.url.endsWith("/connectors") &&
!item.url.endsWith("/playground")
),
[navItems]
@ -254,6 +259,16 @@ export function Sidebar({
tooltipContent={isCollapsed ? artifactsItem.title : undefined}
/>
)}
{connectorsItem && (
<SidebarButton
icon={connectorsItem.icon}
label={connectorsItem.title}
onClick={() => onNavItemClick?.(connectorsItem)}
isCollapsed={isCollapsed}
isActive={connectorsItem.isActive}
tooltipContent={isCollapsed ? connectorsItem.title : undefined}
/>
)}
{playgroundItem && (
<SidebarButton
icon={playgroundItem.icon}