feat(connector-edit): fall back to connected card for config-less live connectors

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

@@ -1,14 +0,0 @@
-"use client";
-
-import type { FC } from "react";
-import type { SearchSourceConnector } from "@/contracts/types/connector.types";
-
-interface ComposioCalendarConfigProps {
-	connector: SearchSourceConnector;
-	onConfigChange?: (config: Record<string, unknown>) => void;
-	onNameChange?: (name: string) => void;
-}
-
-export const ComposioCalendarConfig: FC<ComposioCalendarConfigProps> = () => {
-	return <div className="space-y-6" />;
-};

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

@@ -1,14 +0,0 @@
-"use client";
-
-import type { FC } from "react";
-import type { SearchSourceConnector } from "@/contracts/types/connector.types";
-
-interface ComposioGmailConfigProps {
-	connector: SearchSourceConnector;
-	onConfigChange?: (config: Record<string, unknown>) => void;
-	onNameChange?: (name: string) => void;
-}
-
-export const ComposioGmailConfig: FC<ComposioGmailConfigProps> = () => {
-	return <div className="space-y-6" />;
-};

surfsense_web/components/assistant-ui/connector-popup/connector-configs/components/live-connector-connected-card.tsx

@@ -0,0 +1,48 @@
+"use client";
+
+import { CheckCircle2 } from "lucide-react";
+import type { FC } from "react";
+import { getConnectorTypeDisplay } from "@/lib/connectors/utils";
+import {
+	COMPOSIO_CONNECTORS,
+	CRAWLERS,
+	OAUTH_CONNECTORS,
+	OTHER_CONNECTORS,
+} from "../../constants/connector-constants";
+import type { ConnectorConfigProps } from "../index";
+
+// Catalog descriptions keyed by connector type, reused as the capability line so
+// the copy stays in sync with the catalog cards.
+const DESCRIPTION_BY_TYPE = new Map<string, string>(
+	[...OAUTH_CONNECTORS, ...COMPOSIO_CONNECTORS, ...OTHER_CONNECTORS, ...CRAWLERS].map((c) => [
+		c.connectorType,
+		c.description,
+	])
+);
+
+/**
+ * Fallback manage view for live connectors that are neither MCP-backed nor have
+ * a dedicated config component (native/Composio Gmail & Calendar). There is
+ * nothing to configure, so we just confirm the connection and echo what the
+ * agent can do — no Trusted Tools (that feature is MCP-only, see the backend
+ * `_ensure_mcp_connector_for_user`).
+ */
+export const LiveConnectorConnectedCard: FC<ConnectorConfigProps> = ({ connector }) => {
+	const capability =
+		DESCRIPTION_BY_TYPE.get(connector.connector_type) ??
+		`connect to ${getConnectorTypeDisplay(connector.connector_type)}`;
+
+	return (
+		<div className="space-y-6">
+			<div className="rounded-xl border border-border bg-emerald-500/5 p-4 flex items-start gap-3">
+				<div className="flex h-8 w-8 items-center justify-center rounded-lg bg-emerald-500/10 shrink-0 mt-0.5">
+					<CheckCircle2 className="size-4 text-emerald-500" />
+				</div>
+				<div className="text-xs sm:text-sm">
+					<p className="font-medium text-xs sm:text-sm">Connected</p>
+					<p className="text-muted-foreground mt-1 text-[10px] sm:text-sm">{capability}.</p>
+				</div>
+			</div>
+		</div>
+	);
+};

surfsense_web/components/assistant-ui/connector-popup/connector-configs/index.tsx

