Overview

React Native hooks for building AI-powered mobile applications.

The @reverbia/sdk/expo package provides React hooks optimized for Expo and React Native environments. These hooks exclude web-only dependencies (like pdfjs-dist) that aren’t compatible with React Native.

Installation & Setup

Before using this package, you must set up polyfills for React Native compatibility. See the polyfills module documentation for complete setup instructions.

Quick setup summary:


pnpm install @reverbia/sdk@next web-streams-polyfill react-native-get-random-values @ethersproject/shims buffer

Then create an entrypoint file with all required polyfills. See ai-example-expo for a complete working example.

Differences from React Package

The Expo package is a lightweight subset of @reverbia/sdk/react:

No PDF text extraction (pdfjs-dist is web-only)
Uses XMLHttpRequest for streaming (fetch streaming isn’t supported in RN)

Authentication

Use @privy-io/expo for authentication in React Native:


import { PrivyProvider, usePrivy } from "@privy-io/expo";
import { useIdentityToken } from "@privy-io/expo";
 
// Wrap your app with PrivyProvider
<PrivyProvider appId="your-app-id" clientId="your-client-id">
  <App />
</PrivyProvider>;
 
// Get identity token for API calls
const { getIdentityToken } = useIdentityToken();

Quick Start


import { useIdentityToken } from "@privy-io/expo";
import { useChat } from "@reverbia/sdk/expo";
 
function ChatScreen() {
  const { getIdentityToken } = useIdentityToken();
 
  const { isLoading, sendMessage, stop } = useChat({
    getToken: getIdentityToken,
    baseUrl: "https://portal.anuma-dev.ai",
    onData: (chunk) => {
      // Handle streaming chunks
      const content =
        typeof chunk === "string"
          ? chunk
          : chunk.choices?.[0]?.delta?.content || "";
      console.log("Received:", content);
    },
    onFinish: () => console.log("Stream finished"),
    onError: (error) => console.error("Error:", error),
  });
 
  const handleSend = async () => {
    await sendMessage({
      messages: [{ role: "user", content: [{ type: "text", text: "Hello!" }] }],
      model: "openai/gpt-4o",
    });
  };
 
  return (
    <View>
      <Button onPress={handleSend} disabled={isLoading} title="Send" />
      {isLoading && <Button onPress={stop} title="Stop" />}
    </View>
  );
}

Hooks

Function	Description
useChat	A React hook for managing chat completions with authentication.
useChatStorage	A React hook that wraps useChat with automatic message persistence using WatermelonDB.
useMemoryStorage	A React hook that wraps useMemory with automatic memory persistence using WatermelonDB.