Added source connector integration to chat input options

surfsense_web/app/dashboard/[search_space_id]/v2/[[...chat_id]]/page.tsx

@@ -42,9 +42,15 @@ export default function ResearchChatPageV2() {
         return selectedDocuments.map((doc) => doc.id);
     }, [selectedDocuments]);
 
+    // Memoize connector types to prevent infinite re-renders
+    const connectorTypes = useMemo(() => {
+        return selectedConnectors;
+    }, [selectedConnectors]);
+
     // Unified localStorage management for chat state
     interface ChatState {
         selectedDocuments: Document[];
+        selectedConnectors: string[];
         searchMode: "DOCUMENTS" | "CHUNKS";
         researchMode: ResearchMode;
     }
@@ -89,7 +95,7 @@ export default function ResearchChatPageV2() {
         body: {
             data: {
                 search_space_id: search_space_id,
-                selected_connectors: selectedConnectors,
+                selected_connectors: connectorTypes,
                 research_mode: researchMode,
                 search_mode: searchMode,
                 document_ids_to_add_in_context: documentIds,
@@ -104,11 +110,16 @@ export default function ResearchChatPageV2() {
         message: Message | CreateMessage,
         chatRequestOptions?: { data?: any }
     ) => {
-        const newChatId = await createChat(message.content, researchMode);
+        const newChatId = await createChat(
+            message.content,
+            researchMode,
+            selectedConnectors
+        );
         if (newChatId) {
             // Store chat state before navigation
             storeChatState(search_space_id as string, newChatId, {
                 selectedDocuments,
+                selectedConnectors,
                 searchMode,
                 researchMode,
             });
@@ -133,6 +144,7 @@ export default function ResearchChatPageV2() {
             );
             if (restoredState) {
                 setSelectedDocuments(restoredState.selectedDocuments);
+                setSelectedConnectors(restoredState.selectedConnectors);
                 setSearchMode(restoredState.searchMode);
                 setResearchMode(restoredState.researchMode);
             }
@@ -141,6 +153,7 @@ export default function ResearchChatPageV2() {
         chatIdParam,
         search_space_id,
         setSelectedDocuments,
+        setSelectedConnectors,
         setSearchMode,
         setResearchMode,
     ]);
@@ -192,7 +205,12 @@ export default function ResearchChatPageV2() {
             handler.messages.length > 0 &&
             handler.messages[handler.messages.length - 1]?.role === "assistant"
         ) {
-            updateChat(chatIdParam, handler.messages, researchMode);
+            updateChat(
+                chatIdParam,
+                handler.messages,
+                researchMode,
+                selectedConnectors
+            );
         }
     }, [handler.messages, handler.status, chatIdParam, isNewChat]);
 
@@ -212,6 +230,8 @@ export default function ResearchChatPageV2() {
             }}
             onDocumentSelectionChange={setSelectedDocuments}
             selectedDocuments={selectedDocuments}
+            onConnectorSelectionChange={setSelectedConnectors}
+            selectedConnectors={selectedConnectors}
             searchMode={searchMode}
             onSearchModeChange={setSearchMode}
             researchMode={researchMode}

surfsense_web/components/chat_v2/ChatInputGroup.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { ChatInput } from "@llamaindex/chat-ui";
-import { FolderOpen } from "lucide-react";
+import { FolderOpen, Check } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import {
     Dialog,
@@ -9,6 +9,7 @@ import {
     DialogDescription,
     DialogTitle,
     DialogTrigger,
+    DialogFooter,
 } from "@/components/ui/dialog";
 import {
     Select,
@@ -21,6 +22,11 @@ import { Suspense, useState, useCallback } from "react";
 import { useParams } from "next/navigation";
 import { useDocuments, Document } from "@/hooks/use-documents";
 import { DocumentsDataTable } from "@/components/chat_v2/DocumentsDataTable";
+import { useSearchSourceConnectors } from "@/hooks/useSearchSourceConnectors";
+import {
+    getConnectorIcon,
+    ConnectorButton as ConnectorButtonComponent,
+} from "@/components/chat/ConnectorComponents";
 import { ResearchMode } from "@/components/chat";
 import React from "react";
 
@@ -113,6 +119,126 @@ const DocumentSelector = React.memo(
     }
 );
 
+const ConnectorSelector = React.memo(
+    ({
+        onSelectionChange,
+        selectedConnectors = [],
+    }: {
+        onSelectionChange?: (connectorTypes: string[]) => void;
+        selectedConnectors?: string[];
+    }) => {
+        const [isOpen, setIsOpen] = useState(false);
+
+        const { connectorSourceItems, isLoading, isLoaded, fetchConnectors } =
+            useSearchSourceConnectors();
+
+        const handleOpenChange = useCallback(
+            (open: boolean) => {
+                setIsOpen(open);
+                if (open && !isLoaded) {
+                    fetchConnectors();
+                }
+            },
+            [fetchConnectors, isLoaded]
+        );
+
+        const handleConnectorToggle = useCallback(
+            (connectorType: string) => {
+                const isSelected = selectedConnectors.includes(connectorType);
+                const newSelection = isSelected
+                    ? selectedConnectors.filter(
+                          (type) => type !== connectorType
+                      )
+                    : [...selectedConnectors, connectorType];
+                onSelectionChange?.(newSelection);
+            },
+            [selectedConnectors, onSelectionChange]
+        );
+
+        const handleSelectAll = useCallback(() => {
+            onSelectionChange?.(connectorSourceItems.map((c) => c.type));
+        }, [connectorSourceItems, onSelectionChange]);
+
+        const handleClearAll = useCallback(() => {
+            onSelectionChange?.([]);
+        }, [onSelectionChange]);
+
+        return (
+            <Dialog open={isOpen} onOpenChange={handleOpenChange}>
+                <DialogTrigger asChild>
+                    <ConnectorButtonComponent
+                        selectedConnectors={selectedConnectors}
+                        onClick={() => setIsOpen(true)}
+                        connectorSources={connectorSourceItems}
+                    />
+                </DialogTrigger>
+
+                <DialogContent className="sm:max-w-md">
+                    <DialogTitle>Select Connectors</DialogTitle>
+                    <DialogDescription>
+                        Choose which data sources to include in your research
+                    </DialogDescription>
+
+                    {/* Connector selection grid */}
+                    <div className="grid grid-cols-2 gap-4 py-4">
+                        {isLoading ? (
+                            <div className="col-span-2 flex justify-center py-4">
+                                <div className="animate-spin h-6 w-6 border-2 border-primary border-t-transparent rounded-full" />
+                            </div>
+                        ) : (
+                            connectorSourceItems.map((connector) => {
+                                const isSelected = selectedConnectors.includes(
+                                    connector.type
+                                );
+
+                                return (
+                                    <div
+                                        key={connector.id}
+                                        className={`flex items-center gap-2 p-2 rounded-md border cursor-pointer transition-colors ${
+                                            isSelected
+                                                ? "border-primary bg-primary/10"
+                                                : "border-border hover:border-primary/50 hover:bg-muted"
+                                        }`}
+                                        onClick={() =>
+                                            handleConnectorToggle(
+                                                connector.type
+                                            )
+                                        }
+                                        role="checkbox"
+                                        aria-checked={isSelected}
+                                        tabIndex={0}
+                                    >
+                                        <div className="flex-shrink-0 w-6 h-6 flex items-center justify-center rounded-full bg-muted">
+                                            {getConnectorIcon(connector.type)}
+                                        </div>
+                                        <span className="flex-1 text-sm font-medium">
+                                            {connector.name}
+                                        </span>
+                                        {isSelected && (
+                                            <Check className="h-4 w-4 text-primary" />
+                                        )}
+                                    </div>
+                                );
+                            })
+                        )}
+                    </div>
+
+                    <DialogFooter className="flex justify-between items-center">
+                        <div className="flex gap-2">
+                            <Button variant="outline" onClick={handleClearAll}>
+                                Clear All
+                            </Button>
+                            <Button onClick={handleSelectAll}>
+                                Select All
+                            </Button>
+                        </div>
+                    </DialogFooter>
+                </DialogContent>
+            </Dialog>
+        );
+    }
+);
+
 const SearchModeSelector = ({
     searchMode,
     onSearchModeChange,
@@ -155,20 +281,6 @@ const ResearchModeSelector = ({
     researchMode?: ResearchMode;
     onResearchModeChange?: (mode: ResearchMode) => void;
 }) => {
-    const researchModeLabels: Record<ResearchMode, string> = {
-        QNA: "Q&A",
-        REPORT_GENERAL: "General Report",
-        REPORT_DEEP: "Deep Report",
-        REPORT_DEEPER: "Deeper Report",
-    };
-
-    const researchModeShortLabels: Record<ResearchMode, string> = {
-        QNA: "Q&A",
-        REPORT_GENERAL: "General",
-        REPORT_DEEP: "Deep",
-        REPORT_DEEPER: "Deeper",
-    };
-
     return (
         <div className="flex items-center gap-1 sm:gap-2">
             <span className="text-xs text-muted-foreground hidden sm:block">
@@ -206,6 +318,8 @@ const ResearchModeSelector = ({
 const CustomChatInputOptions = ({
     onDocumentSelectionChange,
     selectedDocuments,
+    onConnectorSelectionChange,
+    selectedConnectors,
     searchMode,
     onSearchModeChange,
     researchMode,
@@ -213,6 +327,8 @@ const CustomChatInputOptions = ({
 }: {
     onDocumentSelectionChange?: (documents: Document[]) => void;
     selectedDocuments?: Document[];
+    onConnectorSelectionChange?: (connectorTypes: string[]) => void;
+    selectedConnectors?: string[];
     searchMode?: "DOCUMENTS" | "CHUNKS";
     onSearchModeChange?: (mode: "DOCUMENTS" | "CHUNKS") => void;
     researchMode?: ResearchMode;
@@ -226,6 +342,12 @@ const CustomChatInputOptions = ({
                     selectedDocuments={selectedDocuments}
                 />
             </Suspense>
+            <Suspense fallback={<div>Loading...</div>}>
+                <ConnectorSelector
+                    onSelectionChange={onConnectorSelectionChange}
+                    selectedConnectors={selectedConnectors}
+                />
+            </Suspense>
             <SearchModeSelector
                 searchMode={searchMode}
                 onSearchModeChange={onSearchModeChange}
@@ -241,6 +363,8 @@ const CustomChatInputOptions = ({
 export const CustomChatInput = ({
     onDocumentSelectionChange,
     selectedDocuments,
+    onConnectorSelectionChange,
+    selectedConnectors,
     searchMode,
     onSearchModeChange,
     researchMode,
@@ -248,6 +372,8 @@ export const CustomChatInput = ({
 }: {
     onDocumentSelectionChange?: (documents: Document[]) => void;
     selectedDocuments?: Document[];
+    onConnectorSelectionChange?: (connectorTypes: string[]) => void;
+    selectedConnectors?: string[];
     searchMode?: "DOCUMENTS" | "CHUNKS";
     onSearchModeChange?: (mode: "DOCUMENTS" | "CHUNKS") => void;
     researchMode?: ResearchMode;
@@ -262,6 +388,8 @@ export const CustomChatInput = ({
             <CustomChatInputOptions
                 onDocumentSelectionChange={onDocumentSelectionChange}
                 selectedDocuments={selectedDocuments}
+                onConnectorSelectionChange={onConnectorSelectionChange}
+                selectedConnectors={selectedConnectors}
                 searchMode={searchMode}
                 onSearchModeChange={onSearchModeChange}
                 researchMode={researchMode}

surfsense_web/components/chat_v2/ChatInterface.tsx

@@ -15,6 +15,8 @@ interface ChatInterfaceProps {
     handler: ChatHandler;
     onDocumentSelectionChange?: (documents: Document[]) => void;
     selectedDocuments?: Document[];
+    onConnectorSelectionChange?: (connectorTypes: string[]) => void;
+    selectedConnectors?: string[];
     searchMode?: "DOCUMENTS" | "CHUNKS";
     onSearchModeChange?: (mode: "DOCUMENTS" | "CHUNKS") => void;
     researchMode?: ResearchMode;
@@ -25,6 +27,8 @@ export default function ChatInterface({
     handler,
     onDocumentSelectionChange,
     selectedDocuments = [],
+    onConnectorSelectionChange,
+    selectedConnectors = [],
     searchMode,
     onSearchModeChange,
     researchMode,
@@ -44,6 +48,8 @@ export default function ChatInterface({
                     <CustomChatInput
                         onDocumentSelectionChange={onDocumentSelectionChange}
                         selectedDocuments={selectedDocuments}
+                        onConnectorSelectionChange={onConnectorSelectionChange}
+                        selectedConnectors={selectedConnectors}
                         searchMode={searchMode}
                         onSearchModeChange={onSearchModeChange}
                         researchMode={researchMode}

surfsense_web/hooks/useChat.ts

@@ -88,7 +88,8 @@ export function useChatAPI({ token, search_space_id }: UseChatAPIProps) {
     const createChat = useCallback(
         async (
             initialMessage: string,
-            researchMode: ResearchMode
+            researchMode: ResearchMode,
+            selectedConnectors: string[]
         ): Promise<string | null> => {
             if (!token) {
                 console.error("Authentication token not found");
@@ -107,7 +108,7 @@ export function useChatAPI({ token, search_space_id }: UseChatAPIProps) {
                         body: JSON.stringify({
                             type: researchMode,
                             title: "Untitled Chat",
-                            initial_connectors: [],
+                            initial_connectors: selectedConnectors,
                             messages: [
                                 {
                                     role: "user",
@@ -139,7 +140,8 @@ export function useChatAPI({ token, search_space_id }: UseChatAPIProps) {
         async (
             chatId: string,
             messages: Message[],
-            researchMode: ResearchMode
+            researchMode: ResearchMode,
+            selectedConnectors: string[]
         ) => {
             if (!token) return;
 
@@ -164,7 +166,7 @@ export function useChatAPI({ token, search_space_id }: UseChatAPIProps) {
                         body: JSON.stringify({
                             type: researchMode,
                             title: title,
-                            initial_connectors: [],
+                            initial_connectors: selectedConnectors,
                             messages: messages,
                             search_space_id: Number(search_space_id),
                         }),

surfsense_web/hooks/useSearchSourceConnectors.ts

@@ -1,328 +1,367 @@
-import { useState, useEffect, useCallback } from 'react';
+import { useState, useEffect, useCallback } from "react";
 
 export interface SearchSourceConnector {
-  id: number;
+    id: number;
-  name: string;
+    name: string;
-  connector_type: string;
+    connector_type: string;
-  is_indexable: boolean;
+    is_indexable: boolean;
-  last_indexed_at: string | null;
+    last_indexed_at: string | null;
-  config: Record<string, any>;
+    config: Record<string, any>;
-  user_id?: string;
+    user_id?: string;
-  created_at?: string;
+    created_at?: string;
 }
 
 export interface ConnectorSourceItem {
-  id: number;
+    id: number;
-  name: string;
+    name: string;
-  type: string;
+    type: string;
-  sources: any[];
+    sources: any[];
 }
 
 /**
  * Hook to fetch search source connectors from the API
  */
 export const useSearchSourceConnectors = () => {
-  const [connectors, setConnectors] = useState<SearchSourceConnector[]>([]);
+    const [connectors, setConnectors] = useState<SearchSourceConnector[]>([]);
-  const [isLoading, setIsLoading] = useState(true);
+    const [isLoading, setIsLoading] = useState(false);
-  const [error, setError] = useState<Error | null>(null);
+    const [isLoaded, setIsLoaded] = useState(false);
-  const [connectorSourceItems, setConnectorSourceItems] = useState<ConnectorSourceItem[]>([
+    const [error, setError] = useState<Error | null>(null);
-    {
+    const [connectorSourceItems, setConnectorSourceItems] = useState<
-      id: 1,
+        ConnectorSourceItem[]
-      name: "Crawled URL",
+    >([
-      type: "CRAWLED_URL",
+        {
-      sources: [],
+            id: 1,
-    },
+            name: "Crawled URL",
-    {
+            type: "CRAWLED_URL",
-      id: 2,
+            sources: [],
-      name: "File",
+        },
-      type: "FILE",
+        {
-      sources: [],
+            id: 2,
-    },
+            name: "File",
-    {
+            type: "FILE",
-      id: 3,
+            sources: [],
-      name: "Extension",
+        },
-      type: "EXTENSION",
+        {
-      sources: [],
+            id: 3,
-    },
+            name: "Extension",
-    {
+            type: "EXTENSION",
-      id: 4,
+            sources: [],
-      name: "Youtube Video",
+        },
-      type: "YOUTUBE_VIDEO",
+        {
-      sources: [],
+            id: 4,
-    }
+            name: "Youtube Video",
-  ]);
+            type: "YOUTUBE_VIDEO",
+            sources: [],
+        },
+    ]);
 
-  useEffect(() => {
+    const fetchConnectors = useCallback(async () => {
-    const fetchConnectors = async () => {
+        if (isLoaded) return; // Don't fetch if already loaded
-      try {
-        setIsLoading(true);
-        const token = localStorage.getItem('surfsense_bearer_token');
 
-        if (!token) {
+        try {
-          throw new Error('No authentication token found');
+            setIsLoading(true);
-        }
+            setError(null);
+            const token = localStorage.getItem("surfsense_bearer_token");
 
-        const response = await fetch(
+            if (!token) {
-          `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/`,
+                throw new Error("No authentication token found");
-          {
-            method: 'GET',
-            headers: {
-              'Content-Type': 'application/json',
-              'Authorization': `Bearer ${token}`
             }
-          }
+
+            const response = await fetch(
+                `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/`,
+                {
+                    method: "GET",
+                    headers: {
+                        "Content-Type": "application/json",
+                        Authorization: `Bearer ${token}`,
+                    },
+                }
+            );
+
+            if (!response.ok) {
+                throw new Error(
+                    `Failed to fetch connectors: ${response.statusText}`
+                );
+            }
+
+            const data = await response.json();
+            setConnectors(data);
+            setIsLoaded(true);
+
+            // Update connector source items when connectors change
+            updateConnectorSourceItems(data);
+        } catch (err) {
+            setError(
+                err instanceof Error
+                    ? err
+                    : new Error("An unknown error occurred")
+            );
+            console.error("Error fetching search source connectors:", err);
+        } finally {
+            setIsLoading(false);
+        }
+    }, [isLoaded]);
+
+    // Update connector source items when connectors change
+    const updateConnectorSourceItems = (
+        currentConnectors: SearchSourceConnector[]
+    ) => {
+        // Start with the default hardcoded connectors
+        const defaultConnectors: ConnectorSourceItem[] = [
+            {
+                id: 1,
+                name: "Crawled URL",
+                type: "CRAWLED_URL",
+                sources: [],
+            },
+            {
+                id: 2,
+                name: "File",
+                type: "FILE",
+                sources: [],
+            },
+            {
+                id: 3,
+                name: "Extension",
+                type: "EXTENSION",
+                sources: [],
+            },
+            {
+                id: 4,
+                name: "Youtube Video",
+                type: "YOUTUBE_VIDEO",
+                sources: [],
+            },
+        ];
+
+        // Add the API connectors
+        const apiConnectors: ConnectorSourceItem[] = currentConnectors.map(
+            (connector, index) => ({
+                id: 1000 + index, // Use a high ID to avoid conflicts with hardcoded IDs
+                name: connector.name,
+                type: connector.connector_type,
+                sources: [],
+            })
         );
 
-        if (!response.ok) {
+        setConnectorSourceItems([...defaultConnectors, ...apiConnectors]);
-          throw new Error(`Failed to fetch connectors: ${response.statusText}`);
-        }
-
-        const data = await response.json();
-        setConnectors(data);
-        
-        // Update connector source items when connectors change
-        updateConnectorSourceItems(data);
-      } catch (err) {
-        setError(err instanceof Error ? err : new Error('An unknown error occurred'));
-        console.error('Error fetching search source connectors:', err);
-      } finally {
-        setIsLoading(false);
-      }
     };
 
-    fetchConnectors();
+    /**
-  }, []);
+     * Create a new search source connector
+     */
+    const createConnector = async (
+        connectorData: Omit<
+            SearchSourceConnector,
+            "id" | "user_id" | "created_at"
+        >
+    ) => {
+        try {
+            const token = localStorage.getItem("surfsense_bearer_token");
 
-  // Update connector source items when connectors change
+            if (!token) {
-  const updateConnectorSourceItems = (currentConnectors: SearchSourceConnector[]) => {
+                throw new Error("No authentication token found");
-    // Start with the default hardcoded connectors
+            }
-    const defaultConnectors: ConnectorSourceItem[] = [
-      {
-        id: 1,
-        name: "Crawled URL",
-        type: "CRAWLED_URL",
-        sources: [],
-      },
-      {
-        id: 2,
-        name: "File",
-        type: "FILE",
-        sources: [],
-      },
-      {
-        id: 3,
-        name: "Extension",
-        type: "EXTENSION",
-        sources: [],
-      },
-      {
-        id: 4,
-        name: "Youtube Video",
-        type: "YOUTUBE_VIDEO",
-        sources: [],
-      }
-    ];
 
-    // Add the API connectors
+            const response = await fetch(
-    const apiConnectors: ConnectorSourceItem[] = currentConnectors.map((connector, index) => ({
+                `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/`,
-      id: 1000 + index, // Use a high ID to avoid conflicts with hardcoded IDs
+                {
-      name: connector.name,
+                    method: "POST",
-      type: connector.connector_type,
+                    headers: {
-      sources: [],
+                        "Content-Type": "application/json",
-    }));
+                        Authorization: `Bearer ${token}`,
+                    },
+                    body: JSON.stringify(connectorData),
+                }
+            );
 
-    setConnectorSourceItems([...defaultConnectors, ...apiConnectors]);
+            if (!response.ok) {
-  };
+                throw new Error(
+                    `Failed to create connector: ${response.statusText}`
+                );
+            }
 
-  /**
+            const newConnector = await response.json();
-   * Create a new search source connector
+            const updatedConnectors = [...connectors, newConnector];
-   */
+            setConnectors(updatedConnectors);
-  const createConnector = async (connectorData: Omit<SearchSourceConnector, 'id' | 'user_id' | 'created_at'>) => {
+            updateConnectorSourceItems(updatedConnectors);
-    try {
+            return newConnector;
-      const token = localStorage.getItem('surfsense_bearer_token');
+        } catch (err) {
-      
+            console.error("Error creating search source connector:", err);
-      if (!token) {
+            throw err;
-        throw new Error('No authentication token found');
-      }
-
-      const response = await fetch(
-        `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/`,
-        {
-          method: 'POST',
-          headers: {
-            'Content-Type': 'application/json',
-            'Authorization': `Bearer ${token}`
-          },
-          body: JSON.stringify(connectorData)
         }
-      );
+    };
 
-      if (!response.ok) {
+    /**
-        throw new Error(`Failed to create connector: ${response.statusText}`);
+     * Update an existing search source connector
-      }
+     */
+    const updateConnector = async (
+        connectorId: number,
+        connectorData: Partial<
+            Omit<SearchSourceConnector, "id" | "user_id" | "created_at">
+        >
+    ) => {
+        try {
+            const token = localStorage.getItem("surfsense_bearer_token");
 
-      const newConnector = await response.json();
+            if (!token) {
-      const updatedConnectors = [...connectors, newConnector];
+                throw new Error("No authentication token found");
-      setConnectors(updatedConnectors);
+            }
-      updateConnectorSourceItems(updatedConnectors);
-      return newConnector;
-    } catch (err) {
-      console.error('Error creating search source connector:', err);
-      throw err;
-    }
-  };
 
-  /**
+            const response = await fetch(
-   * Update an existing search source connector
+                `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/${connectorId}`,
-   */
+                {
-  const updateConnector = async (
+                    method: "PUT",
-    connectorId: number, 
+                    headers: {
-    connectorData: Partial<Omit<SearchSourceConnector, 'id' | 'user_id' | 'created_at'>>
+                        "Content-Type": "application/json",
-  ) => {
+                        Authorization: `Bearer ${token}`,
-    try {
+                    },
-      const token = localStorage.getItem('surfsense_bearer_token');
+                    body: JSON.stringify(connectorData),
+                }
+            );
 
-      if (!token) {
+            if (!response.ok) {
-        throw new Error('No authentication token found');
+                throw new Error(
-      }
+                    `Failed to update connector: ${response.statusText}`
+                );
+            }
 
-      const response = await fetch(
+            const updatedConnector = await response.json();
-        `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/${connectorId}`,
+            const updatedConnectors = connectors.map((connector) =>
-        {
+                connector.id === connectorId ? updatedConnector : connector
-          method: 'PUT',
+            );
-          headers: {
+            setConnectors(updatedConnectors);
-            'Content-Type': 'application/json',
+            updateConnectorSourceItems(updatedConnectors);
-            'Authorization': `Bearer ${token}`
+            return updatedConnector;
-          },
+        } catch (err) {
-          body: JSON.stringify(connectorData)
+            console.error("Error updating search source connector:", err);
+            throw err;
         }
-      );
+    };
 
-      if (!response.ok) {
+    /**
-        throw new Error(`Failed to update connector: ${response.statusText}`);
+     * Delete a search source connector
-      }
+     */
+    const deleteConnector = async (connectorId: number) => {
+        try {
+            const token = localStorage.getItem("surfsense_bearer_token");
 
-      const updatedConnector = await response.json();
+            if (!token) {
-      const updatedConnectors = connectors.map(connector => 
+                throw new Error("No authentication token found");
-        connector.id === connectorId ? updatedConnector : connector
+            }
-      );
-      setConnectors(updatedConnectors);
-      updateConnectorSourceItems(updatedConnectors);
-      return updatedConnector;
-    } catch (err) {
-      console.error('Error updating search source connector:', err);
-      throw err;
-    }
-  };
 
-  /**
+            const response = await fetch(
-   * Delete a search source connector
+                `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/${connectorId}`,
-   */
+                {
-  const deleteConnector = async (connectorId: number) => {
+                    method: "DELETE",
-    try {
+                    headers: {
-      const token = localStorage.getItem('surfsense_bearer_token');
+                        "Content-Type": "application/json",
+                        Authorization: `Bearer ${token}`,
+                    },
+                }
+            );
 
-      if (!token) {
+            if (!response.ok) {
-        throw new Error('No authentication token found');
+                throw new Error(
-      }
+                    `Failed to delete connector: ${response.statusText}`
+                );
+            }
 
-      const response = await fetch(
+            const updatedConnectors = connectors.filter(
-        `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/${connectorId}`,
+                (connector) => connector.id !== connectorId
-        {
+            );
-          method: 'DELETE',
+            setConnectors(updatedConnectors);
-          headers: {
+            updateConnectorSourceItems(updatedConnectors);
-            'Content-Type': 'application/json',
+        } catch (err) {
-            'Authorization': `Bearer ${token}`
+            console.error("Error deleting search source connector:", err);
-          }
+            throw err;
         }
-      );
+    };
 
-      if (!response.ok) {
+    /**
-        throw new Error(`Failed to delete connector: ${response.statusText}`);
+     * Index content from a connector to a search space
-      }
+     */
+    const indexConnector = async (
+        connectorId: number,
+        searchSpaceId: string | number,
+        startDate?: string,
+        endDate?: string
+    ) => {
+        try {
+            const token = localStorage.getItem("surfsense_bearer_token");
 
-      const updatedConnectors = connectors.filter(connector => connector.id !== connectorId);
+            if (!token) {
-      setConnectors(updatedConnectors);
+                throw new Error("No authentication token found");
-      updateConnectorSourceItems(updatedConnectors);
+            }
-    } catch (err) {
-      console.error('Error deleting search source connector:', err);
-      throw err;
-    }
-  };
 
-  /**
+            // Build query parameters
-   * Index content from a connector to a search space
+            const params = new URLSearchParams({
-   */
+                search_space_id: searchSpaceId.toString(),
-  const indexConnector = async (
+            });
-    connectorId: number, 
+            if (startDate) {
-    searchSpaceId: string | number, 
+                params.append("start_date", startDate);
-    startDate?: string, 
+            }
-    endDate?: string
+            if (endDate) {
-  ) => {
+                params.append("end_date", endDate);
-    try {
+            }
-      const token = localStorage.getItem('surfsense_bearer_token');
 
-      if (!token) {
+            const response = await fetch(
-        throw new Error('No authentication token found');
+                `${
-      }
+                    process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL
+                }/api/v1/search-source-connectors/${connectorId}/index?${params.toString()}`,
+                {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                        Authorization: `Bearer ${token}`,
+                    },
+                }
+            );
 
-      // Build query parameters
+            if (!response.ok) {
-      const params = new URLSearchParams({ search_space_id: searchSpaceId.toString() });
+                throw new Error(
-      if (startDate) {
+                    `Failed to index connector content: ${response.statusText}`
-        params.append('start_date', startDate);
+                );
-      }
+            }
-      if (endDate) {
-        params.append('end_date', endDate);
-      }
 
-      const response = await fetch(
+            const result = await response.json();
-        `${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/search-source-connectors/${connectorId}/index?${params.toString()}`,
+
-        {
+            // Update the connector's last_indexed_at timestamp
-          method: 'POST',
+            const updatedConnectors = connectors.map((connector) =>
-          headers: {
+                connector.id === connectorId
-            'Content-Type': 'application/json',
+                    ? {
-            'Authorization': `Bearer ${token}`
+                          ...connector,
-          }
+                          last_indexed_at: new Date().toISOString(),
+                      }
+                    : connector
+            );
+            setConnectors(updatedConnectors);
+
+            return result;
+        } catch (err) {
+            console.error("Error indexing connector content:", err);
+            throw err;
         }
-      );
+    };
 
-      if (!response.ok) {
+    /**
-        throw new Error(`Failed to index connector content: ${response.statusText}`);
+     * Get connector source items - memoized to prevent unnecessary re-renders
-      }
+     */
+    const getConnectorSourceItems = useCallback(() => {
+        return connectorSourceItems;
+    }, [connectorSourceItems]);
 
-      const result = await response.json();
+    return {
-      
+        connectors,
-      // Update the connector's last_indexed_at timestamp
+        isLoading,
-      const updatedConnectors = connectors.map(connector => 
+        isLoaded,
-        connector.id === connectorId 
+        error,
-          ? { ...connector, last_indexed_at: new Date().toISOString() } 
+        fetchConnectors,
-          : connector
+        createConnector,
-      );
+        updateConnector,
-      setConnectors(updatedConnectors);
+        deleteConnector,
-      
+        indexConnector,
-      return result;
+        getConnectorSourceItems,
-    } catch (err) {
+        connectorSourceItems,
-      console.error('Error indexing connector content:', err);
+    };
-      throw err;
-    }
-  };
-
-  /**
-   * Get connector source items - memoized to prevent unnecessary re-renders
-   */
-  const getConnectorSourceItems = useCallback(() => {
-    return connectorSourceItems;
-  }, [connectorSourceItems]);
-
-  return {
-    connectors,
-    isLoading,
-    error,
-    createConnector,
-    updateConnector,
-    deleteConnector,
-    indexConnector,
-    getConnectorSourceItems,
-    connectorSourceItems
-  };
 };