SolidJS Reactive Primitives in useChat Hook

Feature Description

The current version of the useChat hook in the SolidJS SDK does not support reactive primitives for the api option. This means that the api option remains static throughout the lifecycle of the hook, unlike in the React version where it can be defined with useState and updated reactively.

To address this, we propose adding support for reactive primitives in the useChat hook for the SolidJS SDK, which would allow the api option to be updated dynamically. This would enable capabilities like:

Switching between different AI providers or APIs on the fly
Dynamically updating other options or configurations based on reactive state

Use Case

Supporting reactive primitives for the api option in the useChat hook would be beneficial in scenarios where you need to change the AI provider or API based on user interactions or other dynamic conditions. For example:

Building an application that allows users to switch between different AI providers/models
Integrating multiple AI services and dynamically selecting the appropriate one based on user preferences or application logic
Enabling advanced use cases like load balancing or failover across multiple AI providers

Additional context

Currently, the SolidJS SDK's useChat hook does not provide the same level of flexibility as the React version when it comes to dynamically updating the api option. This limitation can hinder the development of more advanced and dynamic applications that require runtime changes to the AI provider or API.

By introducing support for reactive primitives in the useChat hook, the SolidJS SDK would align more closely with the React version's capabilities, providing developers with greater flexibility and consistency across different frameworks.

Example Usage

import { createSignal } from 'solid-js';
import { useChat } from 'ai/solid';

const App = () => {
  const [api, setApi] = createSignal('https://example.com/api');

  const { messages, sendMessage } = useChat({ api });

  // Update the API based on user interaction or other logic
  const handleApiChange = (newEnpoint) => {
    setApi(newEndpoint);
  };

  // ...
};

here useChat hook's api option supports both regular string and Accessor<string> types

vercel / ai