@chainlit/react-client 0.0.1 → 0.0.4

package/README.md

@@ -41,7 +41,11 @@ This hook is responsible for managing the chat session's connection to the WebSo
 #### Example
 
 ```jsx
-import { useChatSession } from '@chainlit/react-client';
+import { ChainlitAPI, useChatSession } from '@chainlit/react-client';
+
+const CHAINLIT_SERVER_URL = 'http://localhost:8000';
+
+const apiClient = new ChainlitAPI(CHAINLIT_SERVER_URL);
 
 const ChatComponent = () => {
   const { connect, disconnect, chatProfile, setChatProfile } = useChatSession();
@@ -49,11 +53,11 @@ const ChatComponent = () => {
   // Connect to the WebSocket server
   useEffect(() => {
     connect({
-      wsEndpoint: 'YOUR_WEBSOCKET_ENDPOINT', // Your Chainlit server url
+      client: apiClient,
       userEnv: {
         /* user environment variables */
       },
-      accessToken: 'YOUR_ACCESS_TOKEN' // Optional Chainlit auth token
+      accessToken: 'Bearer YOUR_ACCESS_TOKEN' // Optional Chainlit auth token
     });
 
     return () => {
@@ -140,7 +144,7 @@ This hook provides methods to interact with the chat, such as sending messages,
 - `replyMessage`: Replies to a message.
 - `sendMessage`: Sends a message.
 - `stopTask`: Stops the current task.
-- `setIdToResume`: Sets the ID to resume a conversation.
+- `setIdToResume`: Sets the ID to resume a thread.
 - `updateChatSettings`: Updates the chat settings.
 
 #### Example

package/dist/index.d.mts

@@ -1,7 +1,7 @@
 import * as recoil from 'recoil';
-import * as lodash from 'lodash';
 import { Socket } from 'socket.io-client';
 export { Socket } from 'socket.io-client';
+import * as lodash from 'lodash';
 import * as swr__internal from 'swr/_internal';
 import { SWRConfiguration } from 'swr';
 
@@ -23,57 +23,56 @@ type IElementSize = 'small' | 'medium' | 'large';
 interface TElement<T> {
     id: string;
     type: T;
-    conversationId?: string;
-    forIds?: string[];
+    threadId?: string;
+    forId: string;
+    mime?: string;
     url?: string;
+    chainlitKey?: string;
 }
 interface TMessageElement<T> extends TElement<T> {
     name: string;
     display: 'inline' | 'side' | 'page';
 }
 interface IImageElement extends TMessageElement<'image'> {
-    content?: ArrayBuffer;
     size?: IElementSize;
 }
 interface IAvatarElement extends TElement<'avatar'> {
     name: string;
-    content?: ArrayBuffer;
 }
 interface ITextElement extends TMessageElement<'text'> {
-    content?: string;
     language?: string;
 }
 interface IPdfElement extends TMessageElement<'pdf'> {
-    content?: string;
+    page?: number;
 }
 interface IAudioElement extends TMessageElement<'audio'> {
-    content?: ArrayBuffer;
 }
 interface IVideoElement extends TMessageElement<'video'> {
-    content?: ArrayBuffer;
     size?: IElementSize;
 }
 interface IFileElement extends TMessageElement<'file'> {
     type: 'file';
-    mime?: string;
-    content?: ArrayBuffer;
 }
 interface IPlotlyElement extends TMessageElement<'plotly'> {
-    content?: string;
 }
 interface ITasklistElement extends TElement<'tasklist'> {
-    content?: string;
 }
 
-interface IBaseTemplate {
-    template?: string;
-    formatted?: string;
-    template_format: string;
+interface IFeedback {
+    id?: string;
+    forId?: string;
+    comment?: string;
+    strategy: 'BINARY';
+    value: number;
 }
-type PromptMessageRole = 'system' | 'assistant' | 'user' | 'function';
+
+type GenerationMessageRole = 'system' | 'assistant' | 'user' | 'function' | 'tool';
 type ILLMSettings = Record<string, string | string[] | number | boolean>;
-interface IPromptMessage extends IBaseTemplate {
-    role: PromptMessageRole;
+interface IGenerationMessage {
+    template?: string;
+    formatted?: string;
+    templateFormat: string;
+    role: GenerationMessageRole;
     name?: string;
 }
 interface IFunction {
@@ -91,38 +90,49 @@ interface ITool {
     type: string;
     function: IFunction;
 }
-interface IPrompt extends IBaseTemplate {
+interface IBaseGeneration {
     provider: string;
     id?: string;
     inputs?: Record<string, string>;
     completion?: string;
     settings?: ILLMSettings;
     functions?: IFunction[];
-    messages?: IPromptMessage[];
+    tokenCount?: number;
 }
-interface IMessage {
-    author: string;
-    authorIsUser?: boolean;
-    content?: string;
-    createdAt: number | string;
-    disableHumanFeedback?: boolean;
-    elements?: IFileElement[];
-    humanFeedback?: number;
-    humanFeedbackComment?: string;
+interface ICompletionGeneration extends IBaseGeneration {
+    type: 'COMPLETION';
+    template?: string;
+    formatted?: string;
+    templateFormat: string;
+}
+interface IChatGeneration extends IBaseGeneration {
+    type: 'CHAT';
+    messages?: IGenerationMessage[];
+}
+type IGeneration = ICompletionGeneration | IChatGeneration;
+
+type StepType = 'assistant_message' | 'user_message' | 'system_message' | 'run' | 'tool' | 'llm' | 'embedding' | 'retrieval' | 'rerank' | 'undefined';
+interface IStep {
     id: string;
-    indent?: number;
+    name: string;
+    type: StepType;
+    threadId?: string;
+    parentId?: string;
     isError?: boolean;
+    showInput?: boolean | string;
+    waitForAnswer?: boolean;
+    input?: string;
+    output: string;
+    createdAt: number | string;
+    start?: number | string;
+    end?: number | string;
+    disableFeedback?: boolean;
+    feedback?: IFeedback;
     language?: string;
-    parentId?: string;
-    prompt?: IPrompt;
     streaming?: boolean;
-    waitForAnswer?: boolean;
-    subMessages?: IMessage[];
-}
-interface IMessageContent {
-    elements: IMessageElement[];
-    message: IMessage;
-    preserveSize?: boolean;
+    generation?: IGeneration;
+    steps?: IStep[];
+    indent?: number;
 }
 
 interface FileSpec {
@@ -133,57 +143,51 @@ interface FileSpec {
 interface ActionSpec {
     keys?: string[];
 }
-interface IFileResponse {
-    name: string;
-    path?: string;
-    size: number;
-    type: string;
-    content: ArrayBuffer;
+interface IFileRef {
+    id: string;
 }
 interface IAsk {
-    callback: (payload: IMessage | IFileResponse[] | IAction) => void;
+    callback: (payload: IStep | IFileRef[] | IAction) => void;
     spec: {
         type: 'text' | 'file' | 'action';
         timeout: number;
     } & FileSpec & ActionSpec;
 }
 
-type Role = 'USER' | 'ADMIN' | 'OWNER' | 'ANONYMOUS';
-type AppUserProvider = 'credentials' | 'header' | 'github' | 'google' | 'azure-ad';
-interface IAppUser {
-    id: string;
-    username: string;
-    role: Role;
+type AuthProvider = 'credentials' | 'header' | 'github' | 'google' | 'azure-ad';
+interface IUserMetadata extends Record<string, any> {
     tags?: string[];
     image?: string;
-    provider?: AppUserProvider;
+    provider?: AuthProvider;
+}
+interface IUser {
+    id: string;
+    identifier: string;
+    metadata: IUserMetadata;
 }
 
-interface IConversation {
+interface IThread {
     id: string;
     createdAt: number | string;
-    appUser?: IAppUser;
+    user?: IUser;
     metadata?: Record<string, any>;
-    messages: IMessage[];
-    elements: IElement[];
+    steps: IStep[];
+    elements?: IElement[];
 }
 
-type MessageHistory = {
+type UserInput = {
     content: string;
     createdAt: number;
 };
-type ConversationsHistory = {
-    conversations?: IConversation[];
-    currentConversationId?: string;
-    groupedConversations?: {
-        [key: string]: IConversation[];
+type ThreadHistory = {
+    threads?: IThread[];
+    currentThreadId?: string;
+    timeGroupedThreads?: {
+        [key: string]: IThread[];
     };
     pageInfo?: IPageInfo;
 };
 
-interface IMessageUpdate extends IMessage {
-    newId?: string;
-}
 interface IToken {
     id: number | string;
     token: string;
@@ -204,55 +208,14 @@ declare const useChatData: () => {
     tasklists: ITasklistElement[];
 };
 
-declare const useChatInteract: () => {
-    callAction: (action: IAction) => void;
-    clear: () => void;
-    replyMessage: (message: IMessage) => void;
-    sendMessage: (message: IMessage, files?: IFileElement[]) => void;
-    stopTask: () => void;
-    setIdToResume: recoil.SetterOrUpdater<string | undefined>;
-    updateChatSettings: (values: object) => void;
-};
-
-declare const useChatMessages: () => {
-    messages: IMessage[];
-    firstUserMessage: IMessage | undefined;
-};
-
-declare const useChatSession: () => {
-    connect: lodash.DebouncedFunc<({ wsEndpoint, userEnv, accessToken }: {
-        wsEndpoint: string;
-        userEnv: Record<string, string>;
-        accessToken?: string | undefined;
-    }) => void>;
-    disconnect: () => void;
-    chatProfile: string | undefined;
-    setChatProfile: recoil.SetterOrUpdater<string | undefined>;
-};
-
 declare const useAuth: (apiClient: ChainlitAPI) => {
-    data: {
-        requireLogin: boolean;
-        passwordAuth: boolean;
-        headerAuth: boolean;
-        oauthProviders: string[];
-    };
-    user: null;
-    role: string;
-    isReady: boolean;
-    isAuthenticated: boolean;
-    accessToken: string;
-    logout: () => void;
-    setAccessToken: () => void;
-} | {
     data: {
         requireLogin: boolean;
         passwordAuth: boolean;
         headerAuth: boolean;
         oauthProviders: string[];
     } | undefined;
-    user: IAppUser | null;
-    role: Role | undefined;
+    user: IUser | null;
     isAuthenticated: boolean;
     isReady: boolean;
     accessToken: string | undefined;
@@ -263,8 +226,7 @@ declare const useAuth: (apiClient: ChainlitAPI) => {
 declare const fetcher: (client: ChainlitAPI, endpoint: string, token?: string) => Promise<any>;
 declare function useApi<T>(client: ChainlitAPI, path: string | null, options?: SWRConfiguration): swr__internal.SWRResponse<T, Error, Partial<swr__internal.PublicConfiguration<T, Error, swr__internal.BareFetcher<T>>> | undefined>;
 
-interface IConversationsFilters {
-    authorEmail?: string;
+interface IThreadFilters {
     search?: string;
     feedback?: number;
 }
@@ -299,27 +261,62 @@ declare class APIBase {
 declare class ChainlitAPI extends APIBase {
     headerAuth(): Promise<any>;
     passwordAuth(data: FormData): Promise<any>;
-    getCompletion(prompt: IPrompt, userEnv: {} | undefined, controller: AbortController, accessToken?: string, tokenCb?: (done: boolean, token: string) => void): Promise<ReadableStream<any>>;
-    setHumanFeedback(messageId: string, feedback: number, feedbackComment?: string, accessToken?: string): Promise<void>;
-    getConversations(pagination: IPagination, filter: IConversationsFilters, accessToken?: string): Promise<{
+    getGeneration(generation: IGeneration, userEnv: {} | undefined, controller: AbortController, accessToken?: string, tokenCb?: (done: boolean, token: string) => void): Promise<ReadableStream<any>>;
+    setFeedback(feedback: IFeedback, accessToken?: string): Promise<{
+        success: boolean;
+        feedbackId: string;
+    }>;
+    listThreads(pagination: IPagination, filter: IThreadFilters, accessToken?: string): Promise<{
         pageInfo: IPageInfo;
-        data: IConversation[];
+        data: IThread[];
     }>;
-    deleteConversation(conversationId: string, accessToken?: string): Promise<any>;
+    deleteThread(threadId: string, accessToken?: string): Promise<any>;
+    uploadFile(file: File, onProgress: (progress: number) => void, sessionId: string, token?: string): {
+        xhr: XMLHttpRequest;
+        promise: Promise<{
+            id: string;
+        }>;
+    };
+    getElementUrl(id: string, sessionId: string, accessToken?: string): string;
     getLogoEndpoint(theme: string): string;
     getOAuthEndpoint(provider: string): string;
 }
 
+declare const useChatInteract: () => {
+    uploadFile: (client: ChainlitAPI, file: File, onProgress: (progress: number) => void) => {
+        xhr: XMLHttpRequest;
+        promise: Promise<{
+            id: string;
+        }>;
+    };
+    callAction: (action: IAction) => Promise<{
+        id: string;
+        status: boolean;
+        response?: string | undefined;
+    }> | undefined;
+    clear: () => void;
+    replyMessage: (message: IStep) => void;
+    sendMessage: (message: IStep, fileReferences?: IFileRef[]) => void;
+    stopTask: () => void;
+    setIdToResume: recoil.SetterOrUpdater<string | undefined>;
+    updateChatSettings: (values: object) => void;
+};
+
+declare const useChatMessages: () => {
+    messages: IStep[];
+    firstInteraction: string | undefined;
+};
+
 interface ISession {
     socket: Socket;
     error?: boolean;
 }
-declare const conversationIdToResumeState: recoil.RecoilState<string | undefined>;
+declare const threadIdToResumeState: recoil.RecoilState<string | undefined>;
 declare const chatProfileState: recoil.RecoilState<string | undefined>;
 declare const sessionIdState: recoil.RecoilState<string>;
 declare const sessionState: recoil.RecoilState<ISession | undefined>;
 declare const actionState: recoil.RecoilState<IAction[]>;
-declare const messagesState: recoil.RecoilState<IMessage[]>;
+declare const messagesState: recoil.RecoilState<IStep[]>;
 declare const tokenCountState: recoil.RecoilState<number>;
 declare const loadingState: recoil.RecoilState<boolean>;
 declare const askUserState: recoil.RecoilState<IAsk | undefined>;
@@ -329,19 +326,31 @@ declare const chatSettingsValueState: recoil.RecoilState<any>;
 declare const elementState: recoil.RecoilState<IMessageElement[]>;
 declare const avatarState: recoil.RecoilState<IAvatarElement[]>;
 declare const tasklistState: recoil.RecoilState<ITasklistElement[]>;
-declare const firstUserMessageState: recoil.RecoilState<IMessage | undefined>;
+declare const firstUserInteraction: recoil.RecoilState<string | undefined>;
 declare const accessTokenState: recoil.RecoilState<string | undefined>;
-declare const roleState: recoil.RecoilState<Role>;
-declare const userState: recoil.RecoilState<IAppUser | null>;
-declare const conversationsHistoryState: recoil.RecoilState<ConversationsHistory | undefined>;
+declare const userState: recoil.RecoilState<IUser | null>;
+declare const threadHistoryState: recoil.RecoilState<ThreadHistory | undefined>;
+
+declare const useChatSession: () => {
+    connect: lodash.DebouncedFunc<({ client, userEnv, accessToken }: {
+        client: ChainlitAPI;
+        userEnv: Record<string, string>;
+        accessToken?: string | undefined;
+    }) => void>;
+    disconnect: () => void;
+    session: ISession | undefined;
+    chatProfile: string | undefined;
+    idToResume: string | undefined;
+    setChatProfile: recoil.SetterOrUpdater<string | undefined>;
+};
 
-declare const nestMessages: (messages: IMessage[]) => IMessage[];
-declare const isLastMessage: (messages: IMessage[], index: number) => boolean;
-declare const addMessage: (messages: IMessage[], message: IMessage) => IMessage[];
-declare const addMessageToParent: (messages: IMessage[], parentId: string, newMessage: IMessage) => IMessage[];
-declare const hasMessageById: (messages: IMessage[], messageId: string) => boolean;
-declare const updateMessageById: (messages: IMessage[], messageId: string, updatedMessage: IMessage) => IMessage[];
-declare const deleteMessageById: (messages: IMessage[], messageId: string) => IMessage[];
-declare const updateMessageContentById: (messages: IMessage[], messageId: number | string, updatedContent: string, isSequence: boolean) => IMessage[];
+declare const nestMessages: (messages: IStep[]) => IStep[];
+declare const isLastMessage: (messages: IStep[], index: number) => boolean;
+declare const addMessage: (messages: IStep[], message: IStep) => IStep[];
+declare const addMessageToParent: (messages: IStep[], parentId: string, newMessage: IStep) => IStep[];
+declare const hasMessageById: (messages: IStep[], messageId: string) => boolean;
+declare const updateMessageById: (messages: IStep[], messageId: string, updatedMessage: IStep) => IStep[];
+declare const deleteMessageById: (messages: IStep[], messageId: string) => IStep[];
+declare const updateMessageContentById: (messages: IStep[], messageId: number | string, updatedContent: string, isSequence: boolean) => IStep[];
 
-export { APIBase, ActionSpec, AppUserProvider, ChainlitAPI, ClientError, ConversationsHistory, ElementType, FileSpec, IAction, IAppUser, IAsk, IAudioElement, IAvatarElement, IConversation, IConversationsFilters, IElement, IElementSize, IFileElement, IFileResponse, IFunction, IImageElement, ILLMSettings, IMessage, IMessageContent, IMessageElement, IMessageUpdate, IPageInfo, IPagination, IPdfElement, IPlotlyElement, IPrompt, IPromptMessage, ISession, ITasklistElement, ITextElement, IToken, ITool, IVideoElement, MessageHistory, PromptMessageRole, Role, accessTokenState, actionState, addMessage, addMessageToParent, askUserState, avatarState, chatProfileState, chatSettingsDefaultValueSelector, chatSettingsInputsState, chatSettingsValueState, conversationIdToResumeState, conversationsHistoryState, deleteMessageById, elementState, fetcher, firstUserMessageState, hasMessageById, isLastMessage, loadingState, messagesState, nestMessages, roleState, sessionIdState, sessionState, tasklistState, tokenCountState, updateMessageById, updateMessageContentById, useApi, useAuth, useChatData, useChatInteract, useChatMessages, useChatSession, userState };
+export { APIBase, ActionSpec, AuthProvider, ChainlitAPI, ClientError, ElementType, FileSpec, GenerationMessageRole, IAction, IAsk, IAudioElement, IAvatarElement, IBaseGeneration, IChatGeneration, ICompletionGeneration, IElement, IElementSize, IFeedback, IFileElement, IFileRef, IFunction, IGeneration, IGenerationMessage, IImageElement, ILLMSettings, IMessageElement, IPageInfo, IPagination, IPdfElement, IPlotlyElement, ISession, IStep, ITasklistElement, ITextElement, IThread, IThreadFilters, IToken, ITool, IUser, IUserMetadata, IVideoElement, ThreadHistory, UserInput, accessTokenState, actionState, addMessage, addMessageToParent, askUserState, avatarState, chatProfileState, chatSettingsDefaultValueSelector, chatSettingsInputsState, chatSettingsValueState, deleteMessageById, elementState, fetcher, firstUserInteraction, hasMessageById, isLastMessage, loadingState, messagesState, nestMessages, sessionIdState, sessionState, tasklistState, threadHistoryState, threadIdToResumeState, tokenCountState, updateMessageById, updateMessageContentById, useApi, useAuth, useChatData, useChatInteract, useChatMessages, useChatSession, userState };