@sendbird/uikit-chat-hooks 1.1.0 → 1.1.2

package/src/channel/useGroupChannelList/reducer.ts

@@ -0,0 +1,154 @@
+import { useReducer } from 'react';
+
+import type { SendbirdChannel } from '@sendbird/uikit-utils';
+import { SendbirdGroupChannel, getGroupChannels } from '@sendbird/uikit-utils';
+
+type Order = 'latest_last_message' | 'chronological' | 'channel_name_alphabetical' | 'metadata_value_alphabetical';
+
+type Action =
+  | {
+      type: 'update_loading' | 'update_refreshing';
+      value: { status: boolean };
+    }
+  | {
+      type: 'update_channels';
+      value: { channels: SendbirdChannel[] };
+    }
+  | {
+      type: 'delete_channels';
+      value: { channelUrls: string[] };
+    }
+  | {
+      type: 'set_channels';
+      value: { channels: SendbirdChannel[]; clearPrev: boolean };
+    }
+  | {
+      type: 'update_order';
+      value: { order?: Order };
+    };
+
+type State = {
+  loading: boolean;
+  refreshing: boolean;
+  groupChannels: SendbirdGroupChannel[];
+  order?: Order;
+};
+
+const defaultReducer = ({ ...draft }: State, action: Action) => {
+  const compareByOrder = createCompareByOrder(draft.order);
+
+  switch (action.type) {
+    case 'update_refreshing':
+    case 'update_loading': {
+      const key = action.type === 'update_loading' ? 'loading' : 'refreshing';
+      draft[key] = action.value.status;
+      break;
+    }
+    case 'update_channels': {
+      getGroupChannels(action.value.channels).forEach((freshChannel) => {
+        const idx = draft.groupChannels.findIndex((staleChannel) => staleChannel.url === freshChannel.url);
+        if (idx > -1) draft.groupChannels[idx] = freshChannel;
+      });
+
+      compareByOrder && (draft.groupChannels = draft.groupChannels.sort(compareByOrder));
+      break;
+    }
+    case 'delete_channels': {
+      action.value.channelUrls.forEach((url) => {
+        const idx = draft.groupChannels.findIndex((c) => c.url === url);
+        if (idx > -1) draft.groupChannels.splice(idx, 1);
+      });
+
+      compareByOrder && (draft.groupChannels = draft.groupChannels.sort(compareByOrder));
+      break;
+    }
+    case 'set_channels': {
+      if (action.value.clearPrev) {
+        draft.groupChannels = getGroupChannels(action.value.channels);
+      } else {
+        draft.groupChannels = [...draft.groupChannels, ...getGroupChannels(action.value.channels)];
+      }
+
+      compareByOrder && (draft.groupChannels = draft.groupChannels.sort(compareByOrder));
+      break;
+    }
+    case 'update_order': {
+      draft.order = action.value.order;
+      break;
+    }
+  }
+  return draft;
+};
+
+export const useGroupChannelListReducer = (order?: Order) => {
+  const [{ loading, refreshing, groupChannels }, dispatch] = useReducer(defaultReducer, {
+    loading: true,
+    refreshing: false,
+    groupChannels: [],
+    order,
+  });
+
+  const updateChannels = (channels: SendbirdChannel[]) => {
+    dispatch({ type: 'update_channels', value: { channels } });
+  };
+  const deleteChannels = (channelUrls: string[]) => {
+    dispatch({ type: 'delete_channels', value: { channelUrls } });
+  };
+  const setChannels = (channels: SendbirdChannel[], clearPrev: boolean) => {
+    dispatch({ type: 'set_channels', value: { channels, clearPrev } });
+  };
+  const updateLoading = (status: boolean) => {
+    dispatch({ type: 'update_loading', value: { status } });
+  };
+  const updateRefreshing = (status: boolean) => {
+    dispatch({ type: 'update_refreshing', value: { status } });
+  };
+  const updateOrder = (order?: Order) => {
+    dispatch({ type: 'update_order', value: { order } });
+  };
+
+  return {
+    updateLoading,
+    updateRefreshing,
+    updateChannels,
+    deleteChannels,
+    setChannels,
+
+    updateOrder,
+
+    loading,
+    refreshing,
+    groupChannels,
+  };
+};
+
+const createCompareByOrder = (order?: Order) => {
+  if (!order) return undefined;
+
+  return (channel1: SendbirdGroupChannel, channel2: SendbirdGroupChannel): number => {
+    switch (order) {
+      case 'latest_last_message': {
+        if (channel1.lastMessage && channel2.lastMessage) {
+          return channel2.lastMessage.createdAt - channel1.lastMessage.createdAt;
+        } else if (channel1.lastMessage) {
+          return -1;
+        } else if (channel2.lastMessage) {
+          return 1;
+        } else {
+          return channel2.createdAt - channel1.createdAt;
+        }
+      }
+
+      case 'chronological': {
+        return channel2.createdAt - channel1.createdAt;
+      }
+
+      case 'channel_name_alphabetical': {
+        return channel1.name.localeCompare(channel2.name);
+      }
+      default: {
+        return 0;
+      }
+    }
+  };
+};

