@fluxy-chat/react

pnpm add @fluxy-chat/react @fluxy-chat/sdk

import { FluxyChatClient } from "@fluxy-chat/sdk";
import { FluxyRealtimeProvider, useChat, useInbox } from "@fluxy-chat/react";

const client = new FluxyChatClient({
  baseUrl: process.env.NEXT_PUBLIC_FLUXYCHAT_WORKER_URL!,
  userId: "alice",
  token: memberJwt,
});

function App() {
  return (
    <FluxyRealtimeProvider workerUrl={process.env.NEXT_PUBLIC_FLUXYCHAT_WORKER_URL!} connectUrl="/api/fluxy/connect">
      <Room roomId="general" />
      <InboxPanel />
    </FluxyRealtimeProvider>
  );
}

function Room({ roomId }: { roomId: string }) {
  const { messages, sendMessage, connectionState } = useChat({ roomId, client });
  // connectionState: connected | degraded | degraded-http | blocked | …
}

function InboxPanel() {
  const { items, unseen, onItem } = useInbox({ client, onItem: (item) => console.log(item) });
}