@webinex/chatify 2.0.0-build2 → 2.0.0-build3

package/package.json

@@ -2,12 +2,12 @@
   "name": "@webinex/chatify",
   "description": "Webinex Wispo",
   "private": false,
-  "version": "2.0.0-build2",
+  "version": "2.0.0-build3",
   "author": "Webinex Dev",
   "license": "Apache-2.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
-  "types": "dist/esm/types/index.d.ts",
+  "types": "dist/index.d.ts",
   "type": "module",
   "targets": {
     "demo": {

package/src/core/api/accountApi.ts

@@ -9,5 +9,3 @@ export const __accountApi = __baseApi.injectEndpoints({
     }),
   }),
 });
-
-export const { useGetAccountListQuery } = __accountApi;

package/src/core/api/api.ts

@@ -4,7 +4,7 @@ import { __chatApi } from './chatApi';
 import { __baseApi, __settings } from './baseApi';
 import { __chatMessageApi } from './chatMessageApi';
 import { __chatMemberApi } from './chatMemberApi';
-import { __chatListApi } from './chatListApi';
+import { __chatListApi, useChatListItem } from './chatListApi';
 import { __threadApi } from './threadApi';
 import { __threadMessageApi } from './threadMessageApi';
 
@@ -39,4 +39,4 @@ const api: Api<
   GetApiTypes<typeof __baseApi>[4]
 > = __baseApi as any;
 
-export const chatifyApi = Object.assign(api, { settings: __settings });
+export const chatifyApi = Object.assign(api, { settings: __settings, useChatListItem });

package/src/core/api/baseApi.ts

@@ -1,4 +1,4 @@
-import { createApi, fakeBaseQuery } from '@reduxjs/toolkit/query/react';
+import { BaseQueryFn, createApi, fakeBaseQuery } from '@reduxjs/toolkit/query/react';
 import { ChatifyClient } from '../client';
 import { Debounce } from '../debounce';
 import { chatId } from '../types';
@@ -22,9 +22,14 @@ export const __settings: ChatifyApiSettings = {
   client: null!,
 };
 
-export const __baseApi = createApi({
-  baseQuery: fakeBaseQuery(),
-  reducerPath: 'chatify',
-  tagTypes: ['chat', 'account', 'message', 'thread', 'thread-message'],
-  endpoints: (_) => ({}),
-});
+const TAG_TYPES = ['chat', 'account', 'message', 'thread', 'thread-message'] as const;
+
+const baseApi: ReturnType<typeof createApi<BaseQueryFn, {}, 'chatify', (typeof TAG_TYPES)[number]>> =
+  createApi({
+    baseQuery: fakeBaseQuery(),
+    reducerPath: 'chatify',
+    tagTypes: TAG_TYPES,
+    endpoints: (_) => ({}),
+  });
+
+export const __baseApi = baseApi;

package/src/core/api/chatApi.ts

@@ -7,10 +7,7 @@ const chatApi = __baseApi.injectEndpoints({
     getChat: builder.query<Chat, { id: string }>({
       queryFn: async ({ id }) => ({ data: await __settings.client.chat(id) }),
       providesTags: ['chat', 'account'],
-      onCacheEntryAdded: async (
-        { id },
-        { dispatch, cacheEntryRemoved, cacheDataLoaded, updateCachedData },
-      ) => {
+      onCacheEntryAdded: async ({ id }, { cacheEntryRemoved, cacheDataLoaded, updateCachedData }) => {
         await cacheDataLoaded;
 
         unsubscribe(
@@ -84,6 +81,3 @@ const chatApi = __baseApi.injectEndpoints({
 });
 
 export const __chatApi = chatApi;
-
-export const { useGetChatQuery, useLazyGetChatQuery, useAddChatMutation, useUpdateChatNameMutation } =
-  chatApi;

package/src/core/api/chatListApi.ts

@@ -145,5 +145,3 @@ export function useChatListItem(id: string | null) {
 }
 
 export const __chatListApi = chatListApi;
-
-export const { useGetChatListQuery, useLazyGetChatListQuery } = chatListApi;

package/src/core/api/chatMemberApi.ts

@@ -18,5 +18,3 @@ export const __chatMemberApi = __baseApi.injectEndpoints({
     }),
   }),
 });
-
-export const { useAddChatMemberMutation, useRemoveChatMemberMutation } = __chatMemberApi;

package/src/core/api/chatMessageApi.ts

@@ -145,12 +145,3 @@ export const __chatMessageApi = __baseApi.injectEndpoints({
     }),
   }),
 });