package/src/channel/useGroupChannelList/useGroupChannelListWithCollection.ts

@@ -0,0 +1,116 @@
+import { useEffect, useRef } from 'react';
+
+import type { SendbirdChatSDK, SendbirdGroupChannelCollection } from '@sendbird/uikit-utils';
+import { useAsyncEffect, useFreshCallback, useUniqId } from '@sendbird/uikit-utils';
+
+import { useAppFeatures } from '../../common/useAppFeatures';
+import { useChannelHandler } from '../../handler/useChannelHandler';
+import type { UseGroupChannelList, UseGroupChannelListOptions } from '../../types';
+import { useGroupChannelListReducer } from './reducer';
+
+const HOOK_NAME = 'useGroupChannelListWithCollection';
+
+const createGroupChannelListCollection = (
+  sdk: SendbirdChatSDK,
+  collectionCreator: UseGroupChannelListOptions['collectionCreator'],
+) => {
+  const passedCollection = collectionCreator?.();
+  if (passedCollection) return passedCollection;
+
+  const defaultOptions = {
+    includeEmpty: false,
+    limit: 20,
+    order: sdk.GroupChannelCollection.GroupChannelOrder.LATEST_LAST_MESSAGE,
+  };
+  const collectionBuilder = sdk.GroupChannel.createGroupChannelCollection();
+  const groupChannelFilter = new sdk.GroupChannelFilter();
+  groupChannelFilter.includeEmpty = defaultOptions.includeEmpty;
+
+  return collectionBuilder
+    .setFilter(groupChannelFilter)
+    .setLimit(defaultOptions.limit)
+    .setOrder(defaultOptions.order)
+    .build();
+};
+
+export const useGroupChannelListWithCollection: UseGroupChannelList = (sdk, userId, options) => {
+  const id = useUniqId(HOOK_NAME);
+  const { deliveryReceiptEnabled } = useAppFeatures(sdk);
+
+  const collectionRef = useRef<SendbirdGroupChannelCollection>();
+
+  const { loading, groupChannels, refreshing, setChannels, deleteChannels, updateRefreshing, updateLoading } =
+    useGroupChannelListReducer();
+
+  const updateChannelsAndMarkAsDelivered = (markAsDelivered: boolean) => {
+    const channels = collectionRef.current?.channelList ?? [];
+    setChannels(channels, true);
+    if (markAsDelivered && deliveryReceiptEnabled) channels.forEach((channel) => sdk.markAsDelivered(channel.url));
+  };
+
+  const init = useFreshCallback(async (uid?: string) => {
+    if (collectionRef.current) collectionRef.current?.dispose();
+
+    if (uid) {
+      collectionRef.current = createGroupChannelListCollection(sdk, options?.collectionCreator);
+
+      if (collectionRef.current?.hasMore) {
+        await collectionRef.current?.loadMore();
+        updateChannelsAndMarkAsDelivered(true);
+      }
+
+      collectionRef.current?.setGroupChannelCollectionHandler({
+        onChannelsAdded() {
+          updateChannelsAndMarkAsDelivered(true);
+        },
+        onChannelsUpdated() {
+          updateChannelsAndMarkAsDelivered(true);
+        },
+        onChannelsDeleted() {
+          updateChannelsAndMarkAsDelivered(false);
+        },
+      });
+    }
+  });
+
+  useEffect(() => {
+    return () => {
+      if (collectionRef.current) collectionRef.current?.dispose();
+    };
+  }, []);
+
+  useAsyncEffect(async () => {
+    updateLoading(true);
+    await init(userId);
+    updateLoading(false);
+  }, [init, userId]);
+
+  useChannelHandler(sdk, `${HOOK_NAME}_${id}`, {
+    onUserBanned: (channel, user) => {
+      const isMe = user.userId === userId;
+      if (isMe) deleteChannels([channel.url]);
+      else updateChannelsAndMarkAsDelivered(false);
+    },
+  });
+
+  const refresh = useFreshCallback(async () => {
+    updateRefreshing(true);
+    await init(userId);
+    updateRefreshing(false);
+  });
+
+  const next = useFreshCallback(async () => {
+    if (collectionRef.current?.hasMore) {
+      await collectionRef.current?.loadMore();
+      updateChannelsAndMarkAsDelivered(true);
+    }
+  });
+
+  return {
+    loading,
+    groupChannels,
+    refresh,
+    refreshing,
+    next,
+  };
+};

