diff --git a/apps/web/components/add-document/connections.tsx b/apps/web/components/add-document/connections.tsx index 8b24a6bd..f912c682 100644 --- a/apps/web/components/add-document/connections.tsx +++ b/apps/web/components/add-document/connections.tsx @@ -19,6 +19,8 @@ import { } from "lucide-react" import { useEffect, useState } from "react" import { toast } from "sonner" +import { connectorPause } from "@/lib/connector-availability" +import { useConnectorNotify } from "@/lib/connector-notify" import type { z } from "zod" import { dmSans125ClassName, dmSansClassName } from "@/lib/fonts" import { cn } from "@lib/utils" @@ -505,7 +507,14 @@ export function ConnectContent({ selectedProject }: ConnectContentProps) { }, }) + const notify = useConnectorNotify() + + // Every connect path funnels here; a `disabled` button would swallow the click. const handleConnect = (provider: ConnectorProvider) => { + if (connectorPause(provider)) { + notify.request(provider) + return + } setConnectingProvider(provider) addConnectionMutation.mutate({ provider, @@ -548,14 +557,32 @@ export function ConnectContent({ selectedProject }: ConnectContentProps) {
-

{config.title}

+
+

{config.title}

+ {connectorPause(provider) && ( + + Paused + + )} +

{config.description}

- {provider === "google-drive" ? ( + {connectorPause(provider) ? ( + + ) : provider === "google-drive" ? (

{ + const pause = connectorPause(provider) + if (!pause) return + toast.info(pause.message) + }, []) + const handleUpgrade = useCallback( async (planId?: unknown) => { const checkoutPlanId = planId === "api_max" ? "api_max" : "api_pro" @@ -3084,6 +3143,10 @@ export function IntegrationsView({ if (["notion", "google-drive", "onedrive"].includes(target)) { // The add-document modal is driven by its own ?add param, so clearing ?connect is safe. void setConnectTarget(null) + if (connectorPause(target)) { + handlePausedConnector(target) + return + } void setAddDoc("connect") } }, 0) @@ -3103,6 +3166,7 @@ export function IntegrationsView({ setAddDoc, handleUpgrade, openPluginSetup, + handlePausedConnector, ]) const closeMcpModal = () => { @@ -3551,15 +3615,20 @@ export function IntegrationsView({ const count = connectionsByProvider[item.provider].length const isGranola = item.provider === "granola" const needsPlanUpgrade = !isAutumnLoading && !connectorAccess + const pause = connectorPause(item.provider) if (count > 0) { return (

) } + if (pause) { + return ( + trackCard(item)} + provider={item.provider} + title={pause.message} + /> + ) + } if (needsPlanUpgrade) { return ( handleUpgrade("api_pro")}> @@ -3795,6 +3878,7 @@ export function IntegrationsView({ leftIndicator={renderLeftIndicator(item)} statusSlot={renderStatus(item)} layoutClassName={layoutClassName} + paused={item.kind === "connector" && !!connectorPause(item.provider)} /> ) diff --git a/apps/web/components/integrations/install-steps.tsx b/apps/web/components/integrations/install-steps.tsx index de2aaa50..a9960f15 100644 --- a/apps/web/components/integrations/install-steps.tsx +++ b/apps/web/components/integrations/install-steps.tsx @@ -16,17 +16,22 @@ export function PillButton({ onClick, disabled, type = "button", + className, + title, }: { children: ReactNode onClick?: () => void disabled?: boolean type?: "button" | "submit" + className?: string + title?: string }) { return (