Добавление на сайт

<!-- Вставьте embed-сниппет Агентики из панели управления в любое место страницы -->
<div id="agentika-inline-container"></div>

import { useEffect } from 'react';

declare global {
  interface Window {
    AgentikaWidget?: {
      initInline: (options: { container: HTMLElement }) => void;
      refresh: () => void;
      getState: () => { isInitialized: boolean };
    };
  }
}

export function Assistant() {
  useEffect(() => {
    let retries = 0;
    const tryInit = () => {
      const container = document.getElementById('agentika-inline-container');
      if (window.AgentikaWidget && container) {
        const { isInitialized } = window.AgentikaWidget.getState();
        if (isInitialized) window.AgentikaWidget.refresh();
        else window.AgentikaWidget.initInline({ container });
      } else if (retries++ < 50) {
        setTimeout(tryInit, 100);
      }
    };
    tryInit();
  }, []);

  return <div id="agentika-inline-container" />;
}

<button id="talk-btn">Talk to AI</button>

<script>
  let callStatus = 'idle';
  const btn = document.getElementById('talk-btn');

  function render() {
    btn.textContent =
      callStatus === 'connected' ? 'End Call'
      : callStatus === 'connecting' ? 'Connecting…'
      : callStatus === 'failed' ? 'Retry'
      : 'Talk to AI';
  }

  window.AgentikaWidget.onStatusChange((status) => {
    callStatus = status;
    render();
  });

  window.AgentikaWidget.onError((err) => {
    console.error('Agentika error:', err.message);
  });

  btn.addEventListener('click', () => {
    if (callStatus === 'connected' || callStatus === 'connecting') {
      window.AgentikaWidget.end();
    } else {
      window.AgentikaWidget.start();
    }
  });
</script>

import { useEffect, useState } from 'react';

type CallStatus = 'idle' | 'connecting' | 'connected' | 'failed';

declare global {
  interface Window {
    AgentikaWidget: {
      start: () => void;
      end: () => void;
      onStatusChange: (cb: (status: CallStatus, text?: string, subtext?: string) => void) => void;
      onError: (cb: (err: Error) => void) => void;
    };
  }
}

export function TalkButton() {
  const [status, setStatus] = useState<CallStatus>('idle');

  useEffect(() => {
    window.AgentikaWidget.onStatusChange((s) => setStatus(s));
    window.AgentikaWidget.onError((err) => console.error('Agentika error:', err.message));
  }, []);

  const isLive = status === 'connected' || status === 'connecting';
  const label = { idle: 'Talk to AI', connecting: 'Connecting…', connected: 'End Call', failed: 'Retry' }[status];

  return (
    <button onClick={() => (isLive ? window.AgentikaWidget.end() : window.AgentikaWidget.start())}>
      {label}
    </button>
  );
}

window.AgentikaWidget.onCallConnected(({ agentId, workflowRunId }) => {
  analytics.track('voice_call_started', { agentId, workflowRunId });
});

window.AgentikaWidget.onCallDisconnected(({ workflowRunId, durationSeconds }) => {
  analytics.track('voice_call_ended', { workflowRunId, durationSeconds });
});