@app-connect/core 1.7.36 → 1.7.38

package/mcp/tools/index.js

@@ -1,51 +0,0 @@
-/**
- * MCP Tools Index
- *
- * Two separate registries:
- *  - tools:       Registered in the MCP server — visible to and callable by the AI model
- *  - widgetTools: Only accessible via POST /mcp/widget-tool-call — hidden from the AI model
- */
-
-const getHelp = require('./getHelp');
-const getPublicConnectors = require('./getPublicConnectors');
-const getSessionInfo = require('./getSessionInfo');
-const doAuth = require('./doAuth');
-const checkAuthStatus = require('./checkAuthStatus');
-const logout = require('./logout');
-const findContact = require('./findContactByPhone');
-const findContactWithName = require('./findContactByName');
-const createCallLog = require('./createCallLog');
-const rcGetCallLogs = require('./rcGetCallLogs');
-// const getGoogleFilePicker = require('./getGoogleFilePicker');
-const createContact = require('./createContact');
-const createAppointment = require('./createAppointment');
-const updateAppointment = require('./updateAppointment');
-const confirmAppointment = require('./confirmAppointment');
-const cancelAppointment = require('./cancelAppointment');
-const listAppointments = require('./listAppointments');
-
-// AI-visible MCP tools — registered in the MCP server
-module.exports.tools = [
-    getHelp,
-    getPublicConnectors,
-    getSessionInfo,
-    logout,
-    findContact,
-    findContactWithName,
-    createCallLog,
-    rcGetCallLogs,
-    // getGoogleFilePicker,
-    createContact,
-    listAppointments,
-    createAppointment,
-    updateAppointment,
-    confirmAppointment,
-    cancelAppointment,
-];
-
-// Widget-only tools — callable via /mcp/widget-tool-call, NOT registered as MCP tools
-module.exports.widgetTools = [
-    doAuth,
-    checkAuthStatus,
-];
-

package/mcp/ui/App/App.tsx

