@webinex/chatify 1.0.0-rc3 → 1.0.2-rc3

package/src/core/state.ts

@@ -1,92 +1,93 @@
-import { Account, Chat, ChatListItem, Message, SendMessageRequest, File } from './models';
-
-export type MessageState =
-  | ({ type: 'message' } & Message)
-  | { type: 'next' }
-  | { type: 'sending'; text: string; files: File[]; requestId: string };
-
-export interface UIState {
-  view?: 'chat' | 'new-chat';
-  showMembers: boolean;
-  chatId?: string;
-}
-
-export interface QueryState<TData> {
-  uninitialized: boolean;
-  isFetching: boolean;
-  error?: any;
-  data?: TData;
-}
-
-export interface MutationState {
-  isFetching: boolean;
-  error?: any;
-}
-
-export interface QueueState<TValue> {
-  queued: TValue[];
-  processing: TValue[];
-  timestamp: number;
-}
-
-export interface State {
-  ui: UIState;
-  query: {
-    messages: Record<string, QueryState<MessageState[]>>;
-    chats: Record<string, QueryState<Chat>>;
-    chatList: QueryState<ChatListItem[]>;
-    accounts: QueryState<Account[]>;
-  };
-  mutation: {
-    fetchNext: MutationState;
-    removeMember: MutationState;
-    addMember: MutationState;
-    updateChatName: MutationState;
-    addChat: MutationState;
-    send: MutationState;
-  };
-  queue: {
-    read: QueueState<string>;
-    send: QueueState<SendMessageRequest>;
-  };
-}
-
-export const INITIAL_QUERY_STATE: QueryState<any> = {
-  uninitialized: false,
-  isFetching: true,
-  data: undefined,
-  error: undefined,
-};
-
-export const INITIAL_STATE: State = {
-  ui: {
-    showMembers: false,
-  },
-  query: {
-    messages: {},
-    chats: {},
-    chatList: { uninitialized: true, isFetching: false, data: undefined, error: undefined },
-    accounts: { uninitialized: true, isFetching: false, data: undefined, error: undefined },
-  },
-  mutation: {
-    fetchNext: { isFetching: false, error: undefined },
-    removeMember: { isFetching: false, error: undefined },
-    addMember: { isFetching: false, error: undefined },
-    updateChatName: { isFetching: false, error: undefined },
-    addChat: { isFetching: false, error: undefined },
-    send: { isFetching: false, error: undefined },
-  },
-  queue: {
-    read: {
-      queued: [],
-      processing: [],
-      timestamp: 0,
-    },
-
-    send: {
-      queued: [],
-      processing: [],
-      timestamp: 0,
-    },
-  },
-};
+import { Account, Chat, ChatListItem, Message, SendMessageRequest, File } from './models';
+
+export type MessageState =
+  | ({ type: 'message' } & Message)
+  | { type: 'next' }
+  | { type: 'sending'; text: string; files: File[]; requestId: string };
+
+export interface UIState {
+  view?: 'chat' | 'new-chat';
+  showMembers: boolean;
+  chatId?: string;
+}
+
+export interface QueryState<TData> {
+  uninitialized: boolean;
+  isFetching: boolean;
+  error?: any;
+  data?: TData;
+  requestId?: string;
+}
+
+export interface MutationState {
+  isFetching: boolean;
+  error?: any;
+}
+
+export interface QueueState<TValue> {
+  queued: TValue[];
+  processing: TValue[];
+  timestamp: number;
+}
+
+export interface State {
+  ui: UIState;
+  query: {
+    messages: Record<string, QueryState<MessageState[]>>;
+    chats: Record<string, QueryState<Chat>>;
+    chatList: QueryState<ChatListItem[]>;
+    accounts: QueryState<Account[]>;
+  };
+  mutation: {
+    fetchNext: MutationState;
+    removeMember: MutationState;
+    addMember: MutationState;
+    updateChatName: MutationState;
+    addChat: MutationState;
+    send: MutationState;
+  };
+  queue: {
+    read: QueueState<string>;
+    send: QueueState<SendMessageRequest>;
+  };
+}
+
+export const FETCH_QUERY_STATE: QueryState<any> = Object.freeze({
+  uninitialized: false,
+  isFetching: true,
+  data: undefined,
+  error: undefined,
+});
+
+export const INITIAL_STATE: State = {
+  ui: {
+    showMembers: false,
+  },
+  query: {
+    messages: {},
+    chats: {},
+    chatList: { uninitialized: true, isFetching: false, data: undefined, error: undefined },
+    accounts: { uninitialized: true, isFetching: false, data: undefined, error: undefined },
+  },
+  mutation: {
+    fetchNext: { isFetching: false, error: undefined },
+    removeMember: { isFetching: false, error: undefined },
+    addMember: { isFetching: false, error: undefined },
+    updateChatName: { isFetching: false, error: undefined },
+    addChat: { isFetching: false, error: undefined },
+    send: { isFetching: false, error: undefined },
+  },
+  queue: {
+    read: {
+      queued: [],
+      processing: [],
+      timestamp: 0,
+    },
+
+    send: {
+      queued: [],
+      processing: [],
+      timestamp: 0,
+    },
+  },
+};

