fix(ui): Fix pagination for documents

#320 fixed
This commit is contained in:
sanwalsulehri 2025-09-19 16:04:22 +05:00
parent b11bec1c65
commit 798cf788f5
24 changed files with 218 additions and 187 deletions

View file

@ -15,7 +15,7 @@ import {
Trash2,
} from "lucide-react";
import { useRouter, useSearchParams } from "next/navigation";
import { useEffect, useState } from "react";
import { useEffect, useId, useState } from "react";
import { toast } from "sonner";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
@ -84,6 +84,7 @@ const MotionCard = motion(Card);
export default function ChatsPageClient({ searchSpaceId }: ChatsPageClientProps) {
const router = useRouter();
const podcastTitleId = useId();
const [chats, setChats] = useState<Chat[]>([]);
const [filteredChats, setFilteredChats] = useState<Chat[]>([]);
const [isLoading, setIsLoading] = useState(true);
@ -280,7 +281,7 @@ export default function ChatsPageClient({ searchSpaceId }: ChatsPageClientProps)
const payload = {
type: "CHAT",
ids: [currentChatId], // Single chat ID
search_space_id: parseInt(searchSpaceId),
search_space_id: parseInt(searchSpaceId, 10),
podcast_title: currentTitle,
};
@ -830,9 +831,9 @@ export default function ChatsPageClient({ searchSpaceId }: ChatsPageClientProps)
<div className="space-y-4 py-2">
<div className="space-y-2">
<Label htmlFor="podcast-title">Podcast Title</Label>
<Label htmlFor={podcastTitleId}>Podcast Title</Label>
<Input
id="podcast-title"
id={podcastTitleId}
placeholder="Enter podcast title"
value={podcastTitle}
onChange={(e) => updateCurrentChatTitle(e.target.value)}

View file

@ -4,7 +4,7 @@ import { format } from "date-fns";
import { motion } from "framer-motion";
import { Calendar as CalendarIcon, Edit, Plus, RefreshCw, Trash2 } from "lucide-react";
import { useParams, useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { useEffect, useId, useState } from "react";
import { toast } from "sonner";
import {
AlertDialog,
@ -63,6 +63,8 @@ export default function ConnectorsPage() {
const params = useParams();
const searchSpaceId = params.search_space_id as string;
const today = new Date();
const startDateId = useId();
const endDateId = useId();
const { connectors, isLoading, error, deleteConnector, indexConnector } =
useSearchSourceConnectors();
@ -346,11 +348,11 @@ export default function ConnectorsPage() {
<div className="grid gap-4 py-4">
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<Label htmlFor="start-date">Start Date</Label>
<Label htmlFor={startDateId}>Start Date</Label>
<Popover>
<PopoverTrigger asChild>
<Button
id="start-date"
id={startDateId}
variant="outline"
className={cn(
"w-full justify-start text-left font-normal",
@ -373,11 +375,11 @@ export default function ConnectorsPage() {
</Popover>
</div>
<div className="space-y-2">
<Label htmlFor="end-date">End Date</Label>
<Label htmlFor={endDateId}>End Date</Label>
<Popover>
<PopoverTrigger asChild>
<Button
id="end-date"
id={endDateId}
variant="outline"
className={cn(
"w-full justify-start text-left font-normal",

View file

@ -41,7 +41,7 @@ export default function AirtableConnectorPage() {
setDoesConnectorExist(true);
}
});
}, []);
}, [fetchConnectors]);
const handleConnectAirtable = async () => {
setIsConnecting(true);

View file

@ -2,7 +2,7 @@
import { zodResolver } from "@hookform/resolvers/zod";
import { motion } from "framer-motion";
import { ArrowLeft, Check, CircleAlert, Github, Info, ListChecks, Loader2 } from "lucide-react";
import { ArrowLeft, Check, CircleAlert, Info, ListChecks, Loader2 } from "lucide-react";
import { useParams, useRouter } from "next/navigation";
import { useState } from "react";
import { useForm } from "react-hook-form";

View file

@ -1,14 +1,11 @@
"use client";
import { zodResolver } from "@hookform/resolvers/zod";
import { motion } from "framer-motion";
import { ArrowLeft, Check, ExternalLink, Loader2 } from "lucide-react";
import Link from "next/link";
import { useParams, useRouter, useSearchParams } from "next/navigation";
import { useParams, useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
import { Button } from "@/components/ui/button";
import {
Card,
@ -44,7 +41,7 @@ export default function GoogleCalendarConnectorPage() {
setDoesConnectorExist(true);
}
});
}, []);
}, [fetchConnectors]);
// Handle Google OAuth connection
const handleConnectGoogle = async () => {

View file

@ -1,14 +1,11 @@
"use client";
import { zodResolver } from "@hookform/resolvers/zod";
import { motion } from "framer-motion";
import { ArrowLeft, Check, ExternalLink, Loader2 } from "lucide-react";
import Link from "next/link";
import { useParams, useRouter, useSearchParams } from "next/navigation";
import { useParams, useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";
import { z } from "zod";
import { Button } from "@/components/ui/button";
import {
Card,
@ -43,7 +40,7 @@ export default function GoogleGmailConnectorPage() {
setDoesConnectorExist(true);
}
});
}, []);
}, [fetchConnectors]);
// Handle Google OAuth connection
const handleConnectGoogle = async () => {

View file

@ -76,8 +76,15 @@ export function DocumentsTableShell({
const toggleAll = (checked: boolean) => {
const next = new Set(selectedIds);
if (checked) sorted.forEach((d) => next.add(d.id));
else sorted.forEach((d) => next.delete(d.id));
if (checked) {
sorted.forEach((d) => {
next.add(d.id);
});
} else {
sorted.forEach((d) => {
next.delete(d.id);
});
}
setSelectedIds(next);
};

View file

@ -26,11 +26,13 @@ export default function DocumentsTable() {
const params = useParams();
const searchSpaceId = Number(params.search_space_id);
const [pageIndex, setPageIndex] = useState(0);
const [pageSize, setPageSize] = useState(10);
const [pageIndex, setPageIndex] = useState(0);
const [pageSize, setPageSize] = useState(10);
const { documents, loading, error, refreshDocuments, deleteDocument, hasMore } =
useDocuments(searchSpaceId, { pageIndex, pageSize });
const { documents, loading, error, refreshDocuments, deleteDocument, hasMore } = useDocuments(
searchSpaceId,
{ pageIndex, pageSize }
);
const [data, setData] = useState<Document[]>([]);
const [search, setSearch] = useState("");
@ -42,7 +44,7 @@ export default function DocumentsTable() {
content: true,
created_at: true,
});
// pageIndex/pageSize state moved above to feed the hook
// pageIndex/pageSize state moved above to feed the hook
const [sortKey, setSortKey] = useState<SortKey>("title");
const [sortDesc, setSortDesc] = useState(false);
const [selectedIds, setSelectedIds] = useState<Set<number>>(new Set());
@ -63,11 +65,11 @@ export default function DocumentsTable() {
return result;
}, [data, debouncedSearch, activeTypes]);
// Server-side pagination: we filter only the current page's data client-side
const pageDocs = filtered;
const total = pageIndex * pageSize + pageDocs.length + (hasMore ? 1 : 0) - 1;
const pageStart = pageIndex * pageSize;
const pageEnd = pageStart + pageDocs.length;
// Server-side pagination: we filter only the current page's data client-side
const pageDocs = filtered;
const total = pageIndex * pageSize + pageDocs.length + (hasMore ? 1 : 0) - 1;
const pageStart = pageIndex * pageSize;
const _pageEnd = pageStart + pageDocs.length;
const onToggleType = (type: string, checked: boolean) => {
setActiveTypes((prev) => (checked ? [...prev, type] : prev.filter((t) => t !== type)));
@ -154,32 +156,32 @@ export default function DocumentsTable() {
pageIndex={pageIndex}
pageSize={pageSize}
total={total}
onPageSizeChange={async (s) => {
setPageIndex(0);
setPageSize(s);
await refreshDocuments?.({ pageIndex: 0, pageSize: s });
}}
onFirst={async () => {
setPageIndex(0);
await refreshDocuments?.({ pageIndex: 0, pageSize });
}}
onPrev={async () => {
const next = Math.max(0, pageIndex - 1);
if (next !== pageIndex) {
setPageIndex(next);
await refreshDocuments?.({ pageIndex: next, pageSize });
}
}}
onNext={async () => {
if (hasMore) {
const next = pageIndex + 1;
setPageIndex(next);
await refreshDocuments?.({ pageIndex: next, pageSize });
}
}}
onLast={() => {}}
canPrev={pageIndex > 0}
canNext={hasMore}
onPageSizeChange={async (s) => {
setPageIndex(0);
setPageSize(s);
await refreshDocuments?.({ pageIndex: 0, pageSize: s });
}}
onFirst={async () => {
setPageIndex(0);
await refreshDocuments?.({ pageIndex: 0, pageSize });
}}
onPrev={async () => {
const next = Math.max(0, pageIndex - 1);
if (next !== pageIndex) {
setPageIndex(next);
await refreshDocuments?.({ pageIndex: next, pageSize });
}
}}
onNext={async () => {
if (hasMore) {
const next = pageIndex + 1;
setPageIndex(next);
await refreshDocuments?.({ pageIndex: next, pageSize });
}
}}
onLast={() => {}}
canPrev={pageIndex > 0}
canNext={hasMore}
id={id}
/>
</motion.div>

View file

@ -72,7 +72,7 @@ export default function WebpageCrawler() {
body: JSON.stringify({
document_type: "CRAWLED_URL",
content: urls,
search_space_id: parseInt(search_space_id),
search_space_id: parseInt(search_space_id, 10),
}),
}
);

View file

@ -81,7 +81,7 @@ export default function YouTubeVideoAdder() {
body: JSON.stringify({
document_type: "YOUTUBE_VIDEO",
content: videoUrls,
search_space_id: parseInt(search_space_id),
search_space_id: parseInt(search_space_id, 10),
}),
}
);

View file

@ -9,7 +9,7 @@ export default function SearchSpaceDashboardPage() {
useEffect(() => {
router.push(`/dashboard/${search_space_id}/chats`);
}, []);
}, [router.push, search_space_id]);
return <></>;
}

