@base44/superagent-native 0.0.1

package/lib/module/EditorDrawer.js

@@ -0,0 +1,1122 @@
+"use strict";
+
+import React, { useEffect, useMemo, useState } from 'react';
+import { ActivityIndicator, Modal, Pressable, ScrollView, Text, TextInput, View } from 'react-native';
+import { AlertCircle, Archive, BriefcaseBusiness, CalendarDays, Check, ChevronDown, Coins, Cloud, Database, Edit3, FileText, GitBranch, HardDrive, Mail, MessageCircle, MoreHorizontal, Plug, Play, RotateCcw, Search, Settings, Timer, ToggleLeft, ToggleRight, Trash2, Unplug, Webhook, X, Zap } from 'lucide-react-native';
+import { AgentSettingsPanel } from "./AgentSettingsPanel.js";
+import { AgentSphereIcon } from "./AgentSphereIcon.js";
+import { ChannelsPanel } from "./ChannelsPanel.js";
+import { ConnectorBrandIcon, hasConnectorBrandIcon } from "./connectorBrandIcons.js";
+import { SUPERAGENT_CONNECTOR_CATALOG } from "./connectorCatalog.js";
+import { EDITOR_TAB_SECTIONS, getEditorTabLabel } from "./editorTabs.js";
+import { editorShellStyles } from "./editorShellStyles.js";
+import { FilesPanel } from "./FilesPanel.js";
+import { styles } from "./styles.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const CONNECTOR_ICONS = {
+  github: GitBranch,
+  gmail: Mail,
+  googlecalendar: CalendarDays,
+  googledocs: FileText,
+  googledrive: HardDrive,
+  googlesheets: Database,
+  hubspot: BriefcaseBusiness,
+  notion: FileText,
+  outlook: Mail,
+  salesforce: Cloud,
+  slack: MessageCircle,
+  slackbot: MessageCircle,
+  stripe: Database
+};
+const AUTOMATION_ICONS = {
+  connector: Webhook,
+  entity: Zap,
+  scheduled: Timer
+};
+const SETTING_TABS = EDITOR_TAB_SECTIONS.flatMap(section => section.tabs).filter(tab => tab.id !== 'chat');
+export function EditorDrawer({
+  activeTab,
+  agent,
+  automations,
+  automationCredits,
+  availableConnectors,
+  channelStatus,
+  collaborators,
+  connectedConnectors,
+  connectingChannelId,
+  connectingConnectorId,
+  fileLoadError,
+  fileLoadFailed,
+  filePaths,
+  isLoadingAgentSettings,
+  isLoadingChannels,
+  isLoadingCollaborators,
+  isLoadingFiles,
+  isLoadingAutomations,
+  isLoadingConnectors,
+  isVisible,
+  secrets,
+  onClose,
+  onCancelConnectorConnection,
+  onArchiveAutomation,
+  onCloneAgent,
+  onConnectConnector,
+  onDeleteAgent,
+  onDeleteAutomation,
+  onDeleteSecret,
+  onDisconnectConnector,
+  onDisconnectIMessage,
+  onDisconnectTelegram,
+  onEditAutomation,
+  onGenerateLineCode,
+  onGenerateIMessageCode,
+  onOpenIMessage,
+  onOpenLine,
+  onRemoveConnector,
+  onOpenTelegram,
+  onOpenWhatsApp,
+  onOpenSandboxFile,
+  onRefreshChannels,
+  onRefreshAgentSettings,
+  onRefreshAutomations,
+  onRefreshCollaborators,
+  onRefreshFiles,
+  onRestoreAutomation,
+  onRunAutomationNow,
+  onSaveSandboxFile,
+  onSaveSecret,
+  onSelectTab,
+  onShareAgentLink,
+  onShareIMessageCode,
+  onShareLineCode,
+  onSetupTelegram,
+  onToggleAutomation,
+  onUpdateAgentModel,
+  onUpdateToolPermissions,
+  onUploadSandboxFiles
+}) {
+  const initialTab = activeTab === 'chat' ? 'integrations' : activeTab;
+  const [selectedTab, setSelectedTab] = useState(initialTab);
+  useEffect(() => {
+    if (isVisible) {
+      setSelectedTab(activeTab === 'chat' ? 'integrations' : activeTab);
+    }
+  }, [activeTab, isVisible]);
+  const selectTab = tab => {
+    setSelectedTab(tab);
+    onSelectTab(tab);
+    if (tab === 'tasks') {
+      onRefreshAutomations?.(agent.id);
+    }
+    if (tab === 'files') {
+      onRefreshFiles?.(agent.id);
+    }
+    if (tab === 'channels') {
+      onRefreshChannels?.(agent.id);
+    }
+    if (tab === 'agent_settings') {
+      onRefreshAgentSettings?.(agent.id);
+      onRefreshCollaborators?.(agent.id);
+    }
+  };
+  return /*#__PURE__*/_jsx(Modal, {
+    animationType: "slide",
+    presentationStyle: "pageSheet",
+    visible: isVisible,
+    onRequestClose: onClose,
+    children: /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.modalRoot,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.modalTopBar,
+        children: [/*#__PURE__*/_jsx(Pressable, {
+          accessibilityLabel: "Close settings",
+          accessibilityRole: "button",
+          onPress: onClose,
+          style: ({
+            pressed
+          }) => [editorShellStyles.closeButton, pressed && styles.pressed],
+          children: /*#__PURE__*/_jsx(X, {
+            color: "#F4F4F5",
+            size: 22,
+            strokeWidth: 2.5
+          })
+        }), /*#__PURE__*/_jsx(View, {
+          style: editorShellStyles.modalTitleWrap,
+          children: /*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.modalTitle,
+            children: "Settings"
+          })
+        }), /*#__PURE__*/_jsx(AgentSphereIcon, {
+          agent: agent,
+          size: "header"
+        })]
+      }), /*#__PURE__*/_jsxs(ScrollView, {
+        contentContainerStyle: editorShellStyles.modalScrollContent,
+        showsVerticalScrollIndicator: false,
+        stickyHeaderIndices: [0],
+        children: [/*#__PURE__*/_jsx(View, {
+          style: editorShellStyles.stickyTabsWrap,
+          children: /*#__PURE__*/_jsx(ScrollView, {
+            horizontal: true,
+            showsHorizontalScrollIndicator: false,
+            contentContainerStyle: editorShellStyles.tabsContent,
+            children: SETTING_TABS.map(tab => /*#__PURE__*/_jsx(Pressable, {
+              accessibilityRole: "button",
+              onPress: () => selectTab(tab.id),
+              style: ({
+                pressed
+              }) => [editorShellStyles.segmentButton, selectedTab === tab.id && editorShellStyles.segmentButtonActive, pressed && styles.pressed],
+              children: /*#__PURE__*/_jsx(Text, {
+                style: [editorShellStyles.segmentLabel, selectedTab === tab.id && editorShellStyles.segmentLabelActive],
+                children: tab.label
+              })
+            }, tab.id))
+          })
+        }), selectedTab === 'integrations' ? /*#__PURE__*/_jsx(ConnectorsPanel, {
+          agent: agent,
+          availableConnectors: availableConnectors,
+          connectedConnectors: connectedConnectors,
+          connectingConnectorId: connectingConnectorId,
+          isLoading: isLoadingConnectors,
+          onCancel: onCancelConnectorConnection,
+          onConnect: onConnectConnector,
+          onDisconnect: onDisconnectConnector,
+          onRemove: onRemoveConnector
+        }) : selectedTab === 'tasks' ? /*#__PURE__*/_jsx(TasksPanel, {
+          agent: agent,
+          automationCredits: automationCredits,
+          automations: automations,
+          isLoading: isLoadingAutomations,
+          onArchiveAutomation: onArchiveAutomation,
+          onDeleteAutomation: onDeleteAutomation,
+          onEditAutomation: onEditAutomation,
+          onRestoreAutomation: onRestoreAutomation,
+          onRunAutomationNow: onRunAutomationNow,
+          onToggleAutomation: onToggleAutomation
+        }) : selectedTab === 'files' ? /*#__PURE__*/_jsx(FilesPanel, {
+          agent: agent,
+          fileLoadError: fileLoadError,
+          fileLoadFailed: fileLoadFailed,
+          filePaths: filePaths,
+          isLoading: isLoadingFiles,
+          onOpenSandboxFile: onOpenSandboxFile,
+          onRefreshFiles: onRefreshFiles,
+          onSaveSandboxFile: onSaveSandboxFile,
+          onUploadSandboxFiles: onUploadSandboxFiles
+        }) : selectedTab === 'channels' ? /*#__PURE__*/_jsx(ChannelsPanel, {
+          agent: agent,
+          channelStatus: channelStatus,
+          connectingChannelId: connectingChannelId,
+          isLoading: isLoadingChannels,
+          onDisconnectIMessage: onDisconnectIMessage,
+          onDisconnectTelegram: onDisconnectTelegram,
+          onGenerateIMessageCode: onGenerateIMessageCode,
+          onGenerateLineCode: onGenerateLineCode,
+          onOpenIMessage: onOpenIMessage,
+          onOpenLine: onOpenLine,
+          onOpenTelegram: onOpenTelegram,
+          onOpenWhatsApp: onOpenWhatsApp,
+          onRefreshChannels: onRefreshChannels,
+          onSetupTelegram: onSetupTelegram,
+          onShareIMessageCode: onShareIMessageCode,
+          onShareLineCode: onShareLineCode
+        }) : selectedTab === 'agent_settings' ? /*#__PURE__*/_jsx(AgentSettingsPanel, {
+          agent: agent,
+          collaborators: collaborators,
+          connectedConnectors: connectedConnectors,
+          isLoading: isLoadingAgentSettings,
+          isLoadingCollaborators: isLoadingCollaborators,
+          onCloneAgent: onCloneAgent,
+          onDeleteAgent: onDeleteAgent,
+          onDeleteSecret: onDeleteSecret,
+          onRefreshAgentSettings: onRefreshAgentSettings,
+          onSaveSecret: onSaveSecret,
+          onShareAgentLink: onShareAgentLink,
+          onUpdateAgentModel: onUpdateAgentModel,
+          onUpdateToolPermissions: onUpdateToolPermissions,
+          secrets: secrets
+        }) : /*#__PURE__*/_jsx(PlaceholderSettingsPanel, {
+          tab: selectedTab
+        })]
+      })]
+    })
+  });
+}
+function TasksPanel({
+  agent,
+  automationCredits = {},
+  automations = [],
+  isLoading,
+  onArchiveAutomation,
+  onDeleteAutomation,
+  onEditAutomation,
+  onRestoreAutomation,
+  onRunAutomationNow,
+  onToggleAutomation
+}) {
+  const [viewTab, setViewTab] = useState('active');
+  const sortedAutomations = useMemo(() => [...automations].sort((a, b) => getAutomationTime(b) - getAutomationTime(a)), [automations]);
+  const activeAutomations = sortedAutomations.filter(automation => !automation.is_archived);
+  const archivedAutomations = sortedAutomations.filter(automation => automation.is_archived);
+  if (isLoading) {
+    return /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.loadingPanel,
+      children: [/*#__PURE__*/_jsx(ActivityIndicator, {
+        color: "#FF5A1F"
+      }), /*#__PURE__*/_jsx(Text, {
+        style: editorShellStyles.loadingText,
+        children: "Loading automations..."
+      })]
+    });
+  }
+  const displayAutomations = viewTab === 'archived' ? archivedAutomations : activeAutomations;
+  return /*#__PURE__*/_jsx(View, {
+    style: editorShellStyles.settingsStack,
+    children: /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.panel,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.panelHeader,
+        children: [/*#__PURE__*/_jsxs(View, {
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.panelTitle,
+            children: "Automations"
+          }), /*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.panelSubtitle,
+            children: "Scheduled tasks, triggers, history, and usage."
+          })]
+        }), /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.countBadge,
+          children: displayAutomations.length
+        })]
+      }), /*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.automationTabs,
+        children: [/*#__PURE__*/_jsx(Pressable, {
+          accessibilityRole: "button",
+          onPress: () => setViewTab('active'),
+          style: ({
+            pressed
+          }) => [editorShellStyles.automationTabButton, viewTab === 'active' && editorShellStyles.automationTabButtonActive, pressed && styles.pressed],
+          children: /*#__PURE__*/_jsxs(Text, {
+            style: [editorShellStyles.automationTabText, viewTab === 'active' && editorShellStyles.automationTabTextActive],
+            children: ["Active ", activeAutomations.length]
+          })
+        }), /*#__PURE__*/_jsx(Pressable, {
+          accessibilityRole: "button",
+          onPress: () => setViewTab('archived'),
+          style: ({
+            pressed
+          }) => [editorShellStyles.automationTabButton, viewTab === 'archived' && editorShellStyles.automationTabButtonActive, pressed && styles.pressed],
+          children: /*#__PURE__*/_jsxs(Text, {
+            style: [editorShellStyles.automationTabText, viewTab === 'archived' && editorShellStyles.automationTabTextActive],
+            children: ["Archived ", archivedAutomations.length]
+          })
+        })]
+      }), displayAutomations.length > 0 ? /*#__PURE__*/_jsx(View, {
+        style: editorShellStyles.automationList,
+        children: displayAutomations.map(automation => /*#__PURE__*/_jsx(AutomationCard, {
+          agentId: agent.id,
+          automation: automation,
+          credits: automationCredits[automation.id],
+          onArchiveAutomation: onArchiveAutomation,
+          onDeleteAutomation: onDeleteAutomation,
+          onEditAutomation: onEditAutomation,
+          onRestoreAutomation: onRestoreAutomation,
+          onRunAutomationNow: onRunAutomationNow,
+          onToggleAutomation: onToggleAutomation
+        }, automation.id))
+      }) : /*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.emptyPanel,
+        children: [viewTab === 'archived' ? /*#__PURE__*/_jsx(Archive, {
+          color: "#8E8E93",
+          size: 22,
+          strokeWidth: 2.2
+        }) : /*#__PURE__*/_jsx(Timer, {
+          color: "#8E8E93",
+          size: 22,
+          strokeWidth: 2.2
+        }), /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.emptyTitle,
+          children: viewTab === 'archived' ? 'No archived automations' : 'No automations yet'
+        }), /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.emptyBody,
+          children: viewTab === 'archived' ? 'Automations you archive will appear here.' : 'Ask Superagent to create a scheduled or connector task.'
+        })]
+      })]
+    })
+  });
+}
+function AutomationCard({
+  agentId,
+  automation,
+  credits,
+  onArchiveAutomation,
+  onDeleteAutomation,
+  onEditAutomation,
+  onRestoreAutomation,
+  onRunAutomationNow,
+  onToggleAutomation
+}) {
+  const [expanded, setExpanded] = useState(false);
+  const [pendingAction, setPendingAction] = useState(null);
+  const Icon = AUTOMATION_ICONS[automation.automation_type] ?? Timer;
+  const trigger = describeAutomationTrigger(automation);
+  const lastRun = formatDateTime(automation.last_run_at);
+  const isArchived = !!automation.is_archived;
+  const isActive = !isArchived && automation.is_active !== false;
+  const canRunNow = automation.automation_type === 'scheduled' && !isArchived && !!onRunAutomationNow;
+  const actionInput = {
+    agentId,
+    automation
+  };
+  const runAction = async (action, handler) => {
+    if (!handler || pendingAction) {
+      return;
+    }
+    setPendingAction(action);
+    try {
+      await handler(actionInput);
+    } finally {
+      setPendingAction(null);
+    }
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    style: editorShellStyles.automationCard,
+    children: [/*#__PURE__*/_jsx(View, {
+      style: editorShellStyles.automationIcon,
+      children: /*#__PURE__*/_jsx(Icon, {
+        color: "#F4F4F5",
+        size: 19,
+        strokeWidth: 2.35
+      })
+    }), /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.automationText,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.inlineTitleRow,
+        children: [/*#__PURE__*/_jsx(Text, {
+          numberOfLines: 1,
+          style: editorShellStyles.automationName,
+          children: automation.name
+        }), /*#__PURE__*/_jsx(AutomationStatusBadge, {
+          automation: automation
+        })]
+      }), trigger ? /*#__PURE__*/_jsx(Text, {
+        numberOfLines: 2,
+        style: editorShellStyles.automationTrigger,
+        children: trigger
+      }) : null, automation.description ? /*#__PURE__*/_jsx(Text, {
+        numberOfLines: 2,
+        style: editorShellStyles.automationDescription,
+        children: automation.description
+      }) : null, /*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.automationMetaRow,
+        children: [/*#__PURE__*/_jsx(Text, {
+          numberOfLines: 1,
+          style: editorShellStyles.automationMeta,
+          children: formatAutomationType(automation.automation_type)
+        }), automation.function_name ? /*#__PURE__*/_jsx(Text, {
+          numberOfLines: 1,
+          style: editorShellStyles.automationMeta,
+          children: automation.function_name
+        }) : null, /*#__PURE__*/_jsxs(View, {
+          style: editorShellStyles.automationCreditBadge,
+          children: [/*#__PURE__*/_jsx(Coins, {
+            color: "#A1A1AA",
+            size: 11,
+            strokeWidth: 2.4
+          }), /*#__PURE__*/_jsx(Text, {
+            numberOfLines: 1,
+            style: editorShellStyles.automationCreditText,
+            children: credits ? `${formatCredits(credits.total)} credits used` : 'Consumes credits'
+          })]
+        })]
+      }), /*#__PURE__*/_jsxs(Text, {
+        numberOfLines: 1,
+        style: editorShellStyles.automationRuns,
+        children: [formatRuns(automation), lastRun ? ` · Last run ${lastRun}` : '']
+      }), /*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.automationActionRow,
+        children: [/*#__PURE__*/_jsx(AutomationActionButton, {
+          icon: expanded ? X : ChevronDown,
+          label: expanded ? 'Close' : 'Details',
+          onPress: () => setExpanded(current => !current)
+        }), onEditAutomation ? /*#__PURE__*/_jsx(AutomationActionButton, {
+          icon: Edit3,
+          isLoading: pendingAction === 'edit',
+          label: "Edit",
+          onPress: () => runAction('edit', onEditAutomation)
+        }) : null, canRunNow ? /*#__PURE__*/_jsx(AutomationActionButton, {
+          icon: Play,
+          isLoading: pendingAction === 'run',
+          label: "Run",
+          onPress: () => runAction('run', onRunAutomationNow)
+        }) : null, !isArchived && onToggleAutomation ? /*#__PURE__*/_jsx(AutomationActionButton, {
+          icon: isActive ? ToggleRight : ToggleLeft,
+          isLoading: pendingAction === 'toggle',
+          label: isActive ? 'Pause' : 'Activate',
+          onPress: () => runAction('toggle', onToggleAutomation)
+        }) : null, !isArchived && onArchiveAutomation ? /*#__PURE__*/_jsx(AutomationActionButton, {
+          icon: Archive,
+          isLoading: pendingAction === 'archive',
+          label: "Archive",
+          onPress: () => runAction('archive', onArchiveAutomation)
+        }) : null, isArchived && onRestoreAutomation ? /*#__PURE__*/_jsx(AutomationActionButton, {
+          icon: RotateCcw,
+          isLoading: pendingAction === 'restore',
+          label: "Restore",
+          onPress: () => runAction('restore', onRestoreAutomation)
+        }) : null, onDeleteAutomation ? /*#__PURE__*/_jsx(AutomationActionButton, {
+          danger: true,
+          icon: Trash2,
+          isLoading: pendingAction === 'delete',
+          label: "Delete",
+          onPress: () => runAction('delete', onDeleteAutomation)
+        }) : null]
+      }), expanded ? /*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.automationDetailsPanel,
+        children: [trigger ? /*#__PURE__*/_jsx(AutomationDetailBlock, {
+          label: "Trigger",
+          value: trigger
+        }) : null, automation.description ? /*#__PURE__*/_jsx(AutomationDetailBlock, {
+          label: "Instructions",
+          value: automation.description
+        }) : null, automation.function_name ? /*#__PURE__*/_jsx(AutomationDetailBlock, {
+          label: "Task ID",
+          monospace: true,
+          value: automation.function_name
+        }) : null, automation.function_args && Object.keys(automation.function_args).length > 0 ? /*#__PURE__*/_jsx(AutomationDetailBlock, {
+          label: "Parameters",
+          monospace: true,
+          value: JSON.stringify(automation.function_args, null, 2)
+        }) : null, /*#__PURE__*/_jsxs(View, {
+          style: editorShellStyles.automationDetailStats,
+          children: [/*#__PURE__*/_jsxs(Text, {
+            style: editorShellStyles.automationDetailStatText,
+            children: [automation.total_runs ?? 0, " total"]
+          }), /*#__PURE__*/_jsxs(Text, {
+            style: editorShellStyles.automationDetailSuccess,
+            children: [automation.successful_runs ?? 0, " succeeded"]
+          }), /*#__PURE__*/_jsxs(Text, {
+            style: editorShellStyles.automationDetailFailure,
+            children: [automation.failed_runs ?? 0, " failed"]
+          })]
+        }), credits ? /*#__PURE__*/_jsxs(Text, {
+          style: editorShellStyles.automationDetailMuted,
+          children: ["Total credits: ", formatCredits(credits.total), credits.since ? ` · since ${formatDate(credits.since) ?? credits.since}` : '']
+        }) : null, lastRun ? /*#__PURE__*/_jsxs(Text, {
+          style: editorShellStyles.automationDetailMuted,
+          children: ["Last run: ", lastRun, automation.last_run_status ? ` · ${automation.last_run_status}` : '']
+        }) : null, automation.created_date ? /*#__PURE__*/_jsxs(Text, {
+          style: editorShellStyles.automationDetailMuted,
+          children: ["Created ", formatDate(automation.created_date) ?? automation.created_date]
+        }) : null]
+      }) : null]
+    })]
+  });
+}
+function AutomationActionButton({
+  danger,
+  icon: Icon,
+  isLoading,
+  label,
+  onPress
+}) {
+  return /*#__PURE__*/_jsxs(Pressable, {
+    accessibilityLabel: label,
+    accessibilityRole: "button",
+    disabled: isLoading,
+    onPress: onPress,
+    style: ({
+      pressed
+    }) => [editorShellStyles.automationActionButton, danger && editorShellStyles.automationActionButtonDanger, pressed && styles.pressed, isLoading && editorShellStyles.automationActionButtonDisabled],
+    children: [isLoading ? /*#__PURE__*/_jsx(ActivityIndicator, {
+      color: danger ? '#FCA5A5' : '#F4F4F5',
+      size: "small"
+    }) : /*#__PURE__*/_jsx(Icon, {
+      color: danger ? '#FCA5A5' : '#F4F4F5',
+      size: 13,
+      strokeWidth: 2.45
+    }), /*#__PURE__*/_jsx(Text, {
+      style: [editorShellStyles.automationActionText, danger && editorShellStyles.automationActionTextDanger],
+      children: label
+    })]
+  });
+}
+function AutomationDetailBlock({
+  label,
+  monospace,
+  value
+}) {
+  return /*#__PURE__*/_jsxs(View, {
+    style: editorShellStyles.automationDetailBlock,
+    children: [/*#__PURE__*/_jsx(Text, {
+      style: editorShellStyles.automationDetailLabel,
+      children: label
+    }), /*#__PURE__*/_jsx(Text, {
+      style: [editorShellStyles.automationDetailValue, monospace && editorShellStyles.automationDetailValueMono],
+      children: value
+    })]
+  });
+}
+function AutomationStatusBadge({
+  automation
+}) {
+  const isArchived = !!automation.is_archived;
+  const isActive = !isArchived && automation.is_active !== false;
+  const label = isArchived ? 'Archived' : isActive ? 'Active' : 'Paused';
+  return /*#__PURE__*/_jsx(View, {
+    style: [editorShellStyles.automationStatusBadge, isActive ? editorShellStyles.automationStatusActive : editorShellStyles.automationStatusInactive],
+    children: /*#__PURE__*/_jsx(Text, {
+      style: [editorShellStyles.automationStatusText, isActive ? editorShellStyles.automationStatusTextActive : editorShellStyles.automationStatusTextInactive],
+      children: label
+    })
+  });
+}
+function ConnectorsPanel({
+  agent,
+  availableConnectors,
+  connectedConnectors,
+  connectingConnectorId,
+  isLoading,
+  onCancel,
+  onConnect,
+  onDisconnect,
+  onRemove
+}) {
+  const [searchQuery, setSearchQuery] = useState('');
+  const connectedIds = useMemo(() => new Set((connectedConnectors ?? []).map(connector => connector.id)), [connectedConnectors]);
+  const available = useMemo(() => {
+    const normalizedQuery = searchQuery.trim().toLowerCase();
+    return (availableConnectors ?? SUPERAGENT_CONNECTOR_CATALOG).filter(connector => !connectedIds.has(connector.id)).filter(connector => {
+      if (!normalizedQuery) {
+        return true;
+      }
+      return [connector.id, connector.name, connector.subtitle, connector.category].filter(Boolean).join(' ').toLowerCase().includes(normalizedQuery);
+    });
+  }, [availableConnectors, connectedIds, searchQuery]);
+  if (isLoading) {
+    return /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.loadingPanel,
+      children: [/*#__PURE__*/_jsx(ActivityIndicator, {
+        color: "#FF5A1F"
+      }), /*#__PURE__*/_jsx(Text, {
+        style: editorShellStyles.loadingText,
+        children: "Loading connectors..."
+      })]
+    });
+  }
+  return /*#__PURE__*/_jsxs(View, {
+    style: editorShellStyles.settingsStack,
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.panel,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.panelHeader,
+        children: [/*#__PURE__*/_jsxs(View, {
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.panelTitle,
+            children: "Connected"
+          }), /*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.panelSubtitle,
+            children: "Tools this agent can already use."
+          })]
+        }), /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.countBadge,
+          children: connectedConnectors?.length ?? 0
+        })]
+      }), connectedConnectors && connectedConnectors.length > 0 ? /*#__PURE__*/_jsx(View, {
+        style: editorShellStyles.connectorList,
+        children: connectedConnectors.map(connector => /*#__PURE__*/_jsx(ConnectedConnectorCard, {
+          agentId: agent.id,
+          connector: connector,
+          isConnecting: connectingConnectorId === connector.id,
+          onCancel: onCancel,
+          onConnect: onConnect,
+          onDisconnect: onDisconnect,
+          onRemove: onRemove
+        }, connector.id))
+      }) : /*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.emptyPanel,
+        children: [/*#__PURE__*/_jsx(Plug, {
+          color: "#8E8E93",
+          size: 22,
+          strokeWidth: 2.2
+        }), /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.emptyTitle,
+          children: "No connectors yet"
+        }), /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.emptyBody,
+          children: "Connect a service below to let this agent use it from chat."
+        })]
+      })]
+    }), /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.panel,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.panelHeader,
+        children: [/*#__PURE__*/_jsxs(View, {
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.panelTitle,
+            children: "Available connectors"
+          }), /*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.panelSubtitle,
+            children: "Browse the same tools from the web editor."
+          })]
+        }), /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.countBadge,
+          children: available.length
+        })]
+      }), /*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.connectorSearchWrap,
+        children: [/*#__PURE__*/_jsx(Search, {
+          color: "#A1A1AA",
+          size: 16,
+          strokeWidth: 2.4
+        }), /*#__PURE__*/_jsx(TextInput, {
+          autoCapitalize: "none",
+          autoCorrect: false,
+          clearButtonMode: "while-editing",
+          onChangeText: setSearchQuery,
+          placeholder: "Search connectors",
+          placeholderTextColor: "#8E8E93",
+          returnKeyType: "search",
+          style: editorShellStyles.connectorSearchInput,
+          value: searchQuery
+        })]
+      }), /*#__PURE__*/_jsx(View, {
+        style: editorShellStyles.connectorList,
+        children: available.length > 0 ? available.map(connector => /*#__PURE__*/_jsx(AvailableConnectorCard, {
+          agentId: agent.id,
+          connector: connector,
+          isConnecting: connectingConnectorId === connector.id,
+          onCancel: onCancel,
+          onConnect: onConnect
+        }, connector.id)) : /*#__PURE__*/_jsxs(View, {
+          style: editorShellStyles.emptyPanel,
+          children: [/*#__PURE__*/_jsx(Search, {
+            color: "#8E8E93",
+            size: 22,
+            strokeWidth: 2.2
+          }), /*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.emptyTitle,
+            children: "No matching connectors"
+          }), /*#__PURE__*/_jsx(Text, {
+            style: editorShellStyles.emptyBody,
+            children: "Try a different connector name or category."
+          })]
+        })
+      })]
+    })]
+  });
+}
+function ConnectedConnectorCard({
+  agentId,
+  connector,
+  isConnecting,
+  onCancel,
+  onConnect,
+  onDisconnect,
+  onRemove
+}) {
+  const status = connector.status ?? 'active';
+  const [menuOpen, setMenuOpen] = useState(false);
+  const hasAccessModes = !!connector.accessModes;
+  const currentMode = connector.accessMode ?? null;
+  const oppositeMode = currentMode === 'read_only' ? 'full_access' : 'read_only';
+  return /*#__PURE__*/_jsxs(View, {
+    style: [editorShellStyles.connectorCard, menuOpen && editorShellStyles.connectorCardMenuOpen],
+    children: [/*#__PURE__*/_jsx(ConnectorIcon, {
+      connector: connector
+    }), /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.connectorText,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.inlineTitleRow,
+        children: [/*#__PURE__*/_jsx(Text, {
+          numberOfLines: 1,
+          style: editorShellStyles.connectorName,
+          children: connector.name
+        }), /*#__PURE__*/_jsx(StatusBadge, {
+          status: status
+        }), currentMode ? /*#__PURE__*/_jsx(AccessModeBadge, {
+          mode: currentMode
+        }) : null]
+      }), /*#__PURE__*/_jsx(Text, {
+        numberOfLines: 1,
+        style: editorShellStyles.connectorSubtitle,
+        children: connector.accountIdentifier || connector.subtitle || 'Connected account'
+      })]
+    }), isConnecting ? /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.connectingWrap,
+      children: [/*#__PURE__*/_jsx(ActivityIndicator, {
+        color: "#8B5CF6",
+        size: "small"
+      }), /*#__PURE__*/_jsx(Pressable, {
+        accessibilityLabel: `Cancel ${connector.name} connection`,
+        accessibilityRole: "button",
+        onPress: () => onCancel?.({
+          agentId,
+          connectorId: connector.id
+        }),
+        style: ({
+          pressed
+        }) => [editorShellStyles.cancelConnectButton, pressed && styles.pressed],
+        children: /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.cancelConnectText,
+          children: "Cancel"
+        })
+      })]
+    }) : /*#__PURE__*/_jsx(View, {
+      style: editorShellStyles.connectorActions,
+      children: /*#__PURE__*/_jsx(Pressable, {
+        accessibilityLabel: `${connector.name} actions`,
+        accessibilityRole: "button",
+        onPress: () => setMenuOpen(open => !open),
+        style: ({
+          pressed
+        }) => [editorShellStyles.moreButton, pressed && styles.pressed],
+        children: /*#__PURE__*/_jsx(MoreHorizontal, {
+          color: "#E4E4E7",
+          size: 19,
+          strokeWidth: 2.4
+        })
+      })
+    }), menuOpen ? /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.connectorMenu,
+      children: [hasAccessModes && onConnect ? /*#__PURE__*/_jsx(MenuAction, {
+        label: oppositeMode === 'read_only' ? 'Switch to read only' : 'Switch to full access',
+        onPress: () => {
+          setMenuOpen(false);
+          onConnect({
+            accessMode: oppositeMode,
+            agentId,
+            connectorId: connector.id,
+            forceReconnect: true,
+            scopes: getConnectorScopesForMode(connector, oppositeMode)
+          });
+        }
+      }) : null, /*#__PURE__*/_jsx(MenuAction, {
+        label: status === 'active' ? 'Switch account' : 'Reconnect',
+        onPress: () => {
+          setMenuOpen(false);
+          onConnect?.({
+            accessMode: connector.accessMode ?? undefined,
+            agentId,
+            connectorId: connector.id,
+            forceReconnect: true,
+            scopes: connector.scopes?.length ? connector.scopes : getConnectorScopesForMode(connector, connector.accessMode ?? 'full_access')
+          });
+        }
+      }), status !== 'disconnected' ? /*#__PURE__*/_jsx(MenuAction, {
+        destructive: true,
+        label: "Disconnect",
+        onPress: () => {
+          setMenuOpen(false);
+          onDisconnect?.({
+            agentId,
+            connectorId: connector.id
+          });
+        }
+      }) : null, /*#__PURE__*/_jsx(MenuAction, {
+        destructive: true,
+        label: "Remove",
+        onPress: () => {
+          setMenuOpen(false);
+          onRemove?.({
+            agentId,
+            connectorId: connector.id
+          });
+        }
+      })]
+    }) : null]
+  });
+}
+function MenuAction({
+  destructive,
+  label,
+  onPress
+}) {
+  return /*#__PURE__*/_jsx(Pressable, {
+    accessibilityRole: "button",
+    onPress: onPress,
+    style: ({
+      pressed
+    }) => [editorShellStyles.menuAction, pressed && styles.pressed],
+    children: /*#__PURE__*/_jsx(Text, {
+      style: [editorShellStyles.menuActionText, destructive && editorShellStyles.menuActionTextDestructive],
+      children: label
+    })
+  });
+}
+function AvailableConnectorCard({
+  agentId,
+  connector,
+  isConnecting,
+  onCancel,
+  onConnect
+}) {
+  const [accessMode, setAccessMode] = useState(connector.accessMode ?? 'full_access');
+  const hasAccessModes = !!connector.accessModes || connector.supportsReadOnly;
+  return /*#__PURE__*/_jsxs(View, {
+    style: editorShellStyles.connectorCard,
+    children: [/*#__PURE__*/_jsx(ConnectorIcon, {
+      connector: connector
+    }), /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.connectorText,
+      children: [/*#__PURE__*/_jsx(Text, {
+        numberOfLines: 1,
+        style: editorShellStyles.connectorName,
+        children: connector.name
+      }), /*#__PURE__*/_jsx(Text, {
+        numberOfLines: 1,
+        style: editorShellStyles.connectorSubtitle,
+        children: connector.subtitle
+      })]
+    }), isConnecting ? /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.connectingWrap,
+      children: [/*#__PURE__*/_jsx(ActivityIndicator, {
+        color: "#8B5CF6",
+        size: "small"
+      }), /*#__PURE__*/_jsx(Pressable, {
+        accessibilityLabel: `Cancel ${connector.name} connection`,
+        accessibilityRole: "button",
+        onPress: () => onCancel?.({
+          agentId,
+          connectorId: connector.id
+        }),
+        style: ({
+          pressed
+        }) => [editorShellStyles.cancelConnectButton, pressed && styles.pressed],
+        children: /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.cancelConnectText,
+          children: "Cancel"
+        })
+      })]
+    }) : /*#__PURE__*/_jsxs(View, {
+      style: editorShellStyles.availableActions,
+      children: [/*#__PURE__*/_jsx(Pressable, {
+        accessibilityLabel: `Connect ${connector.name}`,
+        accessibilityRole: "button",
+        disabled: !onConnect,
+        onPress: () => onConnect?.({
+          accessMode,
+          agentId,
+          connectorId: connector.id,
+          scopes: getConnectorScopesForMode(connector, accessMode)
+        }),
+        style: ({
+          pressed
+        }) => [editorShellStyles.webConnectButton, !onConnect && editorShellStyles.disabledAction, pressed && styles.pressed],
+        children: /*#__PURE__*/_jsx(Text, {
+          style: editorShellStyles.webConnectText,
+          children: "Connect"
+        })
+      }), hasAccessModes ? /*#__PURE__*/_jsxs(View, {
+        style: editorShellStyles.accessToggle,
+        children: [/*#__PURE__*/_jsx(AccessButton, {
+          active: accessMode === 'read_only',
+          label: "Read",
+          onPress: () => setAccessMode('read_only')
+        }), /*#__PURE__*/_jsx(AccessButton, {
+          active: accessMode === 'full_access',
+          label: "Full",
+          onPress: () => setAccessMode('full_access')
+        })]
+      }) : null]
+    })]
+  });
+}
+function AccessModeBadge({
+  mode
+}) {
+  const isReadOnly = mode === 'read_only';
+  return /*#__PURE__*/_jsx(View, {
+    style: [editorShellStyles.accessBadge, isReadOnly ? editorShellStyles.accessBadgeReadOnly : editorShellStyles.accessBadgeFull],
+    children: /*#__PURE__*/_jsx(Text, {
+      style: [editorShellStyles.accessBadgeText, isReadOnly ? editorShellStyles.accessBadgeTextReadOnly : editorShellStyles.accessBadgeTextFull],
+      children: isReadOnly ? 'Read only' : 'Full access'
+    })
+  });
+}
+function getConnectorScopesForMode(connector, mode) {
+  if (connector.accessModes) {
+    return mode === 'read_only' ? connector.accessModes.readOnly : connector.accessModes.fullAccess;
+  }
+  return connector.exampleScopes ?? connector.scopes;
+}
+function AccessButton({
+  active,
+  label,
+  onPress
+}) {
+  return /*#__PURE__*/_jsx(Pressable, {
+    accessibilityRole: "button",
+    onPress: onPress,
+    style: [editorShellStyles.accessButton, active && editorShellStyles.accessButtonActive],
+    children: /*#__PURE__*/_jsx(Text, {
+      style: [editorShellStyles.accessButtonText, active && editorShellStyles.accessButtonTextActive],
+      children: label
+    })
+  });
+}
+const DAY_NAMES = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
+function describeAutomationTrigger(automation) {
+  if (automation.automation_type === 'scheduled') {
+    return describeSchedule(automation);
+  }
+  if (automation.automation_type === 'entity') {
+    const events = automation.event_types?.length ? automation.event_types.join(', ') : 'changes';
+    return automation.entity_name ? `${automation.entity_name} · ${events}` : events;
+  }
+  if (automation.automation_type === 'connector') {
+    const connectorName = getConnectorDisplayName(automation.integration_type);
+    const events = automation.events?.length ? automation.events.join(', ') : '';
+    return events ? `${connectorName} · ${events}` : connectorName;
+  }
+  return null;
+}
+function describeSchedule(automation) {
+  if (automation.schedule_mode === 'one-time' && automation.one_time_date) {
+    return `One-time · ${formatDateTime(automation.one_time_date) ?? automation.one_time_date}`;
+  }
+  if (automation.schedule_type === 'cron' && automation.cron_expression) {
+    return `Cron · ${automation.cron_expression}`;
+  }
+  const parts = [];
+  if (automation.repeat_interval && automation.repeat_unit) {
+    const unit = automation.repeat_interval === 1 ? automation.repeat_unit.replace(/s$/, '') : automation.repeat_unit;
+    parts.push(`Every ${automation.repeat_interval === 1 ? '' : `${automation.repeat_interval} `}${unit}`.trim());
+  }
+  if (automation.repeat_unit === 'weeks' && automation.repeat_on_days?.length) {
+    parts.push(`on ${automation.repeat_on_days.map(day => DAY_NAMES[day]).filter(Boolean).join(', ')}`);
+  }
+  if (automation.repeat_unit === 'months' && automation.repeat_on_day_of_month) {
+    parts.push(`on day ${automation.repeat_on_day_of_month}`);
+  }
+  if (automation.start_time) {
+    parts.push(`at ${automation.start_time}`);
+  }
+  if (automation.ends_type === 'on' && automation.ends_on_date) {
+    parts.push(`until ${formatDate(automation.ends_on_date) ?? automation.ends_on_date}`);
+  } else if (automation.ends_type === 'after' && automation.ends_after_count) {
+    parts.push(`for ${automation.ends_after_count} runs`);
+  }
+  return parts.length > 0 ? parts.join(' ') : null;
+}
+function formatAutomationType(type) {
+  if (type === 'scheduled') {
+    return 'Scheduled';
+  }
+  if (type === 'entity') {
+    return 'Entity trigger';
+  }
+  if (type === 'connector') {
+    return 'Connector trigger';
+  }
+  return String(type);
+}
+function formatRuns(automation) {
+  const total = automation.total_runs ?? 0;
+  const successful = automation.successful_runs ?? 0;
+  const failed = automation.failed_runs ?? 0;
+  return `${total} runs · ${successful} succeeded · ${failed} failed`;
+}
+function formatCredits(value) {
+  return Number.isInteger(value) ? String(value) : value.toFixed(1).replace(/\.0$/, '');
+}
+function getAutomationTime(automation) {
+  const dateValue = automation.updated_date ?? automation.created_date ?? automation.last_run_at;
+  if (!dateValue) {
+    return 0;
+  }
+  const timestamp = Date.parse(dateValue);
+  return Number.isNaN(timestamp) ? 0 : timestamp;
+}
+function getConnectorDisplayName(connectorId) {
+  if (!connectorId) {
+    return 'Connector';
+  }
+  return SUPERAGENT_CONNECTOR_CATALOG.find(connector => connector.id === connectorId)?.name ?? connectorId.split(/[_-]/).filter(Boolean).map(part => part.charAt(0).toUpperCase() + part.slice(1)).join(' ');
+}
+function formatDate(value) {
+  if (!value) {
+    return null;
+  }
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) {
+    return value;
+  }
+  return date.toLocaleDateString();
+}
+function formatDateTime(value) {
+  if (!value) {
+    return null;
+  }
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) {
+    return value;
+  }
+  return date.toLocaleString();
+}
+function ConnectorIcon({
+  connector
+}) {
+  const Icon = CONNECTOR_ICONS[connector.id] ?? Plug;
+  const iconBackgroundColor = connector.iconBackgroundColor ?? '#FFFFFF';
+  const hasBrandIcon = hasConnectorBrandIcon(connector.id);
+  return /*#__PURE__*/_jsx(View, {
+    style: [editorShellStyles.connectorIcon, {
+      backgroundColor: iconBackgroundColor
+    }],
+    children: hasBrandIcon ? /*#__PURE__*/_jsx(ConnectorBrandIcon, {
+      connectorId: connector.id,
+      size: 22
+    }) : /*#__PURE__*/_jsx(Icon, {
+      color: "#111827",
+      size: 20,
+      strokeWidth: 2.35
+    })
+  });
+}
+function StatusBadge({
+  status
+}) {
+  const isActive = status === 'active' || !status;
+  const isDisconnected = status === 'disconnected';
+  const Icon = isActive ? Check : isDisconnected ? Unplug : AlertCircle;
+  return /*#__PURE__*/_jsxs(View, {
+    style: [editorShellStyles.statusBadge, isActive ? editorShellStyles.statusBadgeActive : isDisconnected ? editorShellStyles.statusBadgeDisconnected : editorShellStyles.statusBadgeWarning],
+    children: [/*#__PURE__*/_jsx(Icon, {
+      color: isActive ? '#34D399' : isDisconnected ? '#A1A1AA' : '#FCA5A5',
+      size: 11,
+      strokeWidth: 2.7
+    }), /*#__PURE__*/_jsx(Text, {
+      style: [editorShellStyles.statusBadgeText, isActive ? editorShellStyles.statusBadgeTextActive : isDisconnected ? editorShellStyles.statusBadgeTextDisconnected : editorShellStyles.statusBadgeTextWarning],
+      children: isActive ? 'Active' : status
+    })]
+  });
+}
+function PlaceholderSettingsPanel({
+  tab
+}) {
+  const label = getEditorTabLabel(tab);
+  const iconMap = {
+    files: FileText,
+    tasks: Settings
+  };
+  const Icon = iconMap[tab] ?? Settings;
+  return /*#__PURE__*/_jsxs(View, {
+    style: editorShellStyles.placeholderPanel,
+    children: [/*#__PURE__*/_jsx(View, {
+      style: editorShellStyles.placeholderIcon,
+      children: /*#__PURE__*/_jsx(Icon, {
+        color: "#FF5A1F",
+        size: 24,
+        strokeWidth: 2.3
+      })
+    }), /*#__PURE__*/_jsx(Text, {
+      style: editorShellStyles.placeholderTitle,
+      children: label
+    }), /*#__PURE__*/_jsx(Text, {
+      style: editorShellStyles.placeholderBody,
+      children: "This section now lives in the settings modal. The next slice can replace this placeholder with the matching native controls."
+    })]
+  });
+}
+//# sourceMappingURL=EditorDrawer.js.map