@@ -1,358 +0,0 @@
-import { useState, useEffect, useCallback } from 'react'
-import { ConnectorList, type Connector } from './components/ConnectorList'
-import { AuthInfoForm } from './components/AuthInfoForm'
-import { OAuthConnect } from './components/OAuthConnect'
-import { AuthSuccess } from './components/AuthSuccess'
-import { setServerUrl } from './lib/callTool'
-import { fetchConnectors, fetchManifest } from './lib/developerPortal'
-import { dbg } from './lib/debugLog'
-
-// Initial structuredContent from getPublicConnectors — serverUrl, rcAccountId, rcExtensionId, openaiSessionId
-interface ToolOutput {
-  serverUrl?: string
-  rcAccountId?: string | null
-  rcExtensionId?: string | null
-  openaiSessionId?: string | null
-  error?: boolean
-  errorMessage?: string
-}
-
-type Step = 'loadingConnectors' | 'select' | 'loading' | 'authInfo' | 'oauth' | 'success' | 'error'
-
-interface FlowState {
-  connectorManifest: any | null
-  connectorName: string | null
-  connectorDisplayName: string | null
-  hostname: string
-  userInfo: any | null
-}
-
-const INITIAL_FLOW_STATE: FlowState = {
-  connectorManifest: null,
-  connectorName: null,
-  connectorDisplayName: null,
-  hostname: '',
-  userInfo: null,
-}
-
-/**
- * Extract and apply serverUrl from tool output as early as possible.
- * Must be called synchronously so it's set before any tool calls.
- */
-function applyServerUrl(output: ToolOutput | null) {
-  dbg.info('applyServerUrl: received output keys:', output ? Object.keys(output).join(', ') : 'null');
-  dbg.info('applyServerUrl: serverUrl =', output?.serverUrl ?? '(none)');
-  if (output?.serverUrl) {
-    setServerUrl(output.serverUrl);
-  }
-  return output;
-}
-
-/**
- * Hook to receive the initial tool output (serverUrl + rcAccountId).
- *
- * Listens via three mechanisms per the ChatGPT Apps SDK docs:
- *  1. window.openai.toolOutput — synchronous read on mount
- *  2. openai:set_globals event — ChatGPT pushes globals into the iframe
- *  3. ui/notifications/tool-result postMessage — MCP Apps bridge notification
- *  4. Polling window.openai.toolOutput — fallback for async population
- */
-function useToolResult() {
-  const [toolResult, setToolResult] = useState<ToolOutput | null>(() => {
-    const openai = (window as any).openai
-    dbg.info('init: window.openai exists?', !!openai);
-    dbg.info('init: window.openai.toolOutput?', JSON.stringify(openai?.toolOutput)?.slice(0, 200) ?? 'null');
-    const output = openai?.toolOutput
-    if (output && Object.keys(output).length > 0) {
-      return applyServerUrl(output)
-    }
-    return null
-  })
-
-  useEffect(() => {
-    if (toolResult) return
-
-    // MCP Apps bridge: tool-result notification
-    const onMessage = (event: MessageEvent) => {
-      if (event.source !== window.parent) return
-      const message = event.data
-      if (!message || message.jsonrpc !== '2.0') return
-      if (message.method !== 'ui/notifications/tool-result') return
-      const payload = message.params?.structuredContent ?? message.params ?? null
-      if (payload) setToolResult(applyServerUrl(payload))
-    }
-    window.addEventListener('message', onMessage, { passive: true })
-
-    // ChatGPT extension: openai:set_globals event
-    const onSetGlobals = (event: Event) => {
-      const detail = (event as CustomEvent).detail
-      const output = detail?.globals?.toolOutput ?? (window as any).openai?.toolOutput
-      if (output && Object.keys(output).length > 0) {
-        setToolResult(applyServerUrl(output))
-      }
-    }
-    window.addEventListener('openai:set_globals', onSetGlobals, { passive: true })
-
-    // Fallback: poll window.openai.toolOutput for async population
-    const interval = setInterval(() => {
-      const output = (window as any).openai?.toolOutput
-      if (output && Object.keys(output).length > 0) {
-        setToolResult(applyServerUrl(output))
-        clearInterval(interval)
-      }
-    }, 100)
-
-    return () => {
-      window.removeEventListener('message', onMessage)
-      window.removeEventListener('openai:set_globals', onSetGlobals)
-      clearInterval(interval)
-    }
-  }, [toolResult])
-
-  return toolResult
-}
-
-export function App() {
-  const data = useToolResult()
-  const [step, setStep] = useState<Step>('loadingConnectors')
-  const [connectors, setConnectors] = useState<Connector[]>([])
-  const [flow, setFlow] = useState<FlowState>(INITIAL_FLOW_STATE)
-  const [errorMsg, setErrorMsg] = useState<string | null>(null)
-
-  // Fetch connector list from developer portal once serverUrl (and optionally rcAccountId) is known
-  useEffect(() => {
-    if (!data || data.error) return
-
-    async function loadConnectors() {
-      try {
-        dbg.info('loadConnectors: fetching with rcAccountId=', data!.rcAccountId ?? '(none)')
-        const list = await fetchConnectors(data!.rcAccountId)
-        setConnectors(list)
-        setStep('select')
-      } catch (err: any) {
-        dbg.error('loadConnectors failed:', err.message)
-        setStep('error')
-        setErrorMsg(err.message || 'Failed to load connectors')
-      }
-    }
-
-    loadConnectors()
-  }, [data])
-
-  const resetToSelect = useCallback(() => {
-    setStep('select')
-    setFlow(INITIAL_FLOW_STATE)
-    setErrorMsg(null)
-  }, [])
-
-  const handleConnectorSelect = useCallback(async (connector: Connector) => {
-    dbg.info('connector selected:', JSON.stringify(connector))
-    setStep('loading')
-    setErrorMsg(null)
-
-    try {
-      const manifest = await fetchManifest(
-        connector.id,
-        connector.status === 'private',
-        data?.rcAccountId,
-      )
-
-      if (!manifest) {
-        setStep('error')
-        setErrorMsg('Failed to load connector configuration')
-        return
-      }
-
-      const connectorName = connector.name
-      const platform = manifest?.platforms?.[connectorName]
-
-      if (!platform) {
-        setStep('error')
-        setErrorMsg('Invalid connector configuration')
-        return
-      }
-
-      setFlow((prev) => ({
-        ...prev,
-        connectorManifest: manifest,
-        connectorName,
-        connectorDisplayName: connector.displayName,
-      }))
-
-      const envType = platform.environment?.type
-      const authType = platform.auth?.type
-
-      // For oauth with dynamic/selectable environments, collect auth info first
-      if (authType === 'oauth' && (envType === 'dynamic' || envType === 'selectable')) {
-        setStep('authInfo')
-        return
-      }
-
-      // For fixed environments, extract hostname from the fixed URL
-      if (envType === 'fixed' && platform.environment?.url) {
-        try {
-          const url = new URL(platform.environment.url)
-          setFlow((prev) => ({ ...prev, hostname: url.hostname }))
-        } catch {
-          // hostname stays empty
-        }
-      }
-
-      setStep('oauth')
-    } catch (err: any) {
-      setStep('error')
-      setErrorMsg(err.message || 'Failed to load connector')
-    }
-  }, [data?.rcAccountId])
-
-  const handleAuthInfoSubmit = useCallback(
-    (value: { hostname?: string; selection?: string }) => {
-      try {
-        const platform = flow.connectorManifest?.platforms?.[flow.connectorName!]
-        const envType = platform?.environment?.type
-        let resolvedHostname = ''
-
-        if (envType === 'dynamic' && value.hostname) {
-          resolvedHostname = new URL(value.hostname).hostname
-        } else if (envType === 'selectable' && value.selection) {
-          const sel = platform.environment.selections?.find(
-            (s: { name: string; const: string }) => s.name === value.selection,
-          )
-          if (sel?.const) {
-            resolvedHostname = new URL(sel.const).hostname
-          }
-        }
-
-        setFlow((prev) => ({ ...prev, hostname: resolvedHostname }))
-        setStep('oauth')
-      } catch (err: any) {
-        setStep('error')
-        setErrorMsg(err.message || 'Failed to process environment selection')
-      }
-    },
-    [flow.connectorManifest, flow.connectorName],
-  )
-
-  const handleAuthSuccess = useCallback(
-    (authData: { jwtToken?: string; userInfo?: any }) => {
-      setFlow((prev) => ({ ...prev, userInfo: authData.userInfo ?? null }))
-      setStep('success')
-    },
-    [],
-  )
-
-  const handleAuthError = useCallback(
-    (error: string) => {
-      if (error === 'retry') {
-        setStep('oauth')
-        return
-      }
-      setStep('error')
-      setErrorMsg(error)
-    },
-    [],
-  )
-
-  // Waiting for initial tool output from ChatGPT
-  if (!data) {
-    return (
-      <div className="flex items-center justify-center min-h-[150px] p-4">
-        <div className="animate-spin rounded-full h-6 w-6 border-b-2 border-primary" />
-      </div>
-    )
-  }
-
-  // Error from initial tool call
-  if (data.error) {
-    return (
-      <div className="p-4">
-        <div className="rounded-lg border border-yellow-200 bg-yellow-50 p-4">
-          <p className="text-yellow-800">{data.errorMessage || 'An error occurred'}</p>
-        </div>
-      </div>
-    )
-  }
-
-  return (
-    <div className="p-4">
-      {step === 'loadingConnectors' && (
-        <div className="flex items-center justify-center min-h-[150px]">
-          <div className="text-center space-y-3">
-            <div className="animate-spin rounded-full h-6 w-6 border-b-2 border-primary mx-auto" />
-            <p className="text-sm text-secondary">Loading connectors...</p>
-          </div>
-        </div>
-      )}
-
-      {step === 'select' && (
-        <ConnectorList connectors={connectors} onSelect={handleConnectorSelect} />
-      )}
-
-      {step === 'loading' && (
-        <div className="flex items-center justify-center min-h-[150px]">
-          <div className="text-center space-y-3">
-            <div className="animate-spin rounded-full h-6 w-6 border-b-2 border-primary mx-auto" />
-            <p className="text-sm text-secondary">Loading...</p>
-          </div>
-        </div>
-      )}
-
-      {step === 'authInfo' && flow.connectorManifest && flow.connectorName && (
-        <AuthInfoForm
-          environmentType={
-            flow.connectorManifest.platforms[flow.connectorName].environment.type
-          }
-          urlIdentifier={
-            flow.connectorManifest.platforms[flow.connectorName].environment.urlIdentifier
-          }
-          instructions={
-            flow.connectorManifest.platforms[flow.connectorName].environment.instructions
-          }
-          selections={
-            flow.connectorManifest.platforms[flow.connectorName].environment.selections
-          }
-          connectorDisplayName={flow.connectorDisplayName!}
-          onSubmit={handleAuthInfoSubmit}
-          onBack={resetToSelect}
-        />
-      )}
-
-      {step === 'oauth' && flow.connectorManifest && flow.connectorName && (
-        <OAuthConnect
-          connectorManifest={flow.connectorManifest}
-          connectorName={flow.connectorName}
-          connectorDisplayName={flow.connectorDisplayName!}
-          hostname={flow.hostname}
-          openaiSessionId={data?.openaiSessionId ?? null}
-          rcExtensionId={data?.rcExtensionId ?? null}
-          onSuccess={handleAuthSuccess}
-          onError={handleAuthError}
-          onBack={resetToSelect}
-        />
-      )}
-
-      {step === 'success' && (
-        <AuthSuccess
-          connectorDisplayName={flow.connectorDisplayName!}
-          userInfo={flow.userInfo ?? undefined}
-        />
-      )}
-
-      {step === 'error' && (
-        <div className="w-full max-w-md">
-          <div className="rounded-lg border border-red-200 bg-red-50 p-4 mb-4">
-            <p className="text-red-700 text-sm font-semibold">Error</p>
-            <p className="text-red-700 text-sm mt-1">{errorMsg || 'An error occurred'}</p>
-          </div>
-          <button
-            type="button"
-            onClick={resetToSelect}
-            className="text-sm text-primary hover:underline cursor-pointer"
-          >
-            &larr; Back to connector list
-          </button>
-        </div>
-      )}
-    </div>
-  )
-}