View file

@ -175,7 +175,7 @@ export default function PodcastsPageClient({ searchSpaceId }: PodcastsPageClient
}
// Filter by search space
result = result.filter((podcast) => podcast.search_space_id === parseInt(searchSpaceId));
result = result.filter((podcast) => podcast.search_space_id === parseInt(searchSpaceId, 10));
// Sort podcasts
result.sort((a, b) => {

View file

@ -101,7 +101,7 @@ export default function ResearcherPage() {
const customHandlerAppend = async (
message: Message | CreateMessage,
chatRequestOptions?: { data?: any }
_chatRequestOptions?: { data?: any }
) => {
const newChatId = await createChat(message.content, researchMode, selectedConnectors);
if (newChatId) {
@ -122,7 +122,7 @@ export default function ResearcherPage() {
setIsLoading(true);
loadChatData(chatIdParam);
}
}, [token, isNewChat, chatIdParam]);
}, [token, isNewChat, chatIdParam, loadChatData, setIsLoading]);
// Restore chat state from localStorage on page load
useEffect(() => {
@ -142,6 +142,7 @@ export default function ResearcherPage() {
setSelectedConnectors,
setSearchMode,
setResearchMode,
restoreChatState,
]);
const loadChatData = async (chatId: string) => {
@ -187,7 +188,15 @@ export default function ResearcherPage() {
) {
updateChat(chatIdParam, handler.messages, researchMode, selectedConnectors);
}
}, [handler.messages, handler.status, chatIdParam, isNewChat]);
}, [
handler.messages,
handler.status,
chatIdParam,
isNewChat,
researchMode,
selectedConnectors,
updateChat,
]);
if (isLoading) {
return (

View file

@ -1,5 +1,5 @@
{
"$schema": "https://biomejs.dev/schemas/2.1.2/schema.json",
"$schema": "https://biomejs.dev/schemas/2.2.4/schema.json",
"vcs": {
"enabled": true,
"clientKind": "git",

View file

@ -1,6 +1,6 @@
"use client";
import { ChevronDown, ChevronUp, ExternalLink, FileText, Loader2 } from "lucide-react";
import { ChevronDown, ChevronUp, ExternalLink, Loader2 } from "lucide-react";
import type React from "react";
import { useEffect, useRef, useState } from "react";
import { MarkdownViewer } from "@/components/markdown-viewer";

View file

@ -40,10 +40,10 @@ const DocumentSelector = React.memo(
const { search_space_id } = useParams();
const [isOpen, setIsOpen] = useState(false);
const { documents, loading, isLoaded, fetchDocuments } = useDocuments(
Number(search_space_id),
true
);
const { documents, loading, isLoaded, fetchDocuments } = useDocuments(Number(search_space_id), {
lazy: true,
pageSize: 50,
});
const handleOpenChange = useCallback(
(open: boolean) => {

View file

@ -206,14 +206,14 @@ export function DocumentsDataTable({
if (hasChanges && Object.keys(initialRowSelection).length > 0) {
setRowSelection(initialRowSelection);
}
}, [initialRowSelection]);
}, [initialRowSelection, rowSelection]);
// Initialize row selection on mount
useEffect(() => {
if (Object.keys(rowSelection).length === 0 && Object.keys(initialRowSelection).length > 0) {
setRowSelection(initialRowSelection);
}
}, []);
}, [initialRowSelection, rowSelection]);
const filteredDocuments = useMemo(() => {
if (documentTypeFilter === "ALL") return documents;
@ -240,7 +240,7 @@ export function DocumentsDataTable({
const selectedRows = table.getFilteredSelectedRowModel().rows;
const selectedDocuments = selectedRows.map((row) => row.original);
onSelectionChange(selectedDocuments);
}, [rowSelection, onSelectionChange, table]);
}, [onSelectionChange, table]);
const handleClearAll = () => setRowSelection({});

View file

@ -65,7 +65,7 @@ export function AssignRolesStep({ onPreferencesUpdated }: AssignRolesStepProps)
const handleRoleAssignment = async (role: string, configId: string) => {
const newAssignments = {
...assignments,
[role]: configId === "" ? "" : parseInt(configId),
[role]: configId === "" ? "" : parseInt(configId, 10),
};
setAssignments(newAssignments);
@ -80,15 +80,15 @@ export function AssignRolesStep({ onPreferencesUpdated }: AssignRolesStepProps)
const numericAssignments = {
long_context_llm_id:
typeof newAssignments.long_context_llm_id === "string"
? parseInt(newAssignments.long_context_llm_id)
? parseInt(newAssignments.long_context_llm_id, 10)
: newAssignments.long_context_llm_id,
fast_llm_id:
typeof newAssignments.fast_llm_id === "string"
? parseInt(newAssignments.fast_llm_id)
? parseInt(newAssignments.fast_llm_id, 10)
: newAssignments.fast_llm_id,
strategic_llm_id:
typeof newAssignments.strategic_llm_id === "string"
? parseInt(newAssignments.strategic_llm_id)
? parseInt(newAssignments.strategic_llm_id, 10)
: newAssignments.strategic_llm_id,
};

View file

@ -93,7 +93,7 @@ export function LLMRoleManager() {
const handleRoleAssignment = (role: string, configId: string) => {
const newAssignments = {
...assignments,
[role]: configId === "unassigned" ? "" : parseInt(configId),
[role]: configId === "unassigned" ? "" : parseInt(configId, 10),
};
setAssignments(newAssignments);
@ -121,19 +121,19 @@ export function LLMRoleManager() {
long_context_llm_id:
typeof assignments.long_context_llm_id === "string"
? assignments.long_context_llm_id
? parseInt(assignments.long_context_llm_id)
? parseInt(assignments.long_context_llm_id, 10)
: undefined
: assignments.long_context_llm_id,
fast_llm_id:
typeof assignments.fast_llm_id === "string"
? assignments.fast_llm_id
? parseInt(assignments.fast_llm_id)
? parseInt(assignments.fast_llm_id, 10)
: undefined
: assignments.fast_llm_id,
strategic_llm_id:
typeof assignments.strategic_llm_id === "string"
? assignments.strategic_llm_id
? parseInt(assignments.strategic_llm_id)
? parseInt(assignments.strategic_llm_id, 10)
: undefined
: assignments.strategic_llm_id,
};

View file

@ -1,6 +1,6 @@
import { dirname } from "node:path";
import { fileURLToPath } from "node:url";
import { FlatCompat } from "@eslint/eslintrc";
import { dirname } from "path";
import { fileURLToPath } from "url";
const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

View file

@ -30,69 +30,81 @@ export type DocumentType =
| "AIRTABLE_CONNECTOR";
export function useDocuments(
searchSpaceId: number,
optionsOrLazy?: boolean | { pageIndex?: number; pageSize?: number; lazy?: boolean }
searchSpaceId: number,
optionsOrLazy?: boolean | { pageIndex?: number; pageSize?: number; lazy?: boolean }
) {
const lazy = typeof optionsOrLazy === "boolean" ? optionsOrLazy : optionsOrLazy?.lazy ?? false;
const pageIndex = typeof optionsOrLazy === "object" && optionsOrLazy?.pageIndex !== undefined ? optionsOrLazy.pageIndex : 0;
const pageSize = typeof optionsOrLazy === "object" && optionsOrLazy?.pageSize !== undefined ? optionsOrLazy.pageSize : 50;
const lazy = typeof optionsOrLazy === "boolean" ? optionsOrLazy : (optionsOrLazy?.lazy ?? false);
const pageIndex =
typeof optionsOrLazy === "object" && optionsOrLazy?.pageIndex !== undefined
? optionsOrLazy.pageIndex
: 0;
const pageSize =
typeof optionsOrLazy === "object" && optionsOrLazy?.pageSize !== undefined
? optionsOrLazy.pageSize
: 50;
const [documents, setDocuments] = useState<Document[]>([]);
const [loading, setLoading] = useState(!lazy);
const [error, setError] = useState<string | null>(null);
const [isLoaded, setIsLoaded] = useState(false);
const [hasMore, setHasMore] = useState(false);
const [documents, setDocuments] = useState<Document[]>([]);
const [loading, setLoading] = useState(!lazy);
const [error, setError] = useState<string | null>(null);
const [isLoaded, setIsLoaded] = useState(false);
const [hasMore, setHasMore] = useState(false);
const fetchDocuments = useCallback(async (override?: { pageIndex?: number; pageSize?: number }) => {
if (isLoaded && lazy && !override) return;
const fetchDocuments = useCallback(
async (override?: { pageIndex?: number; pageSize?: number }) => {
if (isLoaded && lazy && !override) return;
const effectivePageIndex = override?.pageIndex ?? pageIndex;
const effectivePageSize = override?.pageSize ?? pageSize;
const skip = effectivePageIndex * effectivePageSize;
const limit = effectivePageSize;
const effectivePageIndex = override?.pageIndex ?? pageIndex;
const effectivePageSize = override?.pageSize ?? pageSize;
const skip = effectivePageIndex * effectivePageSize;
const limit = effectivePageSize;
try {
setLoading(true);
const url = new URL(`${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/documents`);
if (searchSpaceId) url.searchParams.set("search_space_id", String(searchSpaceId));
url.searchParams.set("skip", String(skip));
url.searchParams.set("limit", String(limit));
try {
setLoading(true);
const url = new URL(`${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/documents`);
if (searchSpaceId) url.searchParams.set("search_space_id", String(searchSpaceId));
url.searchParams.set("skip", String(skip));
url.searchParams.set("limit", String(limit));
const response = await fetch(url.toString(), {
headers: {
Authorization: `Bearer ${localStorage.getItem("surfsense_bearer_token")}`,
},
method: "GET",
});
const response = await fetch(url.toString(), {
headers: {
Authorization: `Bearer ${localStorage.getItem("surfsense_bearer_token")}`,
},
method: "GET",
});
if (!response.ok) {
toast.error("Failed to fetch documents");
throw new Error("Failed to fetch documents");
}
if (!response.ok) {
toast.error("Failed to fetch documents");
throw new Error("Failed to fetch documents");
}
const data = await response.json();
setDocuments(data);
setHasMore(Array.isArray(data) && data.length === effectivePageSize);
setError(null);
setIsLoaded(true);
} catch (err: any) {
setError(err.message || "Failed to fetch documents");
console.error("Error fetching documents:", err);
} finally {
setLoading(false);
}
}, [searchSpaceId, isLoaded, lazy, pageIndex, pageSize]);
const data = await response.json();
setDocuments(data);
setHasMore(Array.isArray(data) && data.length === effectivePageSize);
setError(null);
setIsLoaded(true);
} catch (err: any) {
setError(err.message || "Failed to fetch documents");
console.error("Error fetching documents:", err);
} finally {
setLoading(false);
}
},
[searchSpaceId, isLoaded, lazy, pageIndex, pageSize]
);
useEffect(() => {
if (!lazy && searchSpaceId !== undefined && searchSpaceId !== null) {
fetchDocuments();
}
}, [searchSpaceId, lazy, fetchDocuments, pageIndex, pageSize]);
useEffect(() => {
if (!lazy && searchSpaceId !== undefined && searchSpaceId !== null) {
fetchDocuments();
}
}, [searchSpaceId, lazy, fetchDocuments]);
const refreshDocuments = useCallback(async (override?: { pageIndex?: number; pageSize?: number }) => {
setIsLoaded(false);
await fetchDocuments(override);
}, [fetchDocuments]);
const refreshDocuments = useCallback(
async (override?: { pageIndex?: number; pageSize?: number }) => {
setIsLoaded(false);
await fetchDocuments(override);
},
[fetchDocuments]
);
// Function to delete a document
const deleteDocument = useCallback(
@ -133,9 +145,9 @@ export function useDocuments(
isLoaded,
fetchDocuments, // Manual fetch function for lazy mode
refreshDocuments,
deleteDocument,
hasMore,
pageIndex,
pageSize,
deleteDocument,
hasMore,
pageIndex,
pageSize,
};
}

View file

@ -79,7 +79,7 @@ export function useLLMConfigs() {
useEffect(() => {
fetchLLMConfigs();
}, []);
}, [fetchLLMConfigs]);
const createLLMConfig = async (config: CreateLLMConfig): Promise<LLMConfig | null> => {
try {
@ -216,7 +216,7 @@ export function useLLMPreferences() {
useEffect(() => {
fetchPreferences();
}, []);
}, [fetchPreferences]);
const updatePreferences = async (newPreferences: Partial<LLMPreferences>): Promise<boolean> => {
try {

View file

@ -54,7 +54,7 @@ export function useLogs(searchSpaceId?: number, filters: LogFilters = {}) {
const [error, setError] = useState<string | null>(null);
// Memoize filters to prevent infinite re-renders
const memoizedFilters = useMemo(() => filters, [JSON.stringify(filters)]);
const memoizedFilters = useMemo(() => filters, [filters]);
const buildQueryParams = useCallback(
(customFilters: LogFilters = {}) => {

View file

@ -53,6 +53,47 @@ export const useSearchSourceConnectors = (lazy: boolean = false) => {
},
]);
// Update connector source items when connectors change
const updateConnectorSourceItems = useCallback((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: [],
}));
setConnectorSourceItems([...defaultConnectors, ...apiConnectors]);
}, []);
const fetchConnectors = useCallback(async () => {
if (isLoaded && lazy) return; // Avoid redundant calls in lazy mode
@ -94,7 +135,11 @@ export const useSearchSourceConnectors = (lazy: boolean = false) => {
} finally {
setIsLoading(false);
}
}, [isLoaded, lazy]);
}, [
isLoaded,
lazy, // Update connector source items when connectors change
updateConnectorSourceItems,
]);
useEffect(() => {
if (!lazy) {
@ -108,47 +153,6 @@ export const useSearchSourceConnectors = (lazy: boolean = false) => {
await fetchConnectors();
}, [fetchConnectors]);
// 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: [],
}));
setConnectorSourceItems([...defaultConnectors, ...apiConnectors]);
};
/**
* Create a new search source connector
*/