package/src/core/useAddChatMutation.tsx

@@ -1,22 +1,22 @@
-import { useCallback } from 'react';
-import { useClient } from '../ChatifyContext';
-import { AddChatRequest } from './models';
-import { useDispatch, useStateRef } from './reducer';
-
-export function useAddChatMutation() {
-  const client = useClient();
-  const dispatch = useDispatch();
-  const stateRef = useStateRef();
-
-  const invoke = useCallback((args: AddChatRequest) => {
-    dispatch({ type: 'addChat_fetch', data: void 0 });
-    client
-      .addChat(args)
-      .then(() => dispatch({ type: 'addChat_fulfilled', data: void 0 }))
-      .catch((error) => dispatch({ type: 'addChat_rejected', data: { error } }));
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  return [invoke, stateRef.current.mutation.addChat] as const;
-}
+import { useCallback } from 'react';
+import { useClient } from '../ChatifyContext';
+import { AddChatRequest } from './models';
+import { useDispatch, useStateRef } from './reducer';
+
+export function useAddChatMutation() {
+  const client = useClient();
+  const dispatch = useDispatch();
+  const stateRef = useStateRef();
+
+  const invoke = useCallback((args: AddChatRequest) => {
+    dispatch({ type: 'addChat_fetch', data: void 0 });
+    client
+      .addChat(args)
+      .then(() => dispatch({ type: 'addChat_fulfilled', data: void 0 }))
+      .catch((error) => dispatch({ type: 'addChat_rejected', data: { error } }));
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return [invoke, stateRef.current.mutation.addChat] as const;
+}

package/src/core/useAddMemberMutation.tsx

@@ -1,25 +1,25 @@
-import { useCallback } from 'react';
-import { useClient } from '../ChatifyContext';
-import { AddMemberRequest } from './models';
-import { useDispatch, useSelect, useStateRef } from './reducer';
-
-export function useAddMemberMutation() {
-  const client = useClient();
-  const dispatch = useDispatch();
-  const state = useStateRef();
-  useSelect((x) => x.mutation.addMember, []);
-
-  const invoke = useCallback(
-    (args: AddMemberRequest) => {
-      dispatch({ type: 'addMember_fetch', data: void 0 });
-      client
-        .addMember(args)
-        .then(() => dispatch({ type: 'addMember_fulfilled', data: void 0 }))
-        .catch((error) => dispatch({ type: 'addMember_rejected', data: { error } }));
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [dispatch],
-  );
-
-  return [invoke, state.current.mutation.addMember] as const;
-}
+import { useCallback } from 'react';
+import { useClient } from '../ChatifyContext';
+import { AddMemberRequest } from './models';
+import { useDispatch, useSelect, useStateRef } from './reducer';
+
+export function useAddMemberMutation() {
+  const client = useClient();
+  const dispatch = useDispatch();
+  const state = useStateRef();
+  useSelect((x) => x.mutation.addMember, []);
+
+  const invoke = useCallback(
+    (args: AddMemberRequest) => {
+      dispatch({ type: 'addMember_fetch', data: void 0 });
+      client
+        .addMember(args)
+        .then(() => dispatch({ type: 'addMember_fulfilled', data: void 0 }))
+        .catch((error) => dispatch({ type: 'addMember_rejected', data: { error } }));
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [dispatch],
+  );
+
+  return [invoke, state.current.mutation.addMember] as const;
+}

package/src/core/useFetchNextMutation.tsx

@@ -1,28 +1,28 @@
-import { useClient } from '../ChatifyContext';
-import { useDispatch, useSelect, useStateRef } from './reducer';
-import { useCallback } from 'react';
-
-export function useFetchNextMutation({ chatId }: { chatId: string }) {
-  const state = useStateRef();
-  useSelect((x) => x.mutation.fetchNext, []);
-  const dispatch = useDispatch();
-  const client = useClient();
-
-  const fetchNext = useCallback(() => {
-    const skip = state.current.query.messages[chatId].data?.filter((x) => x.type === 'message').length;
-    dispatch({ type: 'fetchNext_fetch', data: { chatId } });
-    client
-      .messages({ chatId, skip, take: 16 })
-      .then((messages) =>
-        dispatch({
-          type: 'fetchNext_fulfilled',
-          data: { chatId, messages: messages.slice(0, 15), hasMore: messages.length === 16 },
-        }),
-      )
-      .catch((error) => dispatch({ type: 'fetchNext_rejected', data: { chatId, error } }));
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [chatId]);
-
-  return [fetchNext, state.current.mutation.fetchNext] as const;
-}
+import { useClient } from '../ChatifyContext';
+import { useDispatch, useSelect, useStateRef } from './reducer';
+import { useCallback } from 'react';
+
+export function useFetchNextMutation({ chatId }: { chatId: string }) {
+  const state = useStateRef();
+  useSelect((x) => x.mutation.fetchNext, []);
+  const dispatch = useDispatch();
+  const client = useClient();
+
+  const fetchNext = useCallback(() => {
+    const skip = state.current.query.messages[chatId].data?.filter((x) => x.type === 'message').length;
+    dispatch({ type: 'fetchNext_fetch', data: { chatId } });
+    client
+      .messages({ chatId, skip, take: 16 })
+      .then((messages) =>
+        dispatch({
+          type: 'fetchNext_fulfilled',
+          data: { chatId, messages: messages.slice(0, 15), hasMore: messages.length === 16 },
+        }),
+      )
+      .catch((error) => dispatch({ type: 'fetchNext_rejected', data: { chatId, error } }));
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [chatId]);
+
+  return [fetchNext, state.current.mutation.fetchNext] as const;
+}

package/src/core/useGetAccountsQuery.tsx

@@ -1,33 +1,30 @@
-import { useEffect, useMemo } from 'react';
-import { useClient } from '../ChatifyContext';
-import { useDispatch, useSelect, useStateRef } from './reducer';
-
-export function useGetAccountsQuery() {
-  const client = useClient();
-  const stateRef = useStateRef();
-  useSelect((x) => x.query.accounts, []);
-  const dispatch = useDispatch();
-
-  const uninitialized = useMemo(() => {
-    const uninitialized = stateRef.current.query.accounts.uninitialized !== false;
-    uninitialized && dispatch({ type: 'accounts_fetch', data: void 0 });
-    return uninitialized;
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  useEffect(() => {
-    if (!uninitialized) {
-      return;
-    }
-
-    client
-      .accounts()
-      .then((accounts) => dispatch({ type: 'accounts_fulfilled', data: { accounts } }))
-      .catch((error) => dispatch({ type: 'accounts_rejected', data: { error } }));
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [uninitialized]);
-
-  return stateRef.current.query.accounts;
-}
+import { useEffect, useRef } from 'react';
+import { useClient } from '../ChatifyContext';
+import { useDispatch, useSelect, useStateRef } from './reducer';
+import { FETCH_QUERY_STATE, QueryState } from './state';
+import { uniqId } from '../util';
+import { Account } from './models';
+
+export function useGetAccountsQuery(): QueryState<Account[]> {
+  const id = useRef(uniqId());
+  const client = useClient();
+  const stateRef = useStateRef();
+  const queryState = useSelect((x) => x.query.accounts, []) ?? FETCH_QUERY_STATE;
+  const dispatch = useDispatch();
+
+  useEffect(() => {
+    if (stateRef.current.query.accounts.uninitialized === false) {
+      return;
+    }
+
+    dispatch({ type: 'accounts_fetch', data: { requestId: id.current } });
+    client
+      .accounts()
+      .then((accounts) => dispatch({ type: 'accounts_fulfilled', data: { accounts } }))
+      .catch((error) => dispatch({ type: 'accounts_rejected', data: { error } }));
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return queryState ?? FETCH_QUERY_STATE;
+}

package/src/core/useGetChatListQuery.tsx

@@ -1,33 +1,30 @@
-import { useEffect, useMemo } from 'react';
-import { useClient } from '../ChatifyContext';
-import { useDispatch, useSelect, useStateRef } from './reducer';
-
-export function useGetChatListQuery() {
-  const stateRef = useStateRef();
-  const client = useClient();
-  useSelect((x) => x.query.chatList, []);
-  const dispatch = useDispatch();
-
-  const uninitialized = useMemo(() => {
-    const uninitialized = stateRef.current.query.chatList.uninitialized !== false;
-    uninitialized && dispatch({ type: 'chatList_fetch', data: void 0 });
-    return uninitialized;
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  useEffect(() => {
-    if (!uninitialized) {
-      return;
-    }
-
-    client
-      .chats()
-      .then((chats) => dispatch({ type: 'chatList_fulfilled', data: { chats } }))
-      .catch((error) => dispatch({ type: 'chatList_rejected', data: { error } }));
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  return stateRef.current.query.chatList;
-}
+import { useEffect, useRef } from 'react';
+import { useClient } from '../ChatifyContext';
+import { useDispatch, useSelect, useStateRef } from './reducer';
+import { uniqId } from '../util';
+import { FETCH_QUERY_STATE, QueryState } from './state';
+import { ChatListItem } from './models';
+
+export function useGetChatListQuery(): QueryState<ChatListItem[]> {
+  const id = useRef(uniqId());
+  const stateRef = useStateRef();
+  const client = useClient();
+  const queryState = useSelect((x) => x.query.chatList, []) ?? FETCH_QUERY_STATE;
+  const dispatch = useDispatch();
+
+  useEffect(() => {
+    if (stateRef.current.query.chatList.uninitialized === false) {
+      return;
+    }
+
+    dispatch({ type: 'chatList_fetch', data: { requestId: id.current } });
+    client
+      .chats()
+      .then((chats) => dispatch({ type: 'chatList_fulfilled', data: { chats } }))
+      .catch((error) => dispatch({ type: 'chatList_rejected', data: { error } }));
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return queryState ?? FETCH_QUERY_STATE;
+}

package/src/core/useGetChatQuery.tsx

@@ -1,34 +1,31 @@
-import { useEffect, useMemo } from 'react';
-import { useClient } from '../ChatifyContext';
-import { useDispatch, useSelect, useStateRef } from './reducer';
-
-export function useGetChatQuery(args: { chatId: string }) {
-  const { chatId } = args;
-  const client = useClient();
-  const stateRef = useStateRef();
-  useSelect((x) => x.query.chats[chatId], [chatId]);
-  const dispatch = useDispatch();
-
-  const uninitialized = useMemo(() => {
-    const uninitialized = stateRef.current.query.chats[chatId]?.uninitialized !== false;
-    uninitialized && dispatch({ type: 'chat_fetch', data: { chatId } });
-    return uninitialized;
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [chatId]);
-
-  useEffect(() => {
-    if (!uninitialized) {
-      return;
-    }
-
-    client
-      .chat(chatId)
-      .then((chat) => dispatch({ type: 'chat_fulfilled', data: { chat } }))
-      .catch((error) => dispatch({ type: 'chat_rejected', data: { chatId, error } }));
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [uninitialized, chatId]);
-
-  return stateRef.current.query.chats[chatId];
-}
+import { useEffect, useRef } from 'react';
+import { useClient } from '../ChatifyContext';
+import { useDispatch, useSelect, useStateRef } from './reducer';
+import { uniqId } from '../util';
+import { FETCH_QUERY_STATE, QueryState } from './state';
+import { Chat } from './models';
+
+export function useGetChatQuery(args: { chatId: string }): QueryState<Chat> {
+  const id = useRef(uniqId());
+  const { chatId } = args;
+  const client = useClient();
+  const stateRef = useStateRef();
+  const queryState = useSelect((x) => x.query.chats[chatId], [chatId]) ?? FETCH_QUERY_STATE;
+  const dispatch = useDispatch();
+
+  useEffect(() => {
+    if (stateRef.current.query.chats[chatId]?.uninitialized === true) {
+      return;
+    }
+
+    dispatch({ type: 'chat_fetch', data: { chatId, requestId: id.current } });
+    client
+      .chat(chatId)
+      .then((chat) => dispatch({ type: 'chat_fulfilled', data: { chat } }))
+      .catch((error) => dispatch({ type: 'chat_rejected', data: { chatId, error } }));
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [chatId]);
+
+  return queryState ?? FETCH_QUERY_STATE;
+}

package/src/core/useGetMessagesQuery.tsx

@@ -1,35 +1,35 @@
-import { useEffect, useMemo } from 'react';
-import { useClient } from '../ChatifyContext';
-import { MessageState, QueryState } from './state';
-import { useDispatch, useSelect, useStateRef } from './reducer';
-
-export function useGetMessagesQuery(args: { chatId: string }): QueryState<MessageState[]> {
-  const { chatId } = args;
-  const stateRef = useStateRef();
-  const dispatch = useDispatch();
-  useSelect((x) => x.query.messages[chatId], [chatId]);
-  const client = useClient();
-
-  const uninitialized = useMemo(() => {
-    const uninitialized = stateRef.current.query.messages[chatId]?.uninitialized !== false;
-    uninitialized && dispatch({ type: 'messages_fetch', data: { chatId } });
-    return uninitialized;
-  }, [chatId, dispatch, stateRef]);
-
-  useEffect(() => {
-    if (!uninitialized) {
-      return;
-    }
-
-    client.messages({ chatId, skip: 0, take: 16 }).then((messages) =>
-      dispatch({
-        type: 'messages_fulfilled',
-        data: { chatId, messages: messages.slice(0, 15), hasMore: messages.length === 16 },
-      }),
-    );
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [chatId]);
-
-  return stateRef.current.query.messages[chatId];
-}
+import { useEffect, useRef } from 'react';
+import { useClient } from '../ChatifyContext';
+import { FETCH_QUERY_STATE, MessageState, QueryState } from './state';
+import { useDispatch, useSelect, useStateRef } from './reducer';
+import { uniqId } from '../util';
+
+export function useGetMessagesQuery(args: { chatId: string }): QueryState<MessageState[]> {
+  const { chatId } = args;
+  const id = useRef(uniqId());
+  const stateRef = useStateRef();
+  const dispatch = useDispatch();
+  useSelect((x) => x.query.messages[chatId], [chatId]);
+  const client = useClient();
+
+  useEffect(() => {
+    if (stateRef.current.query.messages[chatId]?.uninitialized === false) {
+      return;
+    }
+
+    dispatch({ type: 'messages_fetch', data: { requestId: id.current, chatId } });
+    client
+      .messages({ chatId, skip: 0, take: 16 })
+      .then((messages) =>
+        dispatch({
+          type: 'messages_fulfilled',
+          data: { chatId, messages: messages.slice(0, 15), hasMore: messages.length === 16 },
+        }),
+      )
+      .catch((error) => dispatch({ type: 'messages_rejected', data: { chatId, error } }));
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [chatId]);
+
+  return stateRef.current.query.messages[chatId] ?? FETCH_QUERY_STATE;
+}