refactor: enhance Circleback connector configuration and simplify sidebar components

- Introduced Zod schema for type-safe validation of Circleback webhook info, improving data handling in the CirclebackConfig component.
- Updated the CirclebackConfig to utilize the new schema for fetching and setting webhook information.
- Removed unnecessary state management related to source expansion in the sidebar components, streamlining the NavMain, NavChats, and NavNotes components.
- Improved overall code clarity and maintainability by eliminating unused imports and props.

surfsense_web/components/sidebar/app-sidebar.tsx

@@ -295,7 +295,6 @@ export const AppSidebar = memo(function AppSidebar({
 	const { theme, setTheme } = useTheme();
 	const { data: user, isPending: isLoadingUser } = useAtomValue(currentUserAtom);
 	const [isClient, setIsClient] = useState(false);
-	const [isSourcesExpanded, setIsSourcesExpanded] = useState(false);
 
 	useEffect(() => {
 		setIsClient(true);
@@ -447,19 +446,17 @@ export const AppSidebar = memo(function AppSidebar({
 			</SidebarHeader>
 
 			<SidebarContent className="gap-1">
-				<NavMain items={processedNavMain} onSourcesExpandedChange={setIsSourcesExpanded} />
+				<NavMain items={processedNavMain} />
 
 				<NavChats
 					chats={processedRecentChats}
 					searchSpaceId={searchSpaceId}
-					isSourcesExpanded={isSourcesExpanded}
 				/>
 
 				<NavNotes
 					notes={processedRecentNotes}
 					onAddNote={onAddNote}
 					searchSpaceId={searchSpaceId}
-					isSourcesExpanded={isSourcesExpanded}
 				/>
 			</SidebarContent>
 			<SidebarFooter>

surfsense_web/components/sidebar/nav-chats.tsx

@@ -12,7 +12,7 @@ import {
 } from "lucide-react";
 import { usePathname, useRouter } from "next/navigation";
 import { useTranslations } from "next-intl";
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useState } from "react";
 import { Button } from "@/components/ui/button";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible";
 import {
@@ -30,7 +30,6 @@ import {
 	SidebarMenuItem,
 	useSidebar,
 } from "@/components/ui/sidebar";
-import { useIsMobile } from "@/hooks/use-mobile";
 import { cn } from "@/lib/utils";
 import { AllChatsSidebar } from "./all-chats-sidebar";
 
@@ -53,7 +52,6 @@ interface NavChatsProps {
 	chats: ChatItem[];
 	defaultOpen?: boolean;
 	searchSpaceId?: string;
-	isSourcesExpanded?: boolean;
 }
 
 // Map of icon names to their components
@@ -68,24 +66,15 @@ export function NavChats({
 	chats,
 	defaultOpen = true,
 	searchSpaceId,
-	isSourcesExpanded = false,
 }: NavChatsProps) {
 	const t = useTranslations("sidebar");
 	const router = useRouter();
 	const pathname = usePathname();
-	const isMobile = useIsMobile();
 	const { setOpenMobile } = useSidebar();
 	const [isDeleting, setIsDeleting] = useState<number | null>(null);
 	const [isOpen, setIsOpen] = useState(defaultOpen);
 	const [isAllChatsSidebarOpen, setIsAllChatsSidebarOpen] = useState(false);
 
-	// Auto-collapse on smaller screens when Sources is expanded
-	useEffect(() => {
-		if (isSourcesExpanded && isMobile) {
-			setIsOpen(false);
-		}
-	}, [isSourcesExpanded, isMobile]);
-
 	// Handle chat deletion with loading state
 	const handleDeleteChat = useCallback(async (chatId: number, deleteAction: () => void) => {
 		setIsDeleting(chatId);

surfsense_web/components/sidebar/nav-main.tsx

@@ -31,10 +31,9 @@ interface NavItem {
 
 interface NavMainProps {
 	items: NavItem[];
-	onSourcesExpandedChange?: (expanded: boolean) => void;
 }
 
-export function NavMain({ items, onSourcesExpandedChange }: NavMainProps) {
+export function NavMain({ items }: NavMainProps) {
 	const t = useTranslations("nav_menu");
 	const pathname = usePathname();
 
@@ -100,16 +99,9 @@ export function NavMain({ items, onSourcesExpandedChange }: NavMainProps) {
 	});
 
 	// Handle collapsible state change
-	const handleOpenChange = useCallback(
-		(title: string, isOpen: boolean) => {
-			setExpandedItems((prev) => ({ ...prev, [title]: isOpen }));
-			// Notify parent when Sources is expanded/collapsed
-			if (title === "Sources" && onSourcesExpandedChange) {
-				onSourcesExpandedChange(isOpen);
-			}
-		},
-		[onSourcesExpandedChange]
-	);
+	const handleOpenChange = useCallback((title: string, isOpen: boolean) => {
+		setExpandedItems((prev) => ({ ...prev, [title]: isOpen }));
+	}, []);
 
 	return (
 		<SidebarGroup>

surfsense_web/components/sidebar/nav-notes.tsx

@@ -12,7 +12,7 @@ import {
 } from "lucide-react";
 import { usePathname, useRouter } from "next/navigation";
 import { useTranslations } from "next-intl";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { useCallback, useMemo, useState } from "react";
 import { Button } from "@/components/ui/button";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible";
 import {
@@ -31,7 +31,6 @@ import {
 	useSidebar,
 } from "@/components/ui/sidebar";
 import { useLogsSummary } from "@/hooks/use-logs";
-import { useIsMobile } from "@/hooks/use-mobile";
 import { cn } from "@/lib/utils";
 import { AllNotesSidebar } from "./all-notes-sidebar";
 
@@ -55,7 +54,6 @@ interface NavNotesProps {
 	onAddNote?: () => void;
 	defaultOpen?: boolean;
 	searchSpaceId?: string;
-	isSourcesExpanded?: boolean;
 }
 
 // Map of icon names to their components
@@ -70,12 +68,10 @@ export function NavNotes({
 	onAddNote,
 	defaultOpen = true,
 	searchSpaceId,
-	isSourcesExpanded = false,
 }: NavNotesProps) {
 	const t = useTranslations("sidebar");
 	const router = useRouter();
 	const pathname = usePathname();
-	const isMobile = useIsMobile();
 	const { setOpenMobile } = useSidebar();
 	const [isDeleting, setIsDeleting] = useState<number | null>(null);
 	const [isOpen, setIsOpen] = useState(defaultOpen);
@@ -98,13 +94,6 @@ export function NavNotes({
 		);
 	}, [summary?.active_tasks]);
 
-	// Auto-collapse on smaller screens when Sources is expanded
-	useEffect(() => {
-		if (isSourcesExpanded && isMobile) {
-			setIsOpen(false);
-		}
-	}, [isSourcesExpanded, isMobile]);
-
 	// Handle note deletion with loading state
 	const handleDeleteNote = useCallback(async (noteId: number, deleteAction: () => void) => {
 		setIsDeleting(noteId);