-
-export const {
-  useFetchNextChatMessageListMutation,
-  useGetChatMessageListQuery,
-  useReadChatMessageMutation,
-  useSendChatMessageMutation,
-  useGetChatMessageReadQueueQuery,
-  useLazyGetChatMessageListQuery,
-} = __chatMessageApi;

package/src/core/api/index.ts

@@ -1,9 +1 @@
-export * from './baseApi';
-export * from './accountApi';
-export * from './chatApi';
-export * from './chatListApi';
-export * from './chatMemberApi';
-export * from './chatMessageApi';
-export * from './threadApi';
-export * from './threadMessageApi';
 export * from './api';

package/src/core/api/threadApi.ts

@@ -118,15 +118,7 @@ export const __threadApi = __baseApi.injectEndpoints({
 });
 
 export function useUnreadThreadMessageCount() {
-  const { data: threads, ...state } = useGetWatchThreadListQuery();
+  const { data: threads, ...state } = __threadApi.useGetWatchThreadListQuery();
   const count = useMemo(() => (threads != null ? calcThreadListUnreadCount(threads) : null), [threads]);
   return [count, state] as const;
 }
-
-export const {
-  useGetWatchThreadListQuery,
-  useGetThreadQuery,
-  useLazyGetThreadQuery,
-  useLazyGetWatchThreadListQuery,
-  useWatchThreadMutation,
-} = __threadApi;

package/src/core/api/threadMessageApi.ts

@@ -116,12 +116,3 @@ export const __threadMessageApi = __baseApi.injectEndpoints({
     }),
   }),
 });
-
-export const {
-  useFetchNextThreadMessageListMutation,
-  useGetThreadMessageListQuery,
-  useLazyGetThreadMessageListQuery,
-  useReadThreadMessageMutation,
-  useSendThreadMessageMutation,
-  useGetThreadMessageReadQueueQuery,
-} = __threadMessageApi;

package/src/ui/Chat/ChatEditableHeaderName.tsx

@@ -1,5 +1,5 @@
 import { Input, Tooltip } from 'antd';
-import { useUpdateChatNameMutation } from '../../core';
+import { chatifyApi } from '../../core';
 import { customize } from '../customize';
 import { useEffect, useState } from 'react';
 import isHotkey from 'is-hotkey';
@@ -9,7 +9,7 @@ const isEscape = isHotkey('escape');
 const isEnter = isHotkey('enter');
 
 function useUpdateChatName(id: string, value: string) {
-  const [updateChatName] = useUpdateChatNameMutation();
+  const [updateChatName] = chatifyApi.useUpdateChatNameMutation();
   return () => updateChatName({ id, name: value });
 }
 

package/src/ui/Chat/ChatPanel.tsx

@@ -2,7 +2,7 @@ import { CSSProperties } from 'react';
 import { Localizer, LocalizerContext, defaultLocalizer } from '../localizer';
 import { CustomizeContext } from '../customize';
 import { ChatView, ChatViewCustomizeValue } from './ChatView';
-import { useGetChatQuery } from '../../core';
+import { chatifyApi } from '../../core';
 
 export interface ChatPanelCustomizeValue extends ChatViewCustomizeValue {}
 
