apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-07-26 23:51:14 +02:00
Code Issues Projects Releases Packages Wiki Activity

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

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

14
surfsense_web/components/layout/providers/LayoutDataProvider.tsx
View file

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

15
surfsense_web/components/layout/ui/sidebar/Sidebar.tsx
View file

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