package/mcp/ui/App/components/AuthInfoForm.tsx

@@ -1,113 +0,0 @@
-import { useState } from 'react'
-import { Button } from '@openai/apps-sdk-ui/components/Button'
-import { Input } from '@openai/apps-sdk-ui/components/Input'
-
-interface Selection {
-  name: string
-  const: string
-}
-
-interface AuthInfoFormProps {
-  environmentType: 'dynamic' | 'selectable'
-  urlIdentifier?: string
-  instructions?: string
-  selections?: Selection[]
-  connectorDisplayName: string
-  onSubmit: (value: { hostname?: string; selection?: string }) => void
-  onBack: () => void
-}
-
-export function AuthInfoForm({
-  environmentType,
-  urlIdentifier,
-  instructions,
-  selections,
-  connectorDisplayName,
-  onSubmit,
-  onBack,
-}: AuthInfoFormProps) {
-  const [hostname, setHostname] = useState('')
-  const [selectedName, setSelectedName] = useState<string | null>(null)
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault()
-    if (environmentType === 'dynamic') {
-      onSubmit({ hostname })
-    } else if (selectedName) {
-      onSubmit({ selection: selectedName })
-    }
-  }
-
-  return (
-    <div className="w-full max-w-md">
-      <div className="mb-4">
-        <button
-          type="button"
-          onClick={onBack}
-          className="text-sm text-secondary hover:text-primary transition-colors mb-2 cursor-pointer"
-        >
-          &larr; Back
-        </button>
-        <h2 className="heading-lg">Connect to {connectorDisplayName}</h2>
-      </div>
-
-      <form onSubmit={handleSubmit} className="space-y-4">
-        {environmentType === 'dynamic' && (
-          <div className="space-y-2">
-            <p className="text-secondary text-sm">
-              {instructions || `Enter your ${connectorDisplayName} hostname`}
-            </p>
-            {urlIdentifier && (
-              <p className="text-xs text-secondary opacity-70">
-                Example: {urlIdentifier}
-              </p>
-            )}
-            <Input
-              type="url"
-              value={hostname}
-              onChange={(e: React.ChangeEvent<HTMLInputElement>) => setHostname(e.target.value)}
-              placeholder="https://your-instance.example.com"
-              size="md"
-            />
-          </div>
-        )}
-
-        {environmentType === 'selectable' && selections && (
-          <div className="space-y-2">
-            <p className="text-secondary text-sm">
-              Select your {connectorDisplayName} environment
-            </p>
-            <div className="space-y-2">
-              {selections.map((sel) => (
-                <button
-                  key={sel.name}
-                  type="button"
-                  onClick={() => setSelectedName(sel.name)}
-                  className={`w-full text-left rounded-xl border p-3 transition-colors cursor-pointer ${
-                    selectedName === sel.name
-                      ? 'border-primary bg-surface-hover'
-                      : 'border-default bg-surface hover:border-primary'
-                  }`}
-                >
-                  <span className="font-medium text-sm">{sel.name}</span>
-                </button>
-              ))}
-            </div>
-          </div>
-        )}
-
-        <Button
-          type="submit"
-          color="primary"
-          size="md"
-          disabled={
-            (environmentType === 'dynamic' && !hostname.trim()) ||
-            (environmentType === 'selectable' && !selectedName)
-          }
-        >
-          Continue
-        </Button>
-      </form>
-    </div>
-  )
-}