@@ -55,12 +55,8 @@ const configMap: Record<string, () => Promise<{ default: FC<ConnectorConfigProps
 		import("./components/obsidian-config").then((m) => ({ default: m.ObsidianConfig })),
 	COMPOSIO_GOOGLE_DRIVE_CONNECTOR: () =>
 		import("./components/composio-drive-config").then((m) => ({ default: m.ComposioDriveConfig })),
-	COMPOSIO_GMAIL_CONNECTOR: () =>
+	// Composio Gmail/Calendar have nothing to configure; the edit view falls back
-		import("./components/composio-gmail-config").then((m) => ({ default: m.ComposioGmailConfig })),
+	// to LiveConnectorConnectedCard for live connectors without a config here.
-	COMPOSIO_GOOGLE_CALENDAR_CONNECTOR: () =>
-		import("./components/composio-calendar-config").then((m) => ({
-			default: m.ComposioCalendarConfig,
-		})),
 };
 
 const componentCache = new Map<string, ConnectorConfigComponent>();

surfsense_web/components/assistant-ui/connector-popup/connector-configs/views/connector-edit-view.tsx

@@ -20,6 +20,7 @@ import { PeriodicSyncConfig } from "../../components/periodic-sync-config";
 import { VisionLLMConfig } from "../../components/vision-llm-config";
 import { LIVE_CONNECTOR_TYPES } from "../../constants/connector-constants";
 import { getConnectorDisplayName } from "../../tabs/all-connectors-tab";
+import { LiveConnectorConnectedCard } from "../components/live-connector-connected-card";
 import { MCPServiceConfig } from "../components/mcp-service-config";
 import { getConnectorConfigComponent } from "../index";
 
@@ -124,8 +125,13 @@ export const ConnectorEditView: FC<ConnectorEditViewProps> = ({
 	// Get connector-specific config component (MCP-backed connectors use a generic view)
 	const ConnectorConfigComponent = useMemo(() => {
 		if (isMCPBacked) return MCPServiceConfig;
-		return getConnectorConfigComponent(connector.connector_type);
+		// Live connectors without a dedicated config (native/Composio Gmail &
-	}, [connector.connector_type, isMCPBacked]);
+		// Calendar) fall back to a simple "Connected" card instead of a blank body.
+		return (
+			getConnectorConfigComponent(connector.connector_type) ??
+			(isLive ? LiveConnectorConnectedCard : null)
+		);
+	}, [connector.connector_type, isMCPBacked, isLive]);
 	const [isScrolled, setIsScrolled] = useState(false);
 	const [hasMoreContent, setHasMoreContent] = useState(false);
 	const [showDisconnectConfirm, setShowDisconnectConfirm] = useState(false);
@@ -201,7 +207,7 @@ export const ConnectorEditView: FC<ConnectorEditViewProps> = ({
 			{/* Fixed Header */}
 			<div
 				className={cn(
-					"flex-shrink-0 px-6 sm:px-12 pt-8 sm:pt-10 transition-shadow duration-200 relative z-10",
+					"flex-shrink-0 transition-shadow duration-200 relative z-10",
 					isScrolled && "shadow-sm"
 				)}
 			>
@@ -262,7 +268,7 @@ export const ConnectorEditView: FC<ConnectorEditViewProps> = ({
 			<div className="flex-1 min-h-0 relative overflow-hidden">
 				<div
 					ref={scrollContainerRef}
-					className="h-full overflow-y-auto px-6 sm:px-12"
+					className="h-full overflow-y-auto"
 					onScroll={handleScroll}
 				>
 					<div className="space-y-6 pb-6 pt-2">
@@ -362,7 +368,7 @@ export const ConnectorEditView: FC<ConnectorEditViewProps> = ({
 			</div>
 
 			{/* Fixed Footer - Action buttons */}
-			<div className="flex-shrink-0 flex flex-col sm:flex-row items-stretch sm:items-center justify-between gap-3 sm:gap-0 px-6 sm:px-12 py-6 sm:py-6 bg-popover">
+			<div className="flex-shrink-0 flex flex-col sm:flex-row items-stretch sm:items-center justify-between gap-3 sm:gap-0 py-6 sm:py-6 bg-transparent">
 				{showDisconnectConfirm ? (
 					<div className="flex flex-col sm:flex-row items-stretch sm:items-center gap-3 flex-1 sm:flex-initial">
 						<span className="text-xs sm:text-sm text-muted-foreground sm:whitespace-nowrap">