package/src/channel/useGroupChannelList/useGroupChannelListWithQuery.ts

@@ -0,0 +1,114 @@
+import { useRef } from 'react';
+import type Sendbird from 'sendbird';
+
+import type { SendbirdChannel, SendbirdChatSDK } from '@sendbird/uikit-utils';
+import { useAsyncEffect, useFreshCallback } from '@sendbird/uikit-utils';
+
+import { useAppFeatures } from '../../common/useAppFeatures';
+import { useChannelHandler } from '../../handler/useChannelHandler';
+import type { UseGroupChannelList, UseGroupChannelListOptions } from '../../types';
+import { useGroupChannelListReducer } from './reducer';
+
+const HOOK_NAME = 'useGroupChannelListWithQuery';
+
+const createGroupChannelListQuery = (
+  sdk: SendbirdChatSDK,
+  queryCreator: UseGroupChannelListOptions['queryCreator'],
+) => {
+  const passedQuery = queryCreator?.();
+  if (passedQuery) return passedQuery;
+
+  const defaultOptions = {
+    includeEmpty: false,
+    limit: 20,
+    order: 'latest_last_message',
+  } as const;
+  const defaultQuery = sdk.GroupChannel.createMyGroupChannelListQuery();
+  defaultQuery.limit = defaultOptions.limit;
+  defaultQuery.order = defaultOptions.order;
+  defaultQuery.includeEmpty = defaultOptions.includeEmpty;
+  return defaultQuery;
+};
+
+export const useGroupChannelListWithQuery: UseGroupChannelList = (sdk, userId, options) => {
+  const { deliveryReceiptEnabled } = useAppFeatures(sdk);
+  const queryRef = useRef<Sendbird.GroupChannelListQuery>();
+
+  const {
+    loading,
+    groupChannels,
+    refreshing,
+    updateChannels,
+    setChannels,
+    deleteChannels,
+    updateRefreshing,
+    updateLoading,
+    updateOrder,
+  } = useGroupChannelListReducer();
+
+  const updateChannelsAndMarkAsDelivered = (channels: SendbirdChannel[]) => {
+    updateChannels(channels);
+    if (deliveryReceiptEnabled) channels.forEach((channel) => sdk.markAsDelivered(channel.url));
+  };
+
+  const init = useFreshCallback(async (uid?: string) => {
+    if (uid) {
+      queryRef.current = createGroupChannelListQuery(sdk, options?.queryCreator);
+      updateOrder(queryRef.current?.order);
+
+      if (queryRef.current?.hasNext) {
+        const channels = await queryRef.current.next();
+
+        setChannels(channels, true);
+        if (deliveryReceiptEnabled) channels.forEach((channel) => sdk.markAsDelivered(channel.url));
+      }
+    }
+  });
+
+  useAsyncEffect(async () => {
+    updateLoading(true);
+    await init(userId);
+    updateLoading(false);
+  }, [init, userId]);
+
+  useChannelHandler(sdk, HOOK_NAME, {
+    onChannelChanged: (channel) => updateChannelsAndMarkAsDelivered([channel]),
+    onChannelFrozen: (channel) => updateChannels([channel]),
+    onChannelUnfrozen: (channel) => updateChannels([channel]),
+    onChannelMemberCountChanged: (channels) => updateChannels(channels),
+    onChannelDeleted: (url) => deleteChannels([url]),
+    onUserJoined: (channel) => updateChannelsAndMarkAsDelivered([channel]),
+    onUserLeft: (channel, user) => {
+      const isMe = user.userId === userId;
+      if (isMe) deleteChannels([channel.url]);
+      else updateChannelsAndMarkAsDelivered([channel]);
+    },
+    onUserBanned(channel, user) {
+      const isMe = user.userId === userId;
+      if (isMe) deleteChannels([channel.url]);
+      else updateChannelsAndMarkAsDelivered([channel]);
+    },
+  });
+
+  const refresh = useFreshCallback(async () => {
+    updateRefreshing(true);
+    await init(userId);
+    updateRefreshing(false);
+  });
+
+  const next = useFreshCallback(async () => {
+    if (queryRef.current?.hasNext) {
+      const channels = await queryRef.current.next();
+      setChannels(channels, false);
+      if (deliveryReceiptEnabled) channels.forEach((channel) => sdk.markAsDelivered(channel.url));
+    }
+  });
+
+  return {
+    loading,
+    groupChannels,
+    refresh,
+    refreshing,
+    next,
+  };
+};