package/mcp/ui/App/components/AuthSuccess.tsx

@@ -1,22 +0,0 @@
-interface AuthSuccessProps {
-  connectorDisplayName: string
-  userInfo?: { id?: string; name?: string }
-}
-
-export function AuthSuccess({ connectorDisplayName, userInfo }: AuthSuccessProps) {
-  return (
-    <div className="w-full max-w-md">
-      <div className="rounded-xl border border-green-200 bg-green-50 p-5 text-center space-y-2">
-        <div className="text-2xl text-green-700">&#10003;</div>
-        <h2 className="heading-lg text-green-800">Connected</h2>
-        <p className="text-sm text-green-700">
-          Successfully connected to <strong>{connectorDisplayName}</strong>
-          {userInfo?.name ? ` as ${userInfo.name}` : ''}.
-        </p>
-        <p className="text-xs text-green-600 mt-2">
-          You can now use the AI assistant to interact with your CRM.
-        </p>
-      </div>
-    </div>
-  )
-}

package/mcp/ui/App/components/ConnectorList.tsx

@@ -1,82 +0,0 @@
-import { useState } from 'react'
-import { Button } from "@openai/apps-sdk-ui/components/Button"
-import { Badge } from "@openai/apps-sdk-ui/components/Badge"
-
-export interface Connector {
-  id: string
-  name: string
-  displayName: string
-  description?: string
-  status?: 'public' | 'private'
-}
-
-interface ConnectorListProps {
-  connectors: Connector[]
-  disabled?: boolean
-  onSelect: (connector: Connector) => void
-}
-
-export function ConnectorList({ connectors, disabled, onSelect }: ConnectorListProps) {
-  const [selectedName, setSelectedName] = useState<string | null>(null)
-
-  if (!connectors || connectors.length === 0) {
-    return (
-      <div className="p-4 text-center text-secondary">
-        <p>No connectors available</p>
-      </div>
-    )
-  }
-
-  const handleSelect = (connector: Connector) => {
-    setSelectedName(connector.displayName)
-    onSelect(connector)
-  }
-
-  return (
-    <div className="w-full max-w-md">
-      <div className="mb-4">
-        <h2 className="heading-lg">Available Connectors</h2>
-        <p className="text-secondary text-sm mt-1">
-          Select a CRM to connect with RingCentral
-        </p>
-      </div>
-      
-      <div className="space-y-3">
-        {connectors.map((connector) => {
-          const isSelected = selectedName === connector.displayName
-          return (
-            <div
-              key={connector.displayName}
-              className="rounded-xl border border-default bg-surface p-4 hover:border-primary transition-colors"
-            >
-              <div className="flex items-center justify-between gap-3">
-                <div className="flex-1">
-                  <div className="flex items-center gap-2">
-                    <h3 className="font-medium">{connector.displayName}</h3>
-                    {connector.status === 'private' && (
-                      <Badge color="secondary" size="sm">Private</Badge>
-                    )}
-                  </div>
-                  {connector.description && (
-                    <p className="text-secondary text-sm mt-1">
-                      {connector.description}
-                    </p>
-                  )}
-                </div>
-                <Button
-                  color={isSelected ? 'secondary' : 'primary'}
-                  size="sm"
-                  onClick={() => handleSelect(connector)}
-                  disabled={disabled || isSelected}
-                >
-                  {isSelected ? 'Connecting...' : 'Connect'}
-                </Button>
-              </div>
-            </div>
-          )
-        })}
-      </div>
-    </div>
-  )
-}
-

