From 5f7684499230d33f0b8a3419ab306efc6609529d Mon Sep 17 00:00:00 2001
From: Anish Sarkar <104695310+AnishSarkar22@users.noreply.github.com>
Date: Thu, 1 Jan 2026 22:08:20 +0530
Subject: [PATCH] refactor: update dashboard layout and enhance Circleback
 connector configuration

- Modified the DashboardLayout to replace the "Sources" section with a "Documents" entry, improving navigation clarity.
- Updated the CirclebackConfig component to include an Info icon for configuration instructions and adjusted the webhook URL input to be disabled for better user experience.
- Enhanced the useConnectorDialog hook to handle non-indexable connectors more effectively, ensuring proper state management and user feedback.
- Improved icon mapping in the app sidebar for consistency across components.
---
 .../dashboard/[search_space_id]/layout.tsx    | 21 ++---
 .../components/circleback-config.tsx          |  9 ++-
 .../hooks/use-connector-dialog.ts             | 77 ++++++++++++++-----
 .../components/sidebar/app-sidebar.tsx        |  4 +
 4 files changed, 76 insertions(+), 35 deletions(-)

diff --git a/surfsense_web/app/dashboard/[search_space_id]/layout.tsx b/surfsense_web/app/dashboard/[search_space_id]/layout.tsx
index afaa3abef..ae3c5ad9c 100644
--- a/surfsense_web/app/dashboard/[search_space_id]/layout.tsx
+++ b/surfsense_web/app/dashboard/[search_space_id]/layout.tsx
@@ -30,24 +30,19 @@ export default function DashboardLayout({
 			{
 				title: "Chat",
 				url: `/dashboard/${search_space_id}/new-chat`,
-				icon: "SquareTerminal",
+				icon: "MessageCircle",
 				items: [],
 			},
-			{
-				title: "Sources",
-				url: "#",
-				icon: "Database",
-				items: [
-					{
-						title: "Manage Documents",
-						url: `/dashboard/${search_space_id}/documents`,
-					},
-				],
-			},
+		{
+			title: "Documents",
+			url: `/dashboard/${search_space_id}/documents`,
+			icon: "SquareLibrary",
+			items: [],
+		},
 		{
 			title: "Logs",
 			url: `/dashboard/${search_space_id}/logs`,
-			icon: "FileText",
+			icon: "Logs",
 			items: [],
 		},
 	];
diff --git a/surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/circleback-config.tsx b/surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/circleback-config.tsx
index 48e4b43e5..26c070b0b 100644
--- a/surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/circleback-config.tsx
+++ b/surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/circleback-config.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { Copy, Webhook, Check } from "lucide-react";
+import { Copy, Webhook, Check, Info } from "lucide-react";
 import { useState, useEffect } from "react";
 import type { FC } from "react";
 import { Input } from "@/components/ui/input";
@@ -107,11 +107,12 @@ export const CirclebackConfig: FC<CirclebackConfigProps> = ({
 							<Input
 								value={webhookUrl}
 								readOnly
-								className="border-slate-400/20 focus-visible:border-slate-400/40 font-mono text-xs"
+								disabled
+								className="border-slate-400/20 focus-visible:border-slate-400/40 font-mono text-xs bg-muted/50 cursor-default select-all"
 							/>
 							<Button
 								type="button"
-								variant="outline"
+								variant="secondary"
 								size="sm"
 								onClick={handleCopyWebhookUrl}
 								className="shrink-0"
@@ -141,7 +142,7 @@ export const CirclebackConfig: FC<CirclebackConfigProps> = ({
 
 				{webhookInfo && (
 					<Alert className="bg-slate-400/5 dark:bg-white/5 border-slate-400/20">
-						<Webhook className="h-3 w-3 sm:h-4 sm:w-4" />
+						<Info className="h-3 w-3 sm:h-4 sm:w-4" />
 						<AlertTitle className="text-xs sm:text-sm">Configuration Instructions</AlertTitle>
 						<AlertDescription className="text-[10px] sm:text-xs !pl-0 mt-1">
 							Configure this URL in Circleback Settings → Automations → Create automation → Send webhook request.
diff --git a/surfsense_web/components/assistant-ui/connector-popup/hooks/use-connector-dialog.ts b/surfsense_web/components/assistant-ui/connector-popup/hooks/use-connector-dialog.ts
index 97f23d126..a03551e31 100644
--- a/surfsense_web/components/assistant-ui/connector-popup/hooks/use-connector-dialog.ts
+++ b/surfsense_web/components/assistant-ui/connector-popup/hooks/use-connector-dialog.ts
@@ -141,8 +141,9 @@ export const useConnectorDialog = () => {
 						if (connectorValidation.success) {
 							setEditingConnector(connector);
 							setConnectorConfig(connector.config);
-							// Load existing periodic sync settings (disabled for Google Drive)
-							setPeriodicEnabled(connector.connector_type === "GOOGLE_DRIVE_CONNECTOR" ? false : connector.periodic_indexing_enabled);
+							setConnectorName(connector.name);
+							// Load existing periodic sync settings (disabled for Google Drive and non-indexable connectors)
+							setPeriodicEnabled(connector.connector_type === "GOOGLE_DRIVE_CONNECTOR" || !connector.is_indexable ? false : connector.periodic_indexing_enabled);
 							setFrequencyMinutes(
 								connector.indexing_frequency_minutes?.toString() || "1440"
 							);
@@ -508,16 +509,56 @@ export const useConnectorDialog = () => {
 							// Refresh connectors list
 							await refetchAllConnectors();
 						} else {
-							// Non-indexable connector - just show success message
-							toast.success(`${connectorTitle} connected successfully!`);
-							
-							// Close modal and return to main view
-							const url = new URL(window.location.href);
-							url.searchParams.delete("modal");
-							url.searchParams.delete("tab");
-							url.searchParams.delete("view");
-							url.searchParams.delete("connectorType");
-							router.replace(url.pathname + url.search, { scroll: false });
+							// Non-indexable connector
+							// For Circleback, transition to edit view to show webhook URL
+							// For other non-indexable connectors, just close the modal
+							if (currentConnectorType === "CIRCLEBACK_CONNECTOR") {
+								// Clear connecting state and indexing config state
+								setConnectingConnectorType(null);
+								setIndexingConfig(null);
+								setIndexingConnector(null);
+								setIndexingConnectorConfig(null);
+								
+								// Set up edit view state
+								setEditingConnector(connector);
+								setConnectorName(connector.name);
+								setConnectorConfig(connector.config || {});
+								setPeriodicEnabled(false);
+								setFrequencyMinutes("1440");
+								setStartDate(undefined);
+								setEndDate(undefined);
+								
+								toast.success(`${connectorTitle} connected successfully!`, {
+									description: "Configure the webhook URL in your Circleback settings.",
+								});
+								
+								// Transition to edit view
+								const url = new URL(window.location.href);
+								url.searchParams.set("modal", "connectors");
+								url.searchParams.set("view", "edit");
+								url.searchParams.set("connectorId", connector.id.toString());
+								url.searchParams.delete("connectorType");
+								router.replace(url.pathname + url.search, { scroll: false });
+								
+								// Refresh connectors list
+								await refetchAllConnectors();
+							} else {
+								// Other non-indexable connectors - just show success message and close
+								toast.success(`${connectorTitle} connected successfully!`);
+								
+								// Close modal and return to main view
+								const url = new URL(window.location.href);
+								url.searchParams.delete("modal");
+								url.searchParams.delete("tab");
+								url.searchParams.delete("view");
+								url.searchParams.delete("connectorType");
+								router.replace(url.pathname + url.search, { scroll: false });
+								
+								// Clear indexing config state
+								setIndexingConfig(null);
+								setIndexingConnector(null);
+								setIndexingConnectorConfig(null);
+							}
 						}
 					}
 				}
@@ -698,8 +739,8 @@ export const useConnectorDialog = () => {
 		
 		setEditingConnector(connector);
 		setConnectorName(connector.name);
-		// Load existing periodic sync settings (disabled for Google Drive)
-		setPeriodicEnabled(connector.connector_type === "GOOGLE_DRIVE_CONNECTOR" ? false : connector.periodic_indexing_enabled);
+		// Load existing periodic sync settings (disabled for Google Drive and non-indexable connectors)
+		setPeriodicEnabled(connector.connector_type === "GOOGLE_DRIVE_CONNECTOR" || !connector.is_indexable ? false : connector.periodic_indexing_enabled);
 		setFrequencyMinutes(connector.indexing_frequency_minutes?.toString() || "1440");
 		// Reset dates - user can set new ones for re-indexing
 		setStartDate(undefined);
@@ -747,14 +788,14 @@ export const useConnectorDialog = () => {
 			const endDateStr = endDate ? format(endDate, "yyyy-MM-dd") : undefined;
 
 			// Update connector with periodic sync settings, config changes, and name
-			// Note: Periodic sync is disabled for Google Drive connectors
-			const frequency = periodicEnabled ? parseInt(frequencyMinutes, 10) : null;
+			// Note: Periodic sync is disabled for Google Drive connectors and non-indexable connectors
+			const frequency = periodicEnabled && editingConnector.is_indexable ? parseInt(frequencyMinutes, 10) : null;
 			await updateConnector({
 				id: editingConnector.id,
 				data: {
 					name: connectorName || editingConnector.name,
-					periodic_indexing_enabled: editingConnector.connector_type === "GOOGLE_DRIVE_CONNECTOR" ? false : periodicEnabled,
-					indexing_frequency_minutes: editingConnector.connector_type === "GOOGLE_DRIVE_CONNECTOR" ? null : frequency,
+					periodic_indexing_enabled: editingConnector.connector_type === "GOOGLE_DRIVE_CONNECTOR" || !editingConnector.is_indexable ? false : periodicEnabled,
+					indexing_frequency_minutes: editingConnector.connector_type === "GOOGLE_DRIVE_CONNECTOR" || !editingConnector.is_indexable ? null : frequency,
 					config: connectorConfig || editingConnector.config,
 				},
 			});
diff --git a/surfsense_web/components/sidebar/app-sidebar.tsx b/surfsense_web/components/sidebar/app-sidebar.tsx
index 7193a67d0..08291c392 100644
--- a/surfsense_web/components/sidebar/app-sidebar.tsx
+++ b/surfsense_web/components/sidebar/app-sidebar.tsx
@@ -12,7 +12,9 @@ import {
 	FileText,
 	Info,
 	LogOut,
+	Logs,
 	type LucideIcon,
+	MessageCircle,
 	MessageCircleMore,
 	MoonIcon,
 	Podcast,
@@ -148,6 +150,8 @@ export const iconMap: Record<string, LucideIcon> = {
 	Podcast,
 	Users,
 	RefreshCw,
+	MessageCircle,
+	Logs,
 };
 
 const defaultData = {