refactor(web): consume runtime config in connectors and document uploads

surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/circleback-config.tsx

@@ -43,11 +43,6 @@ export const CirclebackConfig: FC<CirclebackConfigProps> = ({ connector, onNameC
 			if (!connector.search_space_id) return;
 
 			const baseUrl = BACKEND_URL;
-			if (!baseUrl) {
-				console.error("NEXT_PUBLIC_FASTAPI_BACKEND_URL is not configured");
-				setIsLoading(false);
-				return;
-			}
 
 			setIsLoading(true);
 			try {

surfsense_web/components/assistant-ui/connector-popup/tabs/all-connectors-tab.tsx

@@ -5,7 +5,7 @@ import type { FC } from "react";
 import { EnumConnectorName } from "@/contracts/enums/connector";
 import type { SearchSourceConnector } from "@/contracts/types/connector.types";
 import { usePlatform } from "@/hooks/use-platform";
-import { isSelfHosted } from "@/lib/env-config";
+import { useIsSelfHosted } from "@/components/providers/runtime-config";
 import { ConnectorCard } from "../components/connector-card";
 import {
 	COMPOSIO_CONNECTORS,
@@ -22,6 +22,11 @@ type OAuthConnector = (typeof OAUTH_CONNECTORS)[number];
 type ComposioConnector = (typeof COMPOSIO_CONNECTORS)[number];
 type OtherConnector = (typeof OTHER_CONNECTORS)[number];
 type CrawlerConnector = (typeof CRAWLERS)[number];
+type DeploymentFilterableConnector = {
+	readonly id: string;
+	readonly selfHostedOnly?: boolean;
+	readonly desktopOnly?: boolean;
+};
 
 /**
  * Extract the display name from a full connector name.
@@ -66,14 +71,14 @@ export const AllConnectorsTab: FC<AllConnectorsTabProps> = ({
 	onManage,
 	onViewAccountsList,
 }) => {
-	const selfHosted = isSelfHosted();
+	const selfHosted = useIsSelfHosted();
 	const { isDesktop } = usePlatform();
 
 	const matchesSearch = (title: string, description: string) =>
 		title.toLowerCase().includes(searchQuery.toLowerCase()) ||
 		description.toLowerCase().includes(searchQuery.toLowerCase());
 
-	const passesDeploymentFilter = (c: { selfHostedOnly?: boolean; desktopOnly?: boolean }) =>
+	const passesDeploymentFilter = (c: DeploymentFilterableConnector) =>
 		(!c.selfHostedOnly || selfHosted) && (!c.desktopOnly || isDesktop);
 
 	// Filter connectors based on search and deployment mode

surfsense_web/components/layout/ui/sidebar/DocumentsSidebar.tsx

@@ -72,6 +72,7 @@ import type { DocumentTypeEnum } from "@/contracts/types/document.types";
 import { useDebouncedValue } from "@/hooks/use-debounced-value";
 import { useMediaQuery } from "@/hooks/use-media-query";
 import { useElectronAPI, usePlatform } from "@/hooks/use-platform";
+import { useRuntimeConfig } from "@/components/providers/runtime-config";
 import { anonymousChatApiService } from "@/lib/apis/anonymous-chat-api.service";
 import { documentsApiService } from "@/lib/apis/documents-api.service";
 import { foldersApiService } from "@/lib/apis/folders-api.service";
@@ -226,6 +227,7 @@ function AuthenticatedDocumentsSidebarBase({
 	const isMobile = !useMediaQuery("(min-width: 640px)");
 	const platformElectronAPI = useElectronAPI();
 	const electronAPI = desktopFeaturesEnabled ? platformElectronAPI : null;
+	const { etlService } = useRuntimeConfig();
 	const searchSpaceId = Number(params.search_space_id);
 	const setConnectorDialogOpen = useSetAtom(connectorDialogOpenAtom);
 	const openEditorPanel = useSetAtom(openEditorPanelAtom);
@@ -618,7 +620,8 @@ function AuthenticatedDocumentsSidebarBase({
 					folderName: matched.name,
 					searchSpaceId,
 					excludePatterns: matched.excludePatterns ?? DEFAULT_EXCLUDE_PATTERNS,
-					fileExtensions: matched.fileExtensions ?? Array.from(getSupportedExtensionsSet()),
+					fileExtensions:
+						matched.fileExtensions ?? Array.from(getSupportedExtensionsSet(undefined, etlService)),
 					rootFolderId: folder.id,
 				});
 				toast.success(`Re-scan complete: ${matched.name}`);
@@ -626,7 +629,7 @@ function AuthenticatedDocumentsSidebarBase({
 				toast.error((err as Error)?.message || "Failed to re-scan folder");
 			}
 		},
-		[searchSpaceId, electronAPI]
+		[searchSpaceId, electronAPI, etlService]
 	);
 
 	const handleStopWatching = useCallback(

surfsense_web/components/sources/DocumentUploadTab.tsx

@@ -8,6 +8,7 @@ import { type ChangeEvent, useCallback, useEffect, useMemo, useRef, useState } f
 import { useDropzone } from "react-dropzone";
 import { toast } from "sonner";
 import { uploadDocumentMutationAtom } from "@/atoms/documents/document-mutation.atoms";
+import { useRuntimeConfig } from "@/components/providers/runtime-config";
 import {
 	Accordion,
 	AccordionContent,
@@ -136,6 +137,7 @@ export function DocumentUploadTab({
 	onAccordionStateChange,
 }: DocumentUploadTabProps) {
 	const t = useTranslations("upload_documents");
+	const { etlService } = useRuntimeConfig();
 	const [files, setFiles] = useState<FileWithId[]>([]);
 	const [uploadProgress, setUploadProgress] = useState(0);
 	const [accordionValue, setAccordionValue] = useState<string>("");
@@ -160,7 +162,7 @@ export function DocumentUploadTab({
 	const electronAPI = useElectronAPI();
 	const isElectron = !!electronAPI?.browseFiles;
 
-	const acceptedFileTypes = useMemo(() => getAcceptedFileTypes(), []);
+	const acceptedFileTypes = useMemo(() => getAcceptedFileTypes(etlService), [etlService]);
 	const supportedExtensions = useMemo(
 		() => getSupportedExtensions(acceptedFileTypes),
 		[acceptedFileTypes]

surfsense_web/components/sources/FolderWatchDialog.tsx

@@ -3,6 +3,7 @@
 import { X } from "lucide-react";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { toast } from "sonner";
+import { useRuntimeConfig } from "@/components/providers/runtime-config";
 import { Button } from "@/components/ui/button";
 import {
 	Dialog,
@@ -48,6 +49,7 @@ export function FolderWatchDialog({
 	const [submitting, setSubmitting] = useState(false);
 	const [progress, setProgress] = useState<FolderSyncProgress | null>(null);
 	const abortRef = useRef<AbortController | null>(null);
+	const { etlService } = useRuntimeConfig();
 
 	useEffect(() => {
 		if (open && initialFolder) {
@@ -55,7 +57,10 @@ export function FolderWatchDialog({
 		}
 	}, [open, initialFolder]);
 
-	const supportedExtensions = useMemo(() => Array.from(getSupportedExtensionsSet()), []);
+	const supportedExtensions = useMemo(
+		() => Array.from(getSupportedExtensionsSet(undefined, etlService)),
+		[etlService]
+	);
 
 	const handleSelectFolder = useCallback(async () => {
 		const api = window.electronAPI;