[feat] Call tools "integrations" in the mobile app

web/mobile/src/features/agents/AgentOverviewScreen.tsx

@@ -11,6 +11,7 @@ import {useAtomValue, useSetAtom} from "jotai"
 import {PageTitle} from "@/components/PageTitle"
 import {ScreenScaffold} from "@/components/ScreenScaffold"
 import {Skeleton} from "@/components/ui/skeleton"
+import {AGENT_CONFIG_INTEGRATIONS_COPY} from "@/lib/integrationsCopy"
 
 import {useStartBlankSession} from "../chat/useStartBlankSession"
 import {useBindProjectContext} from "../context/useBindProjectContext"
@@ -137,6 +138,8 @@ export const AgentOverviewScreen = ({
                             }
                             agentId={agentId}
                             agentNames={agentNames}
+                            // This app says "Integrations" where oss/ee still say "Tools".
+                            configCopy={AGENT_CONFIG_INTEGRATIONS_COPY}
                             usage={<UsageCard appId={agentId} />}
                             sessionsHref={`${base}/sessions`}
                             automationSessionsHref={`${base}/sessions?mode=${sessionRouteModes.automation}`}

web/mobile/src/features/settings/SettingsScreen.tsx

@@ -11,13 +11,7 @@ import {
 } from "@agenta/entities/organization"
 import {useProfile} from "@agenta/entities/profile"
 import {fetchAllProjects} from "@agenta/entities/project"
-import {
-    getSettingsTabDescription,
-    getSettingsTabDocs,
-    getSettingsTabLabel,
-    getSettingsTabVariant,
-    type SettingsTabKey,
-} from "@agenta/settings"
+import {getSettingsTabVariant, type SettingsTabKey} from "@agenta/settings"
 import {useApiKeys, type SettingsAccess} from "@agenta/settings"
 import {
     AccessControlsSection,
@@ -40,6 +34,12 @@ import {useRouter} from "next/router"
 import {ContentRail} from "@/components/ContentRail"
 import {PageTitle} from "@/components/PageTitle"
 import {ScreenScaffold} from "@/components/ScreenScaffold"
+import {
+    getMobileSettingsTabDescription,
+    getMobileSettingsTabDocs,
+    getMobileSettingsTabLabel,
+    INTEGRATIONS_SECTION_COPY,
+} from "@/lib/integrationsCopy"
 
 import {useBindProjectContext} from "../context/useBindProjectContext"
 import {AppShell} from "../nav/AppShell"
@@ -213,7 +213,7 @@ const TabBody = ({
             if (!access.canShowTools) return null
             return (
                 <>
-                    <GatewayToolsSection confirm={confirm} />
+                    <GatewayToolsSection confirm={confirm} copy={INTEGRATIONS_SECTION_COPY} />
                     {confirmModal}
                 </>
             )
@@ -355,9 +355,9 @@ export const SettingsScreen = ({
                 desktop widths this app now serves. */}
             <SettingsPageShell
                 variant={getSettingsTabVariant(active)}
-                title={getSettingsTabLabel(active, access)}
-                description={getSettingsTabDescription(active, access)}
-                docs={getSettingsTabDocs(active)}
+                title={getMobileSettingsTabLabel(active, access)}
+                description={getMobileSettingsTabDescription(active, access)}
+                docs={getMobileSettingsTabDocs(active)}
             >
                 <TabBody
                     tab={active}

web/mobile/src/features/settings/SettingsTabRail.tsx

@@ -2,6 +2,7 @@ import {useMemo} from "react"
 
 import {getSettingsSidebarTabs, SETTINGS_SCOPES, type SettingsTabKey} from "@agenta/settings"
 
+import {withMobileSettingsLabels} from "@/lib/integrationsCopy"
 import {cn} from "@/lib/utils"
 
 import {AVAILABLE_SETTINGS_TABS, useMobileSettingsAccess} from "./settingsTabs"
@@ -21,8 +22,10 @@ export const SettingsTabRail = ({
     const access = useMobileSettingsAccess()
 
     const groups = useMemo(() => {
-        const tabs = getSettingsSidebarTabs(access).filter(
-            (tab) => AVAILABLE_SETTINGS_TABS.includes(tab.key) && !tab.isHidden,
+        const tabs = withMobileSettingsLabels(
+            getSettingsSidebarTabs(access).filter(
+                (tab) => AVAILABLE_SETTINGS_TABS.includes(tab.key) && !tab.isHidden,
+            ),
         )
         return SETTINGS_SCOPES.map((scope) => ({
             ...scope,

web/mobile/src/features/settings/settingsNavScope.tsx

@@ -16,6 +16,8 @@ import {
 import {useAtomValue} from "jotai"
 import {useRouter} from "next/router"
 
+import {withMobileSettingsLabels} from "@/lib/integrationsCopy"
+
 import {DrawerProjectSwitcher} from "../nav/DrawerProjectSwitcher"
 import {lastNonSettingsPathAtom} from "../nav/lastNonSettingsPath"
 import {useMobileBottomNavItems} from "../nav/useMobileNavItems"
@@ -61,8 +63,10 @@ const createSettingsNavScope = (workspaceId: string, projectId: string): Sidebar
         return useMemo(
             () => [
                 ...buildSettingsSidebarSections(
-                    getSettingsSidebarTabs(access).filter((tab) =>
-                        AVAILABLE_SETTINGS_TABS.includes(tab.key),
+                    withMobileSettingsLabels(
+                        getSettingsSidebarTabs(access).filter((tab) =>
+                            AVAILABLE_SETTINGS_TABS.includes(tab.key),
+                        ),
                     ),
                     // A real href per tab: the drawer closes on link clicks, and the controlled
                     // selection intercepts the navigation before it happens.

web/mobile/src/lib/integrationsCopy.ts

@@ -0,0 +1,57 @@
+import {
+    getSettingsTabDescription,
+    getSettingsTabDocs,
+    getSettingsTabLabel,
+    type SettingsAccess,
+    type SettingsTabDocs,
+    type SettingsTabKey,
+} from "@agenta/settings"
+
+/** This app says "Integrations" where the shared copy says "Tools", which oss/ee still use. */
+const TAB_LABELS: Partial<Record<SettingsTabKey, string>> = {
+    tools: "Integrations",
+}
+
+const TAB_DESCRIPTIONS: Partial<Record<SettingsTabKey, string>> = {
+    tools: "Connect the integrations your agents can use.",
+}
+
+const TAB_DOCS_LABELS: Partial<Record<SettingsTabKey, string>> = {
+    tools: "About integrations",
+}
+
+export const getMobileSettingsTabLabel = (key: SettingsTabKey, access: SettingsAccess) =>
+    TAB_LABELS[key] ?? getSettingsTabLabel(key, access)
+
+export const getMobileSettingsTabDescription = (key: SettingsTabKey, access: SettingsAccess) =>
+    TAB_DESCRIPTIONS[key] ?? getSettingsTabDescription(key, access)
+
+export const getMobileSettingsTabDocs = (key: SettingsTabKey): SettingsTabDocs | undefined => {
+    const docs = getSettingsTabDocs(key)
+    const label = TAB_DOCS_LABELS[key]
+    return docs && label ? {...docs, label} : docs
+}
+
+/** Relabels sidebar/rail entries in place, so both nav surfaces read the same as the page. */
+export const withMobileSettingsLabels = <T extends {key: SettingsTabKey; title: string}>(
+    tabs: T[],
+): T[] => tabs.map((tab) => (TAB_LABELS[tab.key] ? {...tab, title: TAB_LABELS[tab.key]!} : tab))
+
+/** Copy for the shared `GatewayToolsSection`, whose defaults still say "tool" for oss/ee. */
+export const INTEGRATIONS_SECTION_COPY = {
+    integrationColumn: "Integration",
+    run: "Run action",
+    searchPlaceholder: "Search integrations",
+    connect: "Connect integration",
+    emptyTitle: "No integrations connected yet",
+    emptyBody: "Connect an integration to let your agents call it.",
+    noMatch: (term: string) => `No integrations match “${term}”`,
+} as const
+
+/** Copy for the agent overview's config card, whose tools row says "Tools" for oss/ee. */
+export const AGENT_CONFIG_INTEGRATIONS_COPY = {
+    toolsTitle: "Integrations",
+    toolsCount: (count: number) => `${count} enabled`,
+    toolsAdd: "Add integrations",
+    toolsNone: "None enabled",
+} as const

web/packages/agenta-entity-ui/src/agent/AgentConfigSummaryCard.tsx

@@ -41,15 +41,40 @@ const emptyAction = (label: string) => ({summary: label, status: "default" as co
 // required-but-empty warning keeps a color.
 const stated = (summary: string) => ({summary, status: "default" as const})
 
+/** The tools row's noun; a host that calls it something else passes its own. */
+export interface AgentConfigSummaryCopy {
+    toolsTitle: string
+    toolsCount: (count: number) => string
+    toolsAdd: string
+    toolsNone: string
+}
+
+const DEFAULT_COPY: AgentConfigSummaryCopy = {
+    toolsTitle: "Tools",
+    toolsCount: (count) => `${count} enabled`,
+    toolsAdd: "Add tools",
+    toolsNone: "None enabled",
+}
+
 export interface AgentConfigSummaryCardProps {
     appId: string
     /** Opens the editing surface (the playground on desktop). Absent = read-only host (mobile):
      * the Edit action and the row-level "opens elsewhere" affordances are hidden. */
     onEdit?: () => void
+    /** Overrides the tools row's wording; defaults to the "tool" noun oss/ee use. */
+    copy?: Partial<AgentConfigSummaryCopy>
 }
 
 /** What this agent IS, in one read-only card, built on the playground panel's own row primitives. */
-export const AgentConfigSummaryCard = ({appId, onEdit}: AgentConfigSummaryCardProps) => {
+export const AgentConfigSummaryCard = ({
+    appId,
+    onEdit,
+    copy: copyOverrides,
+}: AgentConfigSummaryCardProps) => {
+    const copy = useMemo<AgentConfigSummaryCopy>(
+        () => ({...DEFAULT_COPY, ...copyOverrides}),
+        [copyOverrides],
+    )
     // Configuration lives on a revision, not on the artifact — reading the artifact gave a
     // workflow with no parameters, so every row said "Not set".
     const revisionAtom = useMemo(() => agentLatestRevisionAtomFamily(appId), [appId])
@@ -91,10 +116,10 @@ export const AgentConfigSummaryCard = ({appId, onEdit}: AgentConfigSummaryCardPr
         {
             key: "tools",
             icon: <WrenchIcon size={16} />,
-            title: "Tools",
+            title: copy.toolsTitle,
             ...(summary.tools
-                ? stated(`${summary.tools} enabled`)
-                : emptyAction(onEdit ? "Add tools" : "None enabled")),
+                ? stated(copy.toolsCount(summary.tools))
+                : emptyAction(onEdit ? copy.toolsAdd : copy.toolsNone)),
         },
         {
             key: "mcps",

web/packages/agenta-entity-ui/src/agent/AgentOverviewBody.tsx

@@ -3,7 +3,7 @@ import type {ReactNode} from "react"
 import {SessionListCard, type SessionListCardProps} from "@agenta/sessions-ui"
 import {PanelSurface} from "@agenta/ui/components/presentational"
 
-import {AgentConfigSummaryCard} from "./AgentConfigSummaryCard"
+import {AgentConfigSummaryCard, type AgentConfigSummaryCopy} from "./AgentConfigSummaryCard"
 import {AgentFilesCard} from "./AgentFilesCard"
 import {AgentOverviewLayout} from "./AgentOverviewLayout"
 import {NextTriggersSection} from "./NextTriggersSection"
@@ -34,6 +34,8 @@ export interface AgentOverviewBodyProps {
     alwaysShowPin?: boolean
     /** Display names for the triggers section's bound-agent labels. */
     agentNames?: Map<string, string>
+    /** Overrides the config card's tools-row wording, for a host that names the concept its way. */
+    configCopy?: Partial<AgentConfigSummaryCopy>
 }
 
 /**
@@ -56,6 +58,7 @@ export const AgentOverviewBody = ({
     onRenameRow,
     alwaysShowPin,
     agentNames,
+    configCopy,
 }: AgentOverviewBodyProps) => (
     <AgentOverviewLayout
         main={
@@ -99,7 +102,7 @@ export const AgentOverviewBody = ({
         }
         rail={
             <PanelSurface className="flex flex-col gap-3">
-                <AgentConfigSummaryCard appId={agentId} onEdit={onEditConfig} />
+                <AgentConfigSummaryCard appId={agentId} onEdit={onEditConfig} copy={configCopy} />
                 <AgentFilesCard appId={agentId} />
                 {/* Scoped to this agent. Automation RUNS say what already happened; an agent
                     whose schedule quietly stopped looks identical there. */}

web/packages/agenta-entity-ui/src/agent/index.ts

@@ -20,7 +20,11 @@ export {
     type AgentPickerTriggerVariant,
 } from "./AgentPicker"
 export {NextTriggersSection, type NextTriggersSectionProps} from "./NextTriggersSection"
-export {AgentConfigSummaryCard, type AgentConfigSummaryCardProps} from "./AgentConfigSummaryCard"
+export {
+    AgentConfigSummaryCard,
+    type AgentConfigSummaryCardProps,
+    type AgentConfigSummaryCopy,
+} from "./AgentConfigSummaryCard"
 export {agentConfigSummary, prettifyKind, type AgentConfigSummary} from "./agentConfigSummary"
 export {agentLatestRevisionAtomFamily} from "./state"
 export {AgentCardGrid, type AgentCardGridProps} from "./AgentCardGrid"

web/packages/agenta-settings-ui/src/index.ts

@@ -76,6 +76,7 @@ export {DomainsSection, type DomainsSectionProps} from "./access/DomainsSection"
 export {SsoProvidersSection, type SsoProvidersSectionProps} from "./access/SsoProvidersSection"
 export {
     default as GatewayToolsSection,
+    type GatewayToolsSectionCopy,
     type GatewayToolsSectionProps,
 } from "./tools/GatewayToolsSection"
 export {default as IntegrationGrid} from "./tools/IntegrationGrid"