package/mcp/ui/App/components/DebugPanel.tsx

@@ -1,43 +0,0 @@
-import { useState, useEffect } from 'react'
-import { getEntries, subscribe, type DebugEntry } from '../lib/debugLog'
-
-const LEVEL_STYLE: Record<DebugEntry['level'], string> = {
-  info: 'text-blue-700',
-  warn: 'text-yellow-700',
-  error: 'text-red-700 font-semibold',
-}
-
-export function DebugPanel() {
-  const [entries, setEntries] = useState(getEntries)
-  const [open, setOpen] = useState(false)
-
-  useEffect(() => subscribe(() => setEntries(getEntries())), [])
-
-  return (
-    <div className="mt-4 border border-default rounded-lg overflow-hidden text-xs">
-      <button
-        type="button"
-        onClick={() => setOpen((v) => !v)}
-        className="w-full flex items-center justify-between px-3 py-2 bg-surface hover:bg-surface-hover cursor-pointer text-secondary"
-      >
-        <span>Debug log ({entries.length} entries)</span>
-        <span>{open ? '▲' : '▼'}</span>
-      </button>
-
-      {open && (
-        <div className="max-h-60 overflow-y-auto bg-black/5 p-2 space-y-0.5 font-mono">
-          {entries.length === 0 && (
-            <p className="text-secondary italic">No entries yet.</p>
-          )}
-          {entries.map((e, i) => (
-            <div key={i} className={`${LEVEL_STYLE[e.level]} leading-tight`}>
-              <span className="opacity-50 mr-1">{e.time}</span>
-              <span>[{e.level}]</span>{' '}
-              <span className="break-all">{e.msg}</span>
-            </div>
-          ))}
-        </div>
-      )}
-    </div>
-  )
-}