Function useChatKit

packages/chatkit-react/src/useChatKit.ts:58–108

(options: UseChatKitOptions)

};

export function useChatKit(options: UseChatKitOptions): UseChatKitReturn {
  const ref = React.useRef<OpenAIChatKit | null>(null);
  const stableOptions = useStableOptions(options);

  const methods: ChatKitMethods = React.useMemo(() => {
    return CHATKIT_METHOD_NAMES.reduce((acc, key) => {
      acc[key] = (...args: any[]) => {
        if (!ref.current) {
          console.warn('ChatKit element is not mounted');
          return;
        }

        return (ref.current as any)[key](...args);
      };
      return acc;
    }, {} as ChatKitMethods);
  }, []);

  const setInstance = React.useCallback(
    (instance: OpenAIChatKit | null): void => {
      ref.current = instance;
    },
    [],
  );

  const control: ChatKitControl = React.useMemo(() => {
    const options = {} as ChatKitOptions;
    const handlers: ChatKitEventHandlers = {};

    for (const [key, value] of Object.entries(stableOptions)) {
      if (/^on[A-Z]/.test(key) && key !== 'onClientTool') {
        // @ts-expect-error - too dynamic for TypeScript
        handlers[key] = value;
      } else {
        // @ts-expect-error - too dynamic for TypeScript
        options[key] = value;
      }
    }

    return {
      setInstance,
      options,
      handlers,
    };
  }, [stableOptions, setInstance]);

  return React.useMemo(
    () => ({ ...methods, control, ref }),
    [methods, control],
  );
}