@droppii-org/chat-mobile 0.2.18 → 0.2.19

package/src/context/ChatDetailContext.tsx

@@ -47,7 +47,7 @@ export const ChatDetailProvider = ({ children }: ChatDetailProviderProps) => {
     return conversation?.peerType === PeerType.Bot;
   }, [conversation]);
 
-  const setConverationFlowStep = useCallback((step: IConversationFlowStep) => {
+  const setConverationFlowStep = useCallback((step?: IConversationFlowStep) => {
     setConverationFlow(
       (prev) =>
         ({

package/src/core/useChatListener.ts

@@ -10,16 +10,14 @@ export const useChatListener = () => {
   const onConversationChanged = useCallback(
     (conversations: ConversationItem[]) => {
       console.log('onConversationChanged', conversations);
-      useConversationStore.getState().mergeOpenIMConversations(conversations);
+      useConversationStore.getState().updateConversations(conversations);
     },
     []
   );
 
   const onNewConversation = useCallback((conversations: ConversationItem[]) => {
     console.log('onNewConversation', conversations);
-    // mergeOpenIMConversations increments newConversationSignal when a conversation
-    // isn't in the store yet, which triggers a full refetch in useConversationList.
-    useConversationStore.getState().mergeOpenIMConversations(conversations);
+    useConversationStore.getState().updateConversations(conversations);
   }, []);
 
   const onGroupMemberAdded = useCallback((member: GroupMemberItem) => {

package/src/core/useUserListener.ts

@@ -21,14 +21,6 @@ export const useUserListener = () => {
     }
   }, []);
 
-  useEffect(() => {
-    ChatAPI.getLoginStatus().then((value) => {
-      if (value) {
-        useUserStore.getState().updateConnectStatus(LoginStatus.Logged);
-      }
-    });
-  }, []);
-
   useEffect(() => {
     if (isLoggedIn) {
       fetchAndUpdateUser();

package/src/hooks/flows/useFlow.ts

@@ -11,14 +11,25 @@ import type {
 } from '../../types/flows';
 import { useSendMessage } from '../message/useSendMessage';
 import { useChatDetailContext } from '../../context/ChatDetailContext';
+import { trans } from '../../translation';
 
 export const useResetFlow = () => {
   const conversationId =
     useConversationStore((state) => state.currentConversationId) || '';
   const { mutate: runFlow } = useRunFlow();
+  const { sendMessage } = useSendMessage();
+  const conversationFlow = useChatDetailContext().conversationFlow;
   return useMutation({
     mutationKey: conversationQueryKeys.flow(conversationId),
     mutationFn: async () => {
+      await sendMessage({
+        plainText: trans('restart'),
+        flow: {
+          groupId: conversationFlow?.flowCurrentStep?.id || '',
+          childId: null,
+          actionId: null,
+        },
+      });
       const res = await apiInstance?.post<BaseResponse<IConversationFlow>>(
         ENDPOINTS.chatService.resetConversationFlow(conversationId),
         {}
@@ -55,9 +66,7 @@ export const useRunFlow = () => {
       return res?.data?.data || undefined;
     },
     onSuccess: (data) => {
-      if (data?.flowNextStep) {
-        setConverationFlowStep(data?.flowNextStep);
-      }
+      setConverationFlowStep(data?.flowNextStep || undefined);
     },
   });
 };

package/src/hooks/message/useSendMessage.ts

@@ -106,7 +106,7 @@ const generateOfflinePushInfo = (
     desc,
     ex: JSON.stringify({
       icon: conversationData?.faceURL || '',
-      conversationId: conversationData?.conversationId || '',
+      conversationId: conversationData?.conversationID || '',
       title,
       desc,
     }),

package/src/hooks/useConversationList.ts

@@ -1,15 +1,9 @@
 import { useEffect } from 'react';
 import { useQuery } from '@tanstack/react-query';
-import OpenIMSDK, {
-  type ConversationItem,
-} from '@droppii/openim-rn-client-sdk';
+import OpenIMSDK from '@droppii/openim-rn-client-sdk';
 import { conversationQueryKeys } from './query-keys';
 import { useConversationStore } from '../store';
-import type {
-  DChatApplicationType,
-  DConversationItem,
-  DMessageItem,
-} from '../types/chat';
+import type { DChatApplicationType } from '../types/chat';
 
 type Params = {
   applicationType: DChatApplicationType;
@@ -17,34 +11,6 @@ type Params = {
   enabled?: boolean;
 };
 
-function toConversationItem(raw: ConversationItem): DConversationItem {
-  let lastMessage: DMessageItem | undefined;
-  if (raw.latestMsg) {
-    try {
-      lastMessage = JSON.parse(raw.latestMsg) as DMessageItem;
-    } catch {
-      // leave undefined
-    }
-  }
-
-  let applicationType: DChatApplicationType | undefined;
-  if (raw.ex) {
-    try {
-      applicationType = (
-        JSON.parse(raw.ex) as { applicationType?: DChatApplicationType }
-      ).applicationType;
-    } catch {
-      // leave undefined
-    }
-  }
-
-  return {
-    ...(raw as DConversationItem),
-    lastMessage,
-    applicationType: applicationType as DChatApplicationType,
-  };
-}
-
 export function useConversationList({
   applicationType,
   page = 1,
@@ -58,13 +24,13 @@ export function useConversationList({
     queryKey: [...conversationQueryKeys.list(applicationType), page],
     enabled: enabled !== false,
     queryFn: async () => {
-      const offset = (page - 1) * 20;
-      const rawList = await OpenIMSDK.getConversationListSplitApp({
+      const offset = (page - 1) * 500;
+      const conversations = await OpenIMSDK.getConversationListSplitApp({
         offset,
-        count: 20,
+        count: 500,
         applicationType,
       });
-      const conversations = rawList.map(toConversationItem);
+
       useConversationStore.getState().updateConversations(conversations);
       return conversations;
     },

package/src/hooks/useLinkPreview/useLinkPreview.ts

@@ -27,5 +27,10 @@ export function useLinkPreview(value: string | undefined) {
 
   const isVisible = !!detectedUrl && !isDismissed && (isLoading || !!metadata);
 
-  return { isVisible, metadata: metadata || undefined, isLoading, dismiss };
+  return {
+    isVisible,
+    metadata: !isLoading ? metadata || undefined : undefined,
+    isLoading,
+    dismiss,
+  };
 }

package/src/screens/chat-detail/ChatDetail.tsx

@@ -43,8 +43,6 @@ const ChatDetail = memo(
     subtitle,
     avatarUri,
     avatarFullName,
-    peerType,
-    applicationType,
     showAddMember,
     getSubtitle,
     onBack,
@@ -139,9 +137,6 @@ const ChatDetail = memo(
     const resolvedAvatarUri =
       avatarUri ?? getConversationAvatarUri(conversation);
     const resolvedAvatarFullName = avatarFullName ?? resolvedTitle;
-    const resolvedPeerType = peerType;
-    const resolvedApplicationType =
-      applicationType ?? conversation?.applicationType;
     const resolvedShowAddMember =
       showAddMember ?? shouldShowAddMember(conversation);
     const resolvedSubtitle = useMemo(() => {
@@ -234,12 +229,11 @@ const ChatDetail = memo(
       <ChatDetailProvider>
         <KContainer.Page flex edges={['bottom']}>
           <ChatDetailHeader
+            conversationId={conversationId}
             title={resolvedTitle}
             subtitle={resolvedSubtitle}
             avatarUri={resolvedAvatarUri}
             avatarFullName={resolvedAvatarFullName}
-            peerType={resolvedPeerType}
-            applicationType={resolvedApplicationType}
             showAddMember={resolvedShowAddMember}
             onBack={onBack ?? handleBackDefault}
             onPressSearch={

package/src/screens/chat-detail/ChatDetailHeader.tsx

@@ -9,6 +9,7 @@ import {
 import { AvatarSection } from '../../components/ThreadCard/AvatarSection';
 import { NamePrefixIcon } from '../../components/ThreadCard/NamePrefixIcon';
 import type { ChatDetailHeaderProps } from './types';
+import { useConversation } from '../../store';
 
 const ChatDetailHeader = memo(
   ({
@@ -16,15 +17,15 @@ const ChatDetailHeader = memo(
     subtitle,
     avatarUri,
     avatarFullName,
-    peerType,
-    applicationType,
     showAddMember = false,
+    conversationId,
     onBack,
     onPressSearch,
     onPressAddMember,
     onPressMenu,
     onPressAvatar,
   }: ChatDetailHeaderProps) => {
+    const conversation = useConversation(conversationId);
     const rightButtons = useMemo(() => {
       const buttons = [
         {
@@ -80,13 +81,12 @@ const ChatDetailHeader = memo(
             <AvatarSection
               avatar={avatarUri ?? null}
               fullName={avatarFullName ?? title}
-              peerType={peerType}
-              applicationType={applicationType}
+              peerType={conversation?.peerType}
             />
 
             <KContainer.View flex marginL="0.5rem">
               <KContainer.View row alignItems>
-                <NamePrefixIcon peerType={peerType} />
+                <NamePrefixIcon peerType={conversation?.peerType} />
                 <KLabel.Text
                   typo="TextLgBold"
                   color={KColors.gray.dark}
@@ -112,12 +112,11 @@ const ChatDetailHeader = memo(
       [
         avatarFullName,
         avatarUri,
-        peerType,
-        applicationType,
         onBack,
         onPressAvatar,
         subtitle,
         title,
+        conversation?.peerType,
       ]
     );
 

package/src/screens/chat-detail/ChatLinkPreview.tsx

@@ -34,18 +34,22 @@ export const ChatLinkPreview = memo(
             />
           )}
         </KContainer.View>
-        <KContainer.View style={styles.center}>
-          <KLabel.Text typo="TextNmMedium" numberOfLines={1}>
-            {metadata?.title}
-          </KLabel.Text>
-          <KLabel.Text
-            typo="TextSmNormal"
-            color={KColors.gray.light}
-            numberOfLines={1}
-          >
-            {metadata?.description}
-          </KLabel.Text>
-        </KContainer.View>
+        {metadata ? (
+          <KContainer.View style={styles.center}>
+            <KLabel.Text typo="TextNmMedium" numberOfLines={1}>
+              {metadata?.title}
+            </KLabel.Text>
+            <KLabel.Text
+              typo="TextSmNormal"
+              color={KColors.gray.light}
+              numberOfLines={1}
+            >
+              {metadata?.description}
+            </KLabel.Text>
+          </KContainer.View>
+        ) : (
+          <KContainer.View flex />
+        )}
         <KContainer.Touchable onPress={onDismiss} style={styles.right}>
           <KImage.VectorIcons name="close-o" size={16} />
         </KContainer.Touchable>

package/src/screens/chat-detail/ChatListLegend.tsx

@@ -349,12 +349,8 @@ export const ChatListLegend = memo(
           renderItem={renderItem}
           estimatedItemSize={avgItemHeightRef.current}
           keyExtractor={(item) => String(item.clientMsgID || item.serverMsgID)}
-          recycleItems={!isBotConversation}
-          extraData={
-            !isBotConversation
-              ? `${conversationFlow?.flowCurrentStep?.id ?? ''}-${lastMessageId ?? ''}`
-              : undefined
-          }
+          recycleItems={false}
+          extraData={`${conversationFlow?.flowCurrentStep?.id ?? ''}-${lastMessageId ?? ''}`}
           alignItemsAtEnd
           maintainVisibleContentPosition={maintainVisiblePositionConfig}
           maintainScrollAtEnd={maintainScrollConfig}

package/src/screens/chat-detail/conversationHeader.utils.ts

@@ -1,8 +1,8 @@
-import { PeerType } from '@droppii/openim-rn-client-sdk';
-import { type DConversationItem } from '../../types/chat';
+import { PeerType, type ConversationItem } from '@droppii/openim-rn-client-sdk';
+import type { IConversationItemEx } from '../../types/chat';
 
 export const getConversationTitle = (
-  conversation?: DConversationItem
+  conversation?: ConversationItem
 ): string => {
   if (!conversation) {
     return 'Tin nhắn';
@@ -12,13 +12,13 @@ export const getConversationTitle = (
 };
 
 export const getConversationAvatarUri = (
-  conversation?: DConversationItem
+  conversation?: ConversationItem
 ): string | null => {
   return conversation?.faceURL ?? null;
 };
 
 export const getConversationSubtitle = (
-  conversation?: DConversationItem
+  conversation?: ConversationItem
 ): string | undefined => {
   if (!conversation) {
     return undefined;
@@ -40,7 +40,17 @@ export const getConversationSubtitle = (
 };
 
 export const shouldShowAddMember = (
-  conversation?: DConversationItem
+  conversation?: ConversationItem
 ): boolean => {
   return conversation?.peerType === PeerType.Group;
 };
+
+export const getConversationEx = (ex?: string): IConversationItemEx | {} => {
+  let result: IConversationItemEx | {} = {};
+  try {
+    result = JSON.parse(ex || '{}');
+  } catch {
+    ///
+  }
+  return result;
+};

package/src/screens/chat-detail/types.ts

@@ -1,13 +1,9 @@
 import type { ReactNode } from 'react';
 
 import type { MediaItem } from '../../hooks/useMediaViewer';
-import type {
-  DChatApplicationType,
-  DConversationItem,
-  DMessageItem,
-} from '../../types/chat';
+import type { DMessageItem } from '../../types/chat';
 import type { IUrlMetadata } from '../../types/common';
-import type { PeerType } from '@droppii/openim-rn-client-sdk';
+import type { ConversationItem } from '@droppii/openim-rn-client-sdk';
 
 export type DChatActionIconProvider = 'MaterialCommunityIcons' | 'DroppiiNew';
 
@@ -29,14 +25,13 @@ export interface ChatDetailHeaderProps {
   subtitle?: string;
   avatarUri?: string | null;
   avatarFullName?: string;
-  peerType?: PeerType;
-  applicationType?: DConversationItem['applicationType'];
   showAddMember?: boolean;
   onBack?: () => void;
   onPressSearch?: () => void;
   onPressAddMember?: () => void;
   onPressMenu?: () => void;
   onPressAvatar?: () => void;
+  conversationId: string;
 }
 
 export interface ChatQuickActionsRenderParams {
@@ -103,9 +98,9 @@ export interface ChatDetailProps extends Omit<
   | 'subtitle'
   | 'avatarUri'
   | 'avatarFullName'
-  | 'peerType'
   | 'applicationType'
   | 'showAddMember'
+  | 'conversationId'
 > {
   conversationId: string;
   enabled?: boolean;
@@ -113,16 +108,14 @@ export interface ChatDetailProps extends Omit<
   subtitle?: string;
   avatarUri?: string | null;
   avatarFullName?: string;
-  peerType?: PeerType;
-  applicationType?: DChatApplicationType;
   showAddMember?: boolean;
-  getSubtitle?: (conversation: DConversationItem) => string | undefined;
+  getSubtitle?: (conversation: ConversationItem) => string | undefined;
   renderChat?: (item: DMessageItem) => ReactNode;
   showQuickActions?: boolean;
   showAttachmentActions?: boolean;
   quickActions?: DChatQuickAction[];
   getQuickActions?: (
-    conversation: DConversationItem
+    conversation: ConversationItem
   ) => DChatQuickAction[] | undefined;
   attachmentActions?: DChatAttachmentAction[];
   inputPlaceholder?: string;

package/src/screens/inbox/Inbox.tsx

@@ -3,6 +3,8 @@ import { StyleSheet } from 'react-native';
 import { TabView } from 'react-native-tab-view';
 import { KContainer, KImage, KLabel, KColors } from '@droppii/libs';
 import { MessagesTab } from './MessagesTab';
+import { useUserStore } from '../../store';
+import { LoginStatus } from '@droppii/openim-rn-client-sdk';
 
 interface InboxProps {
   onPressThread?: (item: string) => void;
@@ -15,6 +17,7 @@ type TabRoute = { key: string; title: string };
 
 const Inbox = memo(
   ({ onPressThread, onPressSearch, onPressEdit, onPressGroup }: InboxProps) => {
+    const connectStatus = useUserStore((state) => state.connectStatus);
     const [index, setIndex] = useState(0);
     const [routes] = useState<TabRoute[]>([
       { key: 'messages', title: 'Tin nhắn' },
@@ -22,12 +25,13 @@ const Inbox = memo(
 
     const renderScene = useCallback(
       ({ route }: { route: TabRoute }) => {
+        if (connectStatus !== LoginStatus.Logged) return null;
         if (route.key === 'messages') {
           return <MessagesTab onPressThread={onPressThread} />;
         }
         return null;
       },
-      [onPressThread]
+      [onPressThread, connectStatus]
     );
 
     const renderTabBar = useCallback(

package/src/services/apis.ts

@@ -1,11 +1,5 @@
 import { type AxiosInstance } from 'axios';
-import type {
-  DConversationItem,
-  DConversationQueryParams,
-} from '../types/chat';
 import OpenIMSDK, { LoginStatus } from '@droppii/openim-rn-client-sdk';
-import type { BaseResponse, GetOpenIMTokenResponse } from '../types/auth';
-import { Platform } from 'react-native';
 import { useConversationStore } from '../store';
 
 export let apiInstance: AxiosInstance | null = null;
@@ -19,25 +13,6 @@ export namespace ChatAPI {
     return (await OpenIMSDK.getLoginStatus(operationID)) === LoginStatus.Logged;
   };
 
-  export const login = async (
-    instance: AxiosInstance,
-    operationID?: string
-  ) => {
-    const isLoggedIn = await getLoginStatus(operationID);
-
-    if (isLoggedIn) return;
-
-    const response = await instance.post<BaseResponse<GetOpenIMTokenResponse>>(
-      `/chat-service/v1/auth/token?platform=${Platform.OS.toUpperCase()}`
-    );
-
-    const token = response?.data?.data;
-
-    if (token == null) return;
-
-    return OpenIMSDK.login({ userID: token.id, token: token.token });
-  };
-
   export const logout = async (operationID?: string) => {
     useConversationStore.getState().reset();
     return OpenIMSDK.logout(operationID);
@@ -46,17 +21,4 @@ export namespace ChatAPI {
   export const getUser = async (operationID?: string | undefined) => {
     return OpenIMSDK.getSelfUserInfo(operationID);
   };
-
-  export async function queryConversations(params: DConversationQueryParams) {
-    if (!apiInstance) {
-      throw new Error(
-        'apiInstance is not initialized. Call initApiInstance() first.'
-      );
-    }
-    const response = await apiInstance.post<BaseResponse<DConversationItem[]>>(
-      '/chat-service/v1/app/conversations/query',
-      params
-    );
-    return response.data;
-  }
 }

package/src/store/conversation.ts

@@ -1,32 +1,23 @@
 import { create } from 'zustand';
-import {
-  sortConversation,
-  mergeOpenIMIntoConversation,
-} from '../utils/conversation';
-import type { DConversationItem } from '../types/chat';
-import type {
-  ConversationItem,
-  MessageItem,
-} from '@droppii/openim-rn-client-sdk';
+import { sortConversation } from '../utils/conversation';
+import type { ConversationItem } from '@droppii/openim-rn-client-sdk';
 
 type ConversationID = string;
 
 export interface ConversationStore {
   currentConversationId?: ConversationID;
   setCurrentConversation(id: ConversationID): void;
-  getCurrentConversation(): DConversationItem | undefined;
+  getCurrentConversation(): ConversationItem | undefined;
   list: ConversationID[];
-  map: Record<ConversationID, DConversationItem>;
+  map: Record<ConversationID, ConversationItem>;
   /** Signal incremented when a truly new conversation arrives and a full refetch is needed. */
   newConversationSignal: number;
-  updateConversations(conversations: DConversationItem[]): void;
+  updateConversations(conversations: ConversationItem[]): void;
   /**
    * Patches existing conversations with real-time data from OpenIM events.
    * Returns true if any conversation was not found in the store (triggers refetch).
    */
-  mergeOpenIMConversations(conversations: ConversationItem[]): boolean;
   removeConversation(id: ConversationID): void;
-  updateLastMessage(id: ConversationID, message: MessageItem): void;
   reset(): void;
 }
 
@@ -56,35 +47,6 @@ export const useConversationStore = create<ConversationStore>()((set, get) => ({
       )
     );
   },
-  mergeOpenIMConversations(conversations) {
-    const currentMap = get().map;
-    let hasUnknown = false;
-    let changed = false;
-
-    const nextMap = { ...currentMap };
-    for (const openim of conversations) {
-      const existing = currentMap[openim.conversationID];
-      if (existing == null) {
-        hasUnknown = true;
-        continue;
-      }
-      nextMap[openim.conversationID] = mergeOpenIMIntoConversation(
-        existing,
-        openim
-      );
-      changed = true;
-    }
-
-    if (changed) {
-      set(sortConversation(nextMap));
-    }
-
-    if (hasUnknown) {
-      set((s) => ({ newConversationSignal: s.newConversationSignal + 1 }));
-    }
-
-    return hasUnknown;
-  },
   removeConversation(id) {
     const newMap = { ...get().map };
     delete newMap[id];
@@ -94,17 +56,6 @@ export const useConversationStore = create<ConversationStore>()((set, get) => ({
       list: get().list.filter((item) => item !== id),
     });
   },
-  updateLastMessage(id, message) {
-    const conversation = get().map[id];
-    if (conversation == null) return;
-
-    set(
-      sortConversation({
-        [id]: { ...conversation, lastMessage: message },
-        ...get().map,
-      })
-    );
-  },
   reset() {
     set({
       currentConversationId: undefined,
@@ -115,6 +66,6 @@ export const useConversationStore = create<ConversationStore>()((set, get) => ({
   },
 }));
 
-export const useConversation = (id: string): DConversationItem | undefined => {
+export const useConversation = (id: string): ConversationItem | undefined => {
   return useConversationStore((state) => state.map[id]);
 };

package/src/types/auth.ts

@@ -16,6 +16,7 @@ type Pageable = {
 export type GetOpenIMTokenResponse = {
   id: string;
   token: string;
+  expiresIn: number;
 };
 
 export enum SyncStatus {