@@ -16,7 +16,7 @@ export interface ChatPanelProps {
 
 export function ChatPanel(props: ChatPanelProps) {
   const { id, className = '', customize, localizer = defaultLocalizer, style } = props;
-  const { data: chat } = useGetChatQuery({ id });
+  const { data: chat } = chatifyApi.useGetChatQuery({ id });
 
   return (
     <div className={`wxchtf-chatify wxchtf-chat-panel ${className}`} style={style}>

package/src/ui/Chat/ChatView.tsx

@@ -1,13 +1,5 @@
 import { CustomizeContext, customize, useCustomizeContext } from '../customize';
-import {
-  MessageBody,
-  chatId,
-  useFetchNextChatMessageListMutation,
-  useGetChatMessageListQuery,
-  useGetChatMessageReadQueueQuery,
-  useReadChatMessageMutation,
-  useSendChatMessageMutation,
-} from '../../core';
+import { MessageBody, chatId, chatifyApi } from '../../core';
 import {
   Conversation,
   ConversationCustomizeValue,
@@ -41,19 +33,19 @@ function useConversation(props: ChatProps) {
   const { value: chat } = props;
   const { id, name, active, lastReadMessageId } = chat;
 
-  const { data: messageList } = useGetChatMessageListQuery({ chatId: id });
+  const { data: messageList } = chatifyApi.useGetChatMessageListQuery({ chatId: id });
   const { messages, hasMore } = messageList ?? {};
 
-  const [fetchNext, { isLoading: isFetchNextLoading }] = useFetchNextChatMessageListMutation();
+  const [fetchNext, { isLoading: isFetchNextLoading }] = chatifyApi.useFetchNextChatMessageListMutation();
   const onNext = useCallback(() => fetchNext({ chatId: id }), [fetchNext, id]);
 
-  const [read] = useReadChatMessageMutation();
+  const [read] = chatifyApi.useReadChatMessageMutation();
   const onRead = useCallback((id: string) => read({ id }), [read]);
 
-  const [send] = useSendChatMessageMutation();
+  const [send] = chatifyApi.useSendChatMessageMutation();
   const onSend = useCallback((message: MessageBody) => send({ ...message, chatId: id }).unwrap(), [id, send]);
 
-  const { data: readQueue } = useGetChatMessageReadQueueQuery();
+  const { data: readQueue } = chatifyApi.useGetChatMessageReadQueueQuery();
 
   const conversation = useMemo(() => {
     if (!id) {

package/src/ui/Chat/Members/ChatMembersPanel.tsx

@@ -1,10 +1,5 @@
 import { Button, List, Space, Tooltip } from 'antd';
-import {
-  useAddChatMemberMutation,
-  useGetAccountListQuery,
-  useGetChatQuery,
-  useRemoveChatMemberMutation,
-} from '../../../core';
+import { chatifyApi } from '../../../core';
 import { customize } from '../../customize';
 import { useCallback, useMemo } from 'react';
 import { Icon } from '../../common/Icon';
@@ -17,7 +12,7 @@ interface ChatMemberListItemProps {
 }
 
 function useAdd(chatId: string, accountId: string, withHistory: boolean) {
-  const [add, state] = useAddChatMemberMutation();
+  const [add, state] = chatifyApi.useAddChatMemberMutation();
   const onAdd = useCallback(
     () => add({ chatId, accountId, withHistory }),
     [add, chatId, accountId, withHistory],
@@ -26,7 +21,7 @@ function useAdd(chatId: string, accountId: string, withHistory: boolean) {
 }
 
 function useRemove(chatId: string, accountId: string, deleteHistory: boolean) {
-  const [remove, state] = useRemoveChatMemberMutation();
+  const [remove, state] = chatifyApi.useRemoveChatMemberMutation();
   const onRemove = useCallback(
     () => remove({ chatId, accountId, deleteHistory }),
     [remove, chatId, accountId, deleteHistory],
@@ -36,8 +31,8 @@ function useRemove(chatId: string, accountId: string, deleteHistory: boolean) {
 
 const ChatMemberListItem = customize('ChatMemberListItem', (props: ChatMemberListItemProps) => {
   const { chatId } = props;
-  const { data: chat } = useGetChatQuery({ id: chatId });
-  const { data: accounts } = useGetAccountListQuery();
+  const { data: chat } = chatifyApi.useGetChatQuery({ id: chatId });
+  const { data: accounts } = chatifyApi.useGetAccountListQuery();
   const account = accounts!.find((x) => x.id === props.id)!;
   const isMember = chat!.members.some((x) => x.id === account.id);
   const [onAddWithoutHistory] = useAdd(chatId, account.id, false);
@@ -86,8 +81,8 @@ const ChatMemberListItem = customize('ChatMemberListItem', (props: ChatMemberLis
 
 export const ChatMembersPanel = customize('ChatMembersPanel', () => {
   const { id } = useChatContext();
-  const { data: chat } = useGetChatQuery({ id });
-  const { data: accounts } = useGetAccountListQuery();
+  const { data: chat } = chatifyApi.useGetChatQuery({ id });
+  const { data: accounts } = chatifyApi.useGetAccountListQuery();
   const ordered = useMemo(
     () =>
       accounts

package/src/ui/Chat/Members/ChatMembersPreview.tsx

@@ -1,4 +1,4 @@
-import { useGetChatQuery } from '../../../core';
+import { chatifyApi } from '../../../core';
 import { Tooltip } from 'antd';
 import { customize } from '../../customize';
 import { Avatar as AntdAvatar } from 'antd';
@@ -7,7 +7,7 @@ import { useChatContext } from '../ChatContext';
 
 export const ChatMembersPreview = customize('ChatMembersPreview', () => {
   const { id } = useChatContext();
-  const { data: chat } = useGetChatQuery({ id });
+  const { data: chat } = chatifyApi.useGetChatQuery({ id });
 
   if (!chat?.members) {
     return null;

package/src/ui/ChatGroup/ChatGroupPanel.tsx

@@ -4,7 +4,7 @@ import { CreateChatPanelCustomizeValue } from './Create';
 import { ChatGroupBody, ChatGroupFooter, ChatGroupHeader, ChatGroupLayoutCustomizeValue } from './Layout';
 import { ChatListCustomizeValue } from './List';
 import { ChatGroupContext, useChatGroupContext } from './ChatGroupContext';
-import { useGetChatListQuery } from '../../core';
+import { chatifyApi } from '../../core';
 import { CustomizeContext } from '../customize';
 import { ChatViewCustomizeValue } from '../Chat';
 
@@ -23,7 +23,7 @@ export interface ChatifyProps {
 
 function Content(props: Pick<ChatifyProps, 'className' | 'style'>) {
   const { className = '', style } = props;
-  const { data: chats } = useGetChatListQuery();
+  const { data: chats } = chatifyApi.useGetChatListQuery();
   const { openChat, none, chatId } = useChatGroupContext();
   const openFirstChatRef = useRef(false);
 

package/src/ui/ChatGroup/Create/CreateChatMemberInput.tsx

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { chatifyApi, useGetAccountListQuery } from '../../../core';
+import { chatifyApi } from '../../../core';
 import { customize } from '../../customize';
 import { Checkbox, Form, List } from 'antd';
 import { useLocalizer } from '../../localizer';
@@ -16,7 +16,7 @@ interface CheckboxListProps {
 
 function CheckboxList(props: CheckboxListProps) {
   const { value, onChange } = props;
-  const { data: accounts, isFetching } = useGetAccountListQuery();
+  const { data: accounts, isFetching } = chatifyApi.useGetAccountListQuery();
   const me = chatifyApi.settings.me();
   const dataSource = useMemo(() => accounts?.filter((x) => x.id !== me) ?? [], [accounts, me]);
 

package/src/ui/ChatGroup/Create/CreateChatPanel.tsx

@@ -1,4 +1,4 @@
-import { useAddChatMutation } from '../../../core';
+import { chatifyApi } from '../../../core';
 import { useCallback } from 'react';
 import { useLocalizer } from '../../localizer';
 import { CreateChatForm, CreateChatFormValue } from './CreateChatForm';
@@ -8,7 +8,7 @@ import { Icon } from '../../common/Icon';
 import { useChatGroupContext } from '../ChatGroupContext';
 
 function useSubmit() {
-  const [add, { isLoading }] = useAddChatMutation();
+  const [add, { isLoading }] = chatifyApi.useAddChatMutation();
   const { openChat } = useChatGroupContext();
 
   const onSubmit = useCallback(

package/src/ui/ChatGroup/Layout/ChatGroupMain.tsx

@@ -2,11 +2,11 @@ import { customize } from '../../customize';
 import { CreateChatPanel } from '../Create';
 import { ChatView } from '../../Chat';
 import { useChatGroupContext } from '../ChatGroupContext';
-import { useChatListItem } from '../../../core';
+import { chatifyApi } from '../../../core';
 
 export const ChatGroupMain = customize('ChatGroupMain', () => {
   const { chatId, view } = useChatGroupContext();
-  const chat = useChatListItem(chatId);
+  const chat = chatifyApi.useChatListItem(chatId);
 
   return (
     <div className="wxchtf-main">

package/src/ui/ChatGroup/List/ChatList.tsx

@@ -1,7 +1,7 @@
 import { Menu, MenuProps } from 'antd';
 import { useCallback, useMemo } from 'react';
 import type { MenuItemType } from 'antd/es/menu/hooks/useItems';
-import { useGetChatListQuery } from '../../../core';
+import { chatifyApi } from '../../../core';
 import { ChatListItemBox } from './ChatListItemBox';
 import { customize } from '../../customize';
 import { useChatGroupContext } from '../ChatGroupContext';
@@ -16,7 +16,7 @@ function useOnSelect() {
 }
 
 function useMenuItems() {
-  const { data: chats } = useGetChatListQuery();
+  const { data: chats } = chatifyApi.useGetChatListQuery();
 
   return useMemo<MenuItemType[] | undefined>(() => {
     return chats

package/src/ui/Thread/ThreadPanel.tsx

@@ -1,16 +1,5 @@
 import { useCallback, useEffect, useMemo } from 'react';
-import {
-  MessageBody,
-  chatifyApi,
-  parseThreadMessageId,
-  useFetchNextThreadMessageListMutation,
-  useGetThreadMessageListQuery,
-  useGetThreadMessageReadQueueQuery,
-  useGetThreadQuery,
-  useReadThreadMessageMutation,
-  useSendThreadMessageMutation,
-  useWatchThreadMutation,
-} from '../../core';
+import { MessageBody, chatifyApi, parseThreadMessageId } from '../../core';
 import { Conversation, ConversationCustomizeValue, ConversationProps } from '../Conversation';
 import { ThreadContext, ThreadContextValue } from './ThreadContext';
 import { Localizer, LocalizerContext, defaultLocalizer } from '../localizer';
@@ -31,24 +20,24 @@ export interface ThreadPanelProps {
 
 function usePanelState(props: ThreadPanelProps) {
   const { threadId } = props;
-  const { data: thread } = useGetThreadQuery({ id: threadId });
-  const { data: messageList } = useGetThreadMessageListQuery({ threadId });
+  const { data: thread } = chatifyApi.useGetThreadQuery({ id: threadId });
+  const { data: messageList } = chatifyApi.useGetThreadMessageListQuery({ threadId });
   const { id, name, archive, lastReadMessageId, watch } = thread ?? {};
   const { messages, hasMore } = messageList ?? {};
 
-  const [read] = useReadThreadMessageMutation();
+  const [read] = chatifyApi.useReadThreadMessageMutation();
   const onRead = useCallback((id: string) => read({ id }), [read]);
 
-  const [fetchNext, { isLoading: isFetchNextLoading }] = useFetchNextThreadMessageListMutation();
+  const [fetchNext, { isLoading: isFetchNextLoading }] = chatifyApi.useFetchNextThreadMessageListMutation();
   const onNext = useCallback(() => fetchNext({ threadId }), [fetchNext, threadId]);
 
-  const [send] = useSendThreadMessageMutation();
+  const [send] = chatifyApi.useSendThreadMessageMutation();
   const onSend = useCallback(
     (message: MessageBody) => send({ body: message, threadId }).unwrap(),
     [threadId, send],
   );
 
-  const { data: readQueue } = useGetThreadMessageReadQueueQuery();
+  const { data: readQueue } = chatifyApi.useGetThreadMessageReadQueueQuery();
 
   const conversation = useMemo(() => {
     if (!id) {
@@ -86,7 +75,7 @@ function usePanelState(props: ThreadPanelProps) {
     watch,
   ]);
 
-  const [watchThread] = useWatchThreadMutation();
+  const [watchThread] = chatifyApi.useWatchThreadMutation();
 
   const threadContext = useMemo<ThreadContextValue | null>(
     () =>