package/src/channel/useGroupChannelMessages/useGroupChannelMessagesWithCollection.ts

@@ -62,12 +62,12 @@ export const useGroupChannelMessagesWithCollection: UseGroupChannelMessages = (s
     try {
       if (deliveryReceiptEnabled) sdk.markAsDelivered(activeChannel.url);
     } catch (e) {
-      Logger.error(`[${HOOK_NAME}/channelMarkAs/Delivered]`, e);
+      Logger.warn(`[${HOOK_NAME}/channelMarkAs/Delivered]`, e);
     }
     try {
       await sdk.markAsReadWithChannelUrls([activeChannel.url]);
     } catch (e) {
-      Logger.error(`[${HOOK_NAME}/channelMarkAs/Read]`, e);
+      Logger.warn(`[${HOOK_NAME}/channelMarkAs/Read]`, e);
     }
   };
 
@@ -99,7 +99,7 @@ export const useGroupChannelMessagesWithCollection: UseGroupChannelMessages = (s
             }
           })
           .onApiResult((err, messages) => {
-            if (err) Logger.error(`[${HOOK_NAME}/onApiResult]`, err);
+            if (err) Logger.warn(`[${HOOK_NAME}/onApiResult]`, err);
             else {
               Logger.debug(`[${HOOK_NAME}/onApiResult]`, 'message length:', messages.length);
               updateMessages(messages, true, sdk.currentUser.userId);

package/src/channel/useGroupChannelMessages/useGroupChannelMessagesWithQuery.ts

@@ -49,12 +49,12 @@ export const useGroupChannelMessagesWithQuery: UseGroupChannelMessages = (sdk, c
     try {
       if (deliveryReceiptEnabled) sdk.markAsDelivered(activeChannel.url);
     } catch (e) {
-      Logger.error(`[${HOOK_NAME}/channelMarkAs/Delivered]`, e);
+      Logger.warn(`[${HOOK_NAME}/channelMarkAs/Delivered]`, e);
     }
     try {
       await sdk.markAsReadWithChannelUrls([activeChannel.url]);
     } catch (e) {
-      Logger.error(`[${HOOK_NAME}/channelMarkAs/Read]`, e);
+      Logger.warn(`[${HOOK_NAME}/channelMarkAs/Read]`, e);
     }
   };
 

package/src/common/useMessageOutgoingStatus.ts

@@ -0,0 +1,56 @@
+import type {
+  SendbirdAdminMessage,
+  SendbirdChatSDK,
+  SendbirdFileMessage,
+  SendbirdGroupChannel,
+  SendbirdUserMessage,
+} from '@sendbird/uikit-utils';
+import { isDifferentChannel, isMyMessage, useForceUpdate, useUniqId } from '@sendbird/uikit-utils';
+
+import { useChannelHandler } from '../handler/useChannelHandler';
+import { useAppFeatures } from './useAppFeatures';
+
+const HOOK_NAME = 'useMessageOutgoingStatus';
+
+export type SBUOutgoingStatus = 'NONE' | 'PENDING' | 'FAILED' | 'UNDELIVERED' | 'DELIVERED' | 'UNREAD' | 'READ';
+
+export const useMessageOutgoingStatus = (
+  sdk: SendbirdChatSDK,
+  channel: SendbirdGroupChannel,
+  message?: SendbirdFileMessage | SendbirdUserMessage | SendbirdAdminMessage | null,
+): SBUOutgoingStatus => {
+  const features = useAppFeatures(sdk);
+  const forceUpdate = useForceUpdate();
+  const currentUser = sdk.currentUser;
+
+  const uniqId = useUniqId(HOOK_NAME);
+  useChannelHandler(sdk, `${HOOK_NAME}_${uniqId}`, {
+    onDeliveryReceiptUpdated(eventChannel) {
+      if (isDifferentChannel(channel, eventChannel)) return;
+      if (!isMyMessage(message, currentUser?.userId)) return;
+
+      forceUpdate();
+    },
+    onReadReceiptUpdated(eventChannel) {
+      if (isDifferentChannel(channel, eventChannel)) return;
+      if (!isMyMessage(message, currentUser?.userId)) return;
+
+      forceUpdate();
+    },
+  });
+
+  if (!message) return 'NONE';
+
+  if (message.sendingStatus === 'pending') return 'PENDING';
+
+  if (message.sendingStatus === 'failed') return 'FAILED';
+
+  if (channel.getUnreadMemberCount(message) === 0) return 'READ';
+
+  if (features.deliveryReceiptEnabled) {
+    if (channel.getUndeliveredMemberCount(message) === 0) return 'DELIVERED';
+    return 'UNDELIVERED';
+  }
+
+  return 'UNREAD';
+};

package/src/index.ts

@@ -2,11 +2,12 @@ export { useGroupChannelList } from './channel/useGroupChannelList';
 export { useGroupChannelMessages } from './channel/useGroupChannelMessages';
 export { useActiveGroupChannel } from './channel/useActiveGroupChannel';
 
-export { useUserList } from './common/useUserList';
+export { useAppFeatures } from './common/useAppFeatures';
+export { useMessageOutgoingStatus } from './common/useMessageOutgoingStatus';
 export { usePushTrigger } from './common/usePushTrigger';
-export { useTotalUnreadMessageCount } from './common/useTotalUnreadMessageCount';
 export { useTotalUnreadChannelCount } from './common/useTotalUnreadChannelCount';
-export { useAppFeatures } from './common/useAppFeatures';
+export { useTotalUnreadMessageCount } from './common/useTotalUnreadMessageCount';
+export { useUserList } from './common/useUserList';
 
 export { useChannelHandler } from './handler/useChannelHandler';
 export { useConnectionHandler } from './handler/useConnectionHandler';

package/src/types.ts

@@ -48,13 +48,6 @@ export interface UseGroupChannelList {
      * */
     refresh: () => Promise<void>;
 
-    /**
-     * Update channel, update or insert channel to state
-     * @param {SendbirdGroupChannel} channel
-     * @return {void}
-     * */
-    update: (channel: SendbirdGroupChannel) => void;
-
     /**
      * Get group channels state
      * */
@@ -68,7 +61,6 @@ export interface UseGroupChannelList {
   };
 }
 export type UseGroupChannelListOptions = {
-  sortComparator?: (a: SendbirdGroupChannel, b: SendbirdGroupChannel) => number;
   queryCreator?: () => Sendbird.GroupChannelListQuery;
   collectionCreator?: () => SendbirdGroupChannelCollection;
   enableCollectionWithoutLocalCache?: boolean;

package/lib/commonjs/channel/useGroupChannelList.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useGroupChannelList","sdk","userId","options","isCacheEnabled","enableCollectionWithoutLocalCache","useGroupChannelListWithCollection","useGroupChannelListWithQuery"],"sources":["useGroupChannelList.ts"],"sourcesContent":["import type { UseGroupChannelList } from '../types';\nimport { useGroupChannelListWithCollection } from './useGroupChannelListWithCollection';\nimport { useGroupChannelListWithQuery } from './useGroupChannelListWithQuery';\n\nexport const useGroupChannelList: UseGroupChannelList = (sdk, userId, options) => {\n  if (sdk.isCacheEnabled || options?.enableCollectionWithoutLocalCache) {\n    return useGroupChannelListWithCollection(sdk, userId, options);\n  } else {\n    return useGroupChannelListWithQuery(sdk, userId, options);\n  }\n};\n"],"mappings":";;;;;;;AACA;;AACA;;AAEO,MAAMA,mBAAwC,GAAG,CAACC,GAAD,EAAMC,MAAN,EAAcC,OAAd,KAA0B;EAChF,IAAIF,GAAG,CAACG,cAAJ,IAAsBD,OAAtB,aAAsBA,OAAtB,eAAsBA,OAAO,CAAEE,iCAAnC,EAAsE;IACpE,OAAO,IAAAC,oEAAA,EAAkCL,GAAlC,EAAuCC,MAAvC,EAA+CC,OAA/C,CAAP;EACD,CAFD,MAEO;IACL,OAAO,IAAAI,0DAAA,EAA6BN,GAA7B,EAAkCC,MAAlC,EAA0CC,OAA1C,CAAP;EACD;AACF,CANM"}

package/lib/commonjs/channel/useGroupChannelListWithCollection.js

@@ -1,148 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useGroupChannelListWithCollection = void 0;
-
-var _react = require("react");
-
-var _uikitUtils = require("@sendbird/uikit-utils");
-
-var _useAppFeatures = require("../common/useAppFeatures");
-
-var _useChannelHandler = require("../handler/useChannelHandler");
-
-const HOOK_NAME = 'useGroupChannelListWithCollection';
-
-const createGroupChannelListCollection = (sdk, collectionCreator) => {
-  const passedCollection = collectionCreator === null || collectionCreator === void 0 ? void 0 : collectionCreator();
-  if (passedCollection) return passedCollection;
-  const defaultCollection = sdk.GroupChannel.createGroupChannelCollection();
-  const filter = new sdk.GroupChannelFilter();
-  return defaultCollection.setLimit(20).setFilter(filter).build();
-};
-
-const useGroupChannelListWithCollection = (sdk, userId, options) => {
-  const id = (0, _uikitUtils.useUniqId)(HOOK_NAME);
-  const {
-    deliveryReceiptEnabled
-  } = (0, _useAppFeatures.useAppFeatures)(sdk);
-  const collectionRef = (0, _react.useRef)();
-  const [loading, setLoading] = (0, _react.useState)(false);
-  const [refreshing, setRefreshing] = (0, _react.useState)(false);
-  const [groupChannelMap, setGroupChannelMap] = (0, _react.useState)({});
-  const groupChannels = (0, _react.useMemo)(() => {
-    const channels = Object.values(groupChannelMap);
-    if (options !== null && options !== void 0 && options.sortComparator) return channels.sort(options === null || options === void 0 ? void 0 : options.sortComparator);
-    return channels;
-  }, [groupChannelMap, options === null || options === void 0 ? void 0 : options.sortComparator]); // ---------- internal methods ---------- //
-
-  const updateChannels = (channels, clearPrev) => {
-    const groupChannels = channels.filter(c => c.isGroupChannel());
-    if (clearPrev) setGroupChannelMap((0, _uikitUtils.arrayToMap)(groupChannels, 'url'));else setGroupChannelMap(prev => ({ ...prev,
-      ...(0, _uikitUtils.arrayToMap)(groupChannels, 'url')
-    }));
-    if (deliveryReceiptEnabled) groupChannels.forEach(channel => sdk.markAsDelivered(channel.url));
-  };
-
-  const deleteChannels = channelUrls => {
-    setGroupChannelMap(_ref => {
-      let { ...draft
-      } = _ref;
-      channelUrls.forEach(url => delete draft[url]);
-      return draft;
-    });
-  };
-
-  const init = (0, _react.useCallback)(async uid => {
-    var _collectionRef$curren;
-
-    if (collectionRef.current) (_collectionRef$curren = collectionRef.current) === null || _collectionRef$curren === void 0 ? void 0 : _collectionRef$curren.dispose();
-
-    if (uid) {
-      var _collectionRef$curren2, _collectionRef$curren4;
-
-      collectionRef.current = createGroupChannelListCollection(sdk, options === null || options === void 0 ? void 0 : options.collectionCreator);
-
-      if ((_collectionRef$curren2 = collectionRef.current) !== null && _collectionRef$curren2 !== void 0 && _collectionRef$curren2.hasMore) {
-        var _collectionRef$curren3;
-
-        updateChannels(await ((_collectionRef$curren3 = collectionRef.current) === null || _collectionRef$curren3 === void 0 ? void 0 : _collectionRef$curren3.loadMore()), true);
-      }
-
-      (_collectionRef$curren4 = collectionRef.current) === null || _collectionRef$curren4 === void 0 ? void 0 : _collectionRef$curren4.setGroupChannelCollectionHandler({
-        onChannelsAdded(_, channels) {
-          updateChannels(channels, false);
-        },
-
-        onChannelsUpdated(_, channels) {
-          updateChannels(channels, false);
-        },
-
-        onChannelsDeleted(_, channelUrls) {
-          deleteChannels(channelUrls);
-        }
-
-      });
-    }
-  }, [sdk, options === null || options === void 0 ? void 0 : options.collectionCreator]); // ---------- internal methods ends ---------- //
-  // ---------- internal hooks ---------- //
-
-  (0, _react.useEffect)(() => {
-    return () => {
-      var _collectionRef$curren5;
-
-      if (collectionRef.current) (_collectionRef$curren5 = collectionRef.current) === null || _collectionRef$curren5 === void 0 ? void 0 : _collectionRef$curren5.dispose();
-    };
-  }, []);
-  (0, _uikitUtils.useAsyncEffect)(async () => {
-    setLoading(true);
-    await init(userId);
-    setLoading(false);
-  }, [init, userId]);
-  (0, _useChannelHandler.useChannelHandler)(sdk, `${HOOK_NAME}_${id}`, {
-    onUserBanned: (channel, user) => {
-      const isMe = user.userId === userId;
-      if (isMe) deleteChannels([channel.url]);else updateChannels([channel], false);
-    }
-  }); // ---------- internal hooks ends ---------- //
-  // ---------- returns methods ---------- //
-
-  const refresh = (0, _react.useCallback)(async () => {
-    setRefreshing(true);
-    await init(userId);
-    setRefreshing(false);
-  }, [init, userId]);
-  const update = (0, _react.useCallback)(channel => {
-    if (deliveryReceiptEnabled) sdk.markAsDelivered(channel.url);
-    setGroupChannelMap(prev => ({ ...prev,
-      [channel.url]: channel
-    }));
-  }, [sdk]);
-  const next = (0, _react.useCallback)(async () => {
-    var _collectionRef$curren6;
-
-    if ((_collectionRef$curren6 = collectionRef.current) !== null && _collectionRef$curren6 !== void 0 && _collectionRef$curren6.hasMore) {
-      var _collectionRef$curren7;
-
-      const channels = await ((_collectionRef$curren7 = collectionRef.current) === null || _collectionRef$curren7 === void 0 ? void 0 : _collectionRef$curren7.loadMore());
-      setGroupChannelMap(prev => ({ ...prev,
-        ...(0, _uikitUtils.arrayToMap)(channels, 'url')
-      }));
-      if (deliveryReceiptEnabled) channels.forEach(channel => sdk.markAsDelivered(channel.url));
-    }
-  }, [sdk]); // ---------- returns methods ends ---------- //
-
-  return {
-    loading,
-    groupChannels,
-    refresh,
-    refreshing,
-    next,
-    update
-  };
-};
-
-exports.useGroupChannelListWithCollection = useGroupChannelListWithCollection;
-//# sourceMappingURL=useGroupChannelListWithCollection.js.map