fix(connectors): stop the connector selector implying an option does not exist

The connector selector field ignored the drain state the shared selector hook
already exposes. Paginated selectors fill in the background and the combobox
filters client-side, so a not-yet-drained option is genuinely absent from the
list — and the dropdown said "No spaces found", which reads as "this space does
not exist" and sends users off to enter the value by hand. That is what happened
with a Confluence space on a site with thousands of personal spaces.

It now reports that the list is still filling, surfaces a failed drain instead of
claiming to load forever, and is honest when the drain stops at its page cap.

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/connector-selector-field/connector-selector-field.tsx

@@ -62,11 +62,36 @@ export function ConnectorSelectorField({
   }, [field.dependsOn, sourceConfig, configFields, canonicalModes])
 
   const isEnabled = !disabled && !!credentialId && depsResolved
-  const { data: options = [], isLoading } = useSelectorOptions(field.selectorKey, {
+  const {
+    data: options = [],
+    isLoading,
+    hasMore,
+    isFetchingMore,
+    truncated,
+    error,
+  } = useSelectorOptions(field.selectorKey, {
     context,
     enabled: isEnabled,
   })
 
+  /**
+   * Paginated selectors drain in the background and the combobox filters
+   * client-side, so a not-yet-drained option is genuinely absent from the list.
+   * Saying "none found" there reads as "it does not exist" and sends users off to
+   * enter the value by hand — say the list is still filling instead, and be honest
+   * when the drain stopped early.
+   *
+   * `error` is checked first: the drain halts on a failed page but leaves
+   * `hasMore` set, so a failure would otherwise claim to be loading forever.
+   */
+  const emptyMessage = useMemo(() => {
+    const noun = field.title.toLowerCase()
+    if (error) return `Could not load ${noun} — enter the value directly`
+    if (hasMore || isFetchingMore) return `Still loading ${noun}…`
+    if (truncated) return `Too many ${noun} to list — enter the value directly`
+    return `No ${noun} found`
+  }, [field.title, error, hasMore, isFetchingMore, truncated])
+
   const comboboxOptions = useMemo<ComboboxOption[]>(
     () => options.map((opt) => ({ label: opt.label, value: opt.id })),
     [options]
@@ -99,7 +124,7 @@ export function ConnectorSelectorField({
               : field.placeholder || `Select ${field.title.toLowerCase()}`
         }
         disabled={disabled || !credentialId || !depsResolved}
-        emptyMessage={`No ${field.title.toLowerCase()} found`}
+        emptyMessage={emptyMessage}
       />
     )
   }
@@ -120,7 +145,7 @@ export function ConnectorSelectorField({
             : field.placeholder || `Select ${field.title.toLowerCase()}`
       }
       disabled={disabled || !credentialId || !depsResolved}
-      emptyMessage={`No ${field.title.toLowerCase()} found`}
+      emptyMessage={emptyMessage}
     />
   )
 }