@sendbird/uikit-react-native 2.0.3 → 2.2.0

package/lib/module/fragments/createGroupChannelMembersFragment.js

@@ -1,14 +1,15 @@
-import React, { useCallback } from 'react';
-import { useActiveGroupChannel, useChannelHandler } from '@sendbird/uikit-chat-hooks';
-import { Icon } from '@sendbird/uikit-react-native-foundation';
-import { useForceUpdate, useUniqId } from '@sendbird/uikit-utils';
+import React, { useRef } from 'react';
+import { useChannelHandler, useUserList } from '@sendbird/uikit-chat-hooks';
+import { Icon, useActionMenu } from '@sendbird/uikit-react-native-foundation';
+import { ifMuted, ifOperator, isDifferentChannel, useFreshCallback, useUniqId } from '@sendbird/uikit-utils';
+import StatusComposition from '../components/StatusComposition';
 import UserActionBar from '../components/UserActionBar';
 import createUserListModule from '../domain/userList/module/createUserListModule';
-import { useLocalization, useSendbirdChat } from '../hooks/useContext';
+import { useLocalization, useSendbirdChat, useUserProfile } from '../hooks/useContext';
 
 const noop = () => '';
 
-const name = 'createGroupChannelMembersFragment';
+const HOOK_NAME = 'createGroupChannelMembersFragment';
 
 const createGroupChannelMembersFragment = initModule => {
   const UserListModule = createUserListModule(initModule);
@@ -19,77 +20,112 @@ const createGroupChannelMembersFragment = initModule => {
       onPressHeaderRight,
       renderUser
     } = _ref;
-    const uniqId = useUniqId(name);
-    const forceUpdate = useForceUpdate();
+    const uniqId = useUniqId(HOOK_NAME);
+    const refreshSchedule = useRef();
+    const {
+      STRINGS
+    } = useLocalization();
     const {
       sdk,
       currentUser
     } = useSendbirdChat();
     const {
-      activeChannel
-    } = useActiveGroupChannel(sdk, channel);
+      openMenu
+    } = useActionMenu();
     const {
-      STRINGS
-    } = useLocalization();
-    useChannelHandler(sdk, `${name}_${uniqId}`, {
-      // Note: Removed from v4
-      // onUserEntered(channel) {
-      //   if (channel.url === activeChannel.url) forceUpdate();
-      // },
-      onUserLeft(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
-      },
-
-      onUserJoined(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
-      },
-
-      onUserUnmuted(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
-      },
-
-      onUserUnbanned(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
+      show
+    } = useUserProfile();
+    const {
+      users,
+      refresh,
+      loading,
+      next,
+      error,
+      upsertUser,
+      deleteUser
+    } = useUserList(sdk, {
+      queryCreator: () => channel.createMemberListQuery({
+        limit: 20
+      })
+    });
+    useChannelHandler(sdk, `${HOOK_NAME}_${uniqId}`, {
+      onUserLeft(eventChannel, user) {
+        if (isDifferentChannel(eventChannel, channel)) return;
+        deleteUser(user.userId);
       },
 
-      onUserBanned(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
+      onUserBanned(eventChannel, user) {
+        if (isDifferentChannel(eventChannel, channel)) return;
+        deleteUser(user.userId);
       },
 
-      onUserMuted(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
+      onOperatorUpdated(eventChannel) {
+        if (isDifferentChannel(eventChannel, channel)) return;
+        if (refreshSchedule.current) clearTimeout(refreshSchedule.current);
+        refreshSchedule.current = setTimeout(() => refresh(), 500);
       },
 
-      onChannelMemberCountChanged(channels) {
-        if (channels.find(c => c.url === channel.url)) forceUpdate();
-      },
+      onUserMuted(eventChannel, user) {
+        if (isDifferentChannel(eventChannel, channel) || !eventChannel.isGroupChannel()) return;
+        const memberFromChannel = eventChannel.members.find(it => it.userId === user.userId);
+        if (memberFromChannel) return upsertUser(memberFromChannel);
+        const memberFromList = users.find(it => it.userId === user.userId);
 
-      onChannelChanged(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
+        if (memberFromList) {
+          memberFromList.isMuted = true;
+          upsertUser(memberFromList);
+        }
       },
 
-      onChannelFrozen(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
-      },
+      onUserUnmuted(eventChannel, user) {
+        if (isDifferentChannel(eventChannel, channel) || !eventChannel.isGroupChannel()) return;
+        const memberFromChannel = eventChannel.members.find(it => it.userId === user.userId);
+        if (memberFromChannel) return upsertUser(memberFromChannel);
+        const memberFromList = users.find(it => it.userId === user.userId);
 
-      onChannelUnfrozen(channel) {
-        if (channel.url === activeChannel.url) forceUpdate();
+        if (memberFromList) {
+          memberFromList.isMuted = false;
+          upsertUser(memberFromList);
+        }
       }
 
     });
 
-    const _renderUser = useCallback((user, selectedUsers, setSelectedUsers) => {
+    const _renderUser = useFreshCallback((user, selectedUsers, setSelectedUsers) => {
       if (renderUser) return renderUser(user, selectedUsers, setSelectedUsers);
       return /*#__PURE__*/React.createElement(UserActionBar, {
         muted: user.isMuted,
         uri: user.profileUrl,
-        label: user.role === 'operator' ? STRINGS.GROUP_CHANNEL_MEMBERS.USER_BAR_OPERATOR : '',
-        name: (user.nickname || STRINGS.LABELS.USER_NO_NAME) + (user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) ? STRINGS.GROUP_CHANNEL_MEMBERS.USER_BAR_ME_POSTFIX : ''),
-        disabled: user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) // TODO: implement ban/mute actions, use channel.members with handlers instead member query
-        ,
-        onPressActionMenu: undefined
+        label: user.role === 'operator' ? STRINGS.LABELS.USER_BAR_OPERATOR : '',
+        name: (user.nickname || STRINGS.LABELS.USER_NO_NAME) + (user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) ? STRINGS.LABELS.USER_BAR_ME_POSTFIX : ''),
+        disabled: user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId),
+        onPressActionMenu: ifOperator(channel.myRole, () => {
+          const menuItems = [];
+          menuItems.push({
+            title: ifOperator(user.role, STRINGS.LABELS.UNREGISTER_OPERATOR, STRINGS.LABELS.REGISTER_AS_OPERATOR),
+            onPress: ifOperator(user.role, () => channel.removeOperators([user.userId]), () => channel.addOperators([user.userId]))
+          });
+
+          if (!channel.isBroadcast) {
+            menuItems.push({
+              title: ifMuted(user.isMuted, STRINGS.LABELS.UNMUTE, STRINGS.LABELS.MUTE),
+              onPress: ifMuted(user.isMuted, () => channel.unmuteUser(user), () => channel.muteUser(user))
+            });
+          }
+
+          menuItems.push({
+            title: STRINGS.LABELS.BAN,
+            style: 'destructive',
+            onPress: () => channel.banUser(user)
+          });
+          openMenu({
+            title: user.nickname || STRINGS.LABELS.USER_NO_NAME,
+            menuItems
+          });
+        }),
+        onPressAvatar: () => show(user)
       });
-    }, [renderUser]);
+    });
 
     return /*#__PURE__*/React.createElement(UserListModule.Provider, {
       headerRight: noop,
@@ -101,12 +137,19 @@ const createGroupChannelMembersFragment = initModule => {
         icon: 'plus'
       }),
       onPressHeaderRight: async () => onPressHeaderRight()
-    }), /*#__PURE__*/React.createElement(UserListModule.List, {
-      users: activeChannel.members,
+    }), /*#__PURE__*/React.createElement(StatusComposition, {
+      loading: loading,
+      LoadingComponent: /*#__PURE__*/React.createElement(UserListModule.StatusLoading, null),
+      error: Boolean(error),
+      ErrorComponent: /*#__PURE__*/React.createElement(UserListModule.StatusError, {
+        onPressRetry: refresh
+      })
+    }, /*#__PURE__*/React.createElement(UserListModule.List, {
+      users: users,
       renderUser: _renderUser,
-      onLoadNext: async () => void 0,
+      onLoadNext: next,
       ListEmptyComponent: /*#__PURE__*/React.createElement(UserListModule.StatusEmpty, null)
-    }));
+    })));
   };
 };
 

package/lib/module/fragments/createGroupChannelMembersFragment.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useActiveGroupChannel","useChannelHandler","Icon","useForceUpdate","useUniqId","UserActionBar","createUserListModule","useLocalization","useSendbirdChat","noop","name","createGroupChannelMembersFragment","initModule","UserListModule","channel","onPressHeaderLeft","onPressHeaderRight","renderUser","uniqId","forceUpdate","sdk","currentUser","activeChannel","STRINGS","onUserLeft","url","onUserJoined","onUserUnmuted","onUserUnbanned","onUserBanned","onUserMuted","onChannelMemberCountChanged","channels","find","c","onChannelChanged","onChannelFrozen","onChannelUnfrozen","_renderUser","user","selectedUsers","setSelectedUsers","isMuted","profileUrl","role","GROUP_CHANNEL_MEMBERS","USER_BAR_OPERATOR","nickname","LABELS","USER_NO_NAME","userId","USER_BAR_ME_POSTFIX","undefined","HEADER_TITLE","members"],"sources":["createGroupChannelMembersFragment.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport { useActiveGroupChannel, useChannelHandler } from '@sendbird/uikit-chat-hooks';\nimport { Icon } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdMember } from '@sendbird/uikit-utils';\nimport { useForceUpdate, useUniqId } from '@sendbird/uikit-utils';\n\nimport UserActionBar from '../components/UserActionBar';\nimport type { GroupChannelMembersFragment } from '../domain/groupChannelUserList/types';\nimport createUserListModule from '../domain/userList/module/createUserListModule';\nimport type { UserListModule } from '../domain/userList/types';\nimport { useLocalization, useSendbirdChat } from '../hooks/useContext';\n\nconst noop = () => '';\nconst name = 'createGroupChannelMembersFragment';\nconst createGroupChannelMembersFragment = (\n  initModule?: Partial<UserListModule<SendbirdMember>>,\n): GroupChannelMembersFragment<SendbirdMember> => {\n  const UserListModule = createUserListModule<SendbirdMember>(initModule);\n\n  return ({ channel, onPressHeaderLeft, onPressHeaderRight, renderUser }) => {\n    const uniqId = useUniqId(name);\n    const forceUpdate = useForceUpdate();\n    const { sdk, currentUser } = useSendbirdChat();\n    const { activeChannel } = useActiveGroupChannel(sdk, channel);\n\n    const { STRINGS } = useLocalization();\n\n    useChannelHandler(sdk, `${name}_${uniqId}`, {\n      // Note: Removed from v4\n      // onUserEntered(channel) {\n      //   if (channel.url === activeChannel.url) forceUpdate();\n      // },\n      onUserLeft(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n      onUserJoined(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n      onUserUnmuted(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n      onUserUnbanned(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n      onUserBanned(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n      onUserMuted(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n      onChannelMemberCountChanged(channels) {\n        if (channels.find((c) => c.url === channel.url)) forceUpdate();\n      },\n      onChannelChanged(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n      onChannelFrozen(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n      onChannelUnfrozen(channel) {\n        if (channel.url === activeChannel.url) forceUpdate();\n      },\n    });\n\n    const _renderUser: NonNullable<typeof renderUser> = useCallback(\n      (user, selectedUsers, setSelectedUsers) => {\n        if (renderUser) return renderUser(user, selectedUsers, setSelectedUsers);\n\n        return (\n          <UserActionBar\n            muted={user.isMuted}\n            uri={user.profileUrl}\n            label={user.role === 'operator' ? STRINGS.GROUP_CHANNEL_MEMBERS.USER_BAR_OPERATOR : ''}\n            name={\n              (user.nickname || STRINGS.LABELS.USER_NO_NAME) +\n              (user.userId === currentUser?.userId ? STRINGS.GROUP_CHANNEL_MEMBERS.USER_BAR_ME_POSTFIX : '')\n            }\n            disabled={user.userId === currentUser?.userId}\n            // TODO: implement ban/mute actions, use channel.members with handlers instead member query\n            onPressActionMenu={undefined}\n          />\n        );\n      },\n      [renderUser],\n    );\n\n    return (\n      <UserListModule.Provider headerRight={noop} headerTitle={STRINGS.GROUP_CHANNEL_MEMBERS.HEADER_TITLE}>\n        <UserListModule.Header\n          shouldActivateHeaderRight={() => true}\n          onPressHeaderLeft={onPressHeaderLeft}\n          right={<Icon icon={'plus'} />}\n          onPressHeaderRight={async () => onPressHeaderRight()}\n        />\n\n        <UserListModule.List\n          users={activeChannel.members}\n          renderUser={_renderUser}\n          onLoadNext={async () => void 0}\n          ListEmptyComponent={<UserListModule.StatusEmpty />}\n        />\n      </UserListModule.Provider>\n    );\n  };\n};\n\nexport default createGroupChannelMembersFragment;\n"],"mappings":"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"}
+{"version":3,"names":["React","useRef","useChannelHandler","useUserList","Icon","useActionMenu","ifMuted","ifOperator","isDifferentChannel","useFreshCallback","useUniqId","StatusComposition","UserActionBar","createUserListModule","useLocalization","useSendbirdChat","useUserProfile","noop","HOOK_NAME","createGroupChannelMembersFragment","initModule","UserListModule","channel","onPressHeaderLeft","onPressHeaderRight","renderUser","uniqId","refreshSchedule","STRINGS","sdk","currentUser","openMenu","show","users","refresh","loading","next","error","upsertUser","deleteUser","queryCreator","createMemberListQuery","limit","onUserLeft","eventChannel","user","userId","onUserBanned","onOperatorUpdated","current","clearTimeout","setTimeout","onUserMuted","isGroupChannel","memberFromChannel","members","find","it","memberFromList","isMuted","onUserUnmuted","_renderUser","selectedUsers","setSelectedUsers","profileUrl","role","LABELS","USER_BAR_OPERATOR","nickname","USER_NO_NAME","USER_BAR_ME_POSTFIX","myRole","menuItems","push","title","UNREGISTER_OPERATOR","REGISTER_AS_OPERATOR","onPress","removeOperators","addOperators","isBroadcast","UNMUTE","MUTE","unmuteUser","muteUser","BAN","style","banUser","GROUP_CHANNEL_MEMBERS","HEADER_TITLE","Boolean"],"sources":["createGroupChannelMembersFragment.tsx"],"sourcesContent":["import React, { useRef } from 'react';\n\nimport { useChannelHandler, useUserList } from '@sendbird/uikit-chat-hooks';\nimport type { ActionMenuItem } from '@sendbird/uikit-react-native-foundation';\nimport { Icon, useActionMenu } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdMember } from '@sendbird/uikit-utils';\nimport { ifMuted, ifOperator, isDifferentChannel, useFreshCallback, useUniqId } from '@sendbird/uikit-utils';\n\nimport StatusComposition from '../components/StatusComposition';\nimport UserActionBar from '../components/UserActionBar';\nimport type { GroupChannelMembersFragment } from '../domain/groupChannelUserList/types';\nimport createUserListModule from '../domain/userList/module/createUserListModule';\nimport type { UserListModule } from '../domain/userList/types';\nimport { useLocalization, useSendbirdChat, useUserProfile } from '../hooks/useContext';\n\nconst noop = () => '';\nconst HOOK_NAME = 'createGroupChannelMembersFragment';\nconst createGroupChannelMembersFragment = (\n  initModule?: Partial<UserListModule<SendbirdMember>>,\n): GroupChannelMembersFragment<SendbirdMember> => {\n  const UserListModule = createUserListModule<SendbirdMember>(initModule);\n\n  return ({ channel, onPressHeaderLeft, onPressHeaderRight, renderUser }) => {\n    const uniqId = useUniqId(HOOK_NAME);\n\n    const refreshSchedule = useRef<NodeJS.Timeout>();\n    const { STRINGS } = useLocalization();\n    const { sdk, currentUser } = useSendbirdChat();\n    const { openMenu } = useActionMenu();\n    const { show } = useUserProfile();\n\n    const { users, refresh, loading, next, error, upsertUser, deleteUser } = useUserList(sdk, {\n      queryCreator: () => channel.createMemberListQuery({ limit: 20 }),\n    });\n\n    useChannelHandler(sdk, `${HOOK_NAME}_${uniqId}`, {\n      onUserLeft(eventChannel, user) {\n        if (isDifferentChannel(eventChannel, channel)) return;\n        deleteUser(user.userId);\n      },\n      onUserBanned(eventChannel, user) {\n        if (isDifferentChannel(eventChannel, channel)) return;\n        deleteUser(user.userId);\n      },\n      onOperatorUpdated(eventChannel) {\n        if (isDifferentChannel(eventChannel, channel)) return;\n        if (refreshSchedule.current) clearTimeout(refreshSchedule.current);\n        refreshSchedule.current = setTimeout(() => refresh(), 500);\n      },\n      onUserMuted(eventChannel, user) {\n        if (isDifferentChannel(eventChannel, channel) || !eventChannel.isGroupChannel()) return;\n\n        const memberFromChannel = eventChannel.members.find((it) => it.userId === user.userId);\n        if (memberFromChannel) return upsertUser(memberFromChannel);\n\n        const memberFromList = users.find((it) => it.userId === user.userId);\n        if (memberFromList) {\n          memberFromList.isMuted = true;\n          upsertUser(memberFromList);\n        }\n      },\n      onUserUnmuted(eventChannel, user) {\n        if (isDifferentChannel(eventChannel, channel) || !eventChannel.isGroupChannel()) return;\n\n        const memberFromChannel = eventChannel.members.find((it) => it.userId === user.userId);\n        if (memberFromChannel) return upsertUser(memberFromChannel);\n\n        const memberFromList = users.find((it) => it.userId === user.userId);\n        if (memberFromList) {\n          memberFromList.isMuted = false;\n          upsertUser(memberFromList);\n        }\n      },\n    });\n\n    const _renderUser: NonNullable<typeof renderUser> = useFreshCallback((user, selectedUsers, setSelectedUsers) => {\n      if (renderUser) return renderUser(user, selectedUsers, setSelectedUsers);\n\n      return (\n        <UserActionBar\n          muted={user.isMuted}\n          uri={user.profileUrl}\n          label={user.role === 'operator' ? STRINGS.LABELS.USER_BAR_OPERATOR : ''}\n          name={\n            (user.nickname || STRINGS.LABELS.USER_NO_NAME) +\n            (user.userId === currentUser?.userId ? STRINGS.LABELS.USER_BAR_ME_POSTFIX : '')\n          }\n          disabled={user.userId === currentUser?.userId}\n          onPressActionMenu={ifOperator(channel.myRole, () => {\n            const menuItems: ActionMenuItem['menuItems'] = [];\n\n            menuItems.push({\n              title: ifOperator(user.role, STRINGS.LABELS.UNREGISTER_OPERATOR, STRINGS.LABELS.REGISTER_AS_OPERATOR),\n              onPress: ifOperator(\n                user.role,\n                () => channel.removeOperators([user.userId]),\n                () => channel.addOperators([user.userId]),\n              ),\n            });\n\n            if (!channel.isBroadcast) {\n              menuItems.push({\n                title: ifMuted(user.isMuted, STRINGS.LABELS.UNMUTE, STRINGS.LABELS.MUTE),\n                onPress: ifMuted(\n                  user.isMuted,\n                  () => channel.unmuteUser(user),\n                  () => channel.muteUser(user),\n                ),\n              });\n            }\n\n            menuItems.push({\n              title: STRINGS.LABELS.BAN,\n              style: 'destructive',\n              onPress: () => channel.banUser(user),\n            });\n\n            openMenu({ title: user.nickname || STRINGS.LABELS.USER_NO_NAME, menuItems });\n          })}\n          onPressAvatar={() => show(user)}\n        />\n      );\n    });\n\n    return (\n      <UserListModule.Provider headerRight={noop} headerTitle={STRINGS.GROUP_CHANNEL_MEMBERS.HEADER_TITLE}>\n        <UserListModule.Header\n          shouldActivateHeaderRight={() => true}\n          onPressHeaderLeft={onPressHeaderLeft}\n          right={<Icon icon={'plus'} />}\n          onPressHeaderRight={async () => onPressHeaderRight()}\n        />\n        <StatusComposition\n          loading={loading}\n          LoadingComponent={<UserListModule.StatusLoading />}\n          error={Boolean(error)}\n          ErrorComponent={<UserListModule.StatusError onPressRetry={refresh} />}\n        >\n          <UserListModule.List\n            users={users}\n            renderUser={_renderUser}\n            onLoadNext={next}\n            ListEmptyComponent={<UserListModule.StatusEmpty />}\n          />\n        </StatusComposition>\n      </UserListModule.Provider>\n    );\n  };\n};\n\nexport default createGroupChannelMembersFragment;\n"],"mappings":"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"}

package/lib/module/fragments/createGroupChannelModerationFragment.js

@@ -0,0 +1,53 @@
+import React from 'react';
+import { ScrollView } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
+import { NOOP } from '@sendbird/uikit-utils';
+import { createGroupChannelModerationModule } from '../domain/groupChannelModeration';
+
+const createGroupChannelModerationFragment = initModule => {
+  const GroupChannelModerationModule = createGroupChannelModerationModule(initModule);
+  return _ref => {
+    let {
+      channel,
+      onPressHeaderLeft = NOOP,
+      onPressMenuBannedUsers,
+      onPressMenuMutedMembers,
+      onPressMenuOperators,
+      menuItemsCreator
+    } = _ref;
+    const {
+      left,
+      right
+    } = useSafeAreaInsets();
+    const {
+      colors
+    } = useUIKitTheme();
+    return /*#__PURE__*/React.createElement(GroupChannelModerationModule.Provider, {
+      channel: channel
+    }, /*#__PURE__*/React.createElement(GroupChannelModerationModule.Header, {
+      onPressHeaderLeft: onPressHeaderLeft
+    }), /*#__PURE__*/React.createElement(ScrollView, {
+      style: {
+        backgroundColor: colors.background
+      },
+      contentContainerStyle: {
+        paddingLeft: left + styles.viewContainer.paddingHorizontal,
+        paddingRight: right + styles.viewContainer.paddingHorizontal
+      }
+    }, /*#__PURE__*/React.createElement(GroupChannelModerationModule.Menu, {
+      onPressMenuBannedUsers: onPressMenuBannedUsers,
+      onPressMenuMutedMembers: onPressMenuMutedMembers,
+      onPressMenuOperators: onPressMenuOperators,
+      menuItemsCreator: menuItemsCreator
+    })));
+  };
+};
+
+const styles = createStyleSheet({
+  viewContainer: {
+    paddingHorizontal: 16
+  }
+});
+export default createGroupChannelModerationFragment;
+//# sourceMappingURL=createGroupChannelModerationFragment.js.map

package/lib/module/fragments/createGroupChannelModerationFragment.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ScrollView","useSafeAreaInsets","createStyleSheet","useUIKitTheme","NOOP","createGroupChannelModerationModule","createGroupChannelModerationFragment","initModule","GroupChannelModerationModule","channel","onPressHeaderLeft","onPressMenuBannedUsers","onPressMenuMutedMembers","onPressMenuOperators","menuItemsCreator","left","right","colors","backgroundColor","background","paddingLeft","styles","viewContainer","paddingHorizontal","paddingRight"],"sources":["createGroupChannelModerationFragment.tsx"],"sourcesContent":["import React from 'react';\nimport { ScrollView } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport { createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { NOOP } from '@sendbird/uikit-utils';\n\nimport { createGroupChannelModerationModule } from '../domain/groupChannelModeration';\nimport type {\n  GroupChannelModerationFragment,\n  GroupChannelModerationModule,\n} from '../domain/groupChannelModeration/types';\n\nconst createGroupChannelModerationFragment = (\n  initModule?: Partial<GroupChannelModerationModule>,\n): GroupChannelModerationFragment => {\n  const GroupChannelModerationModule = createGroupChannelModerationModule(initModule);\n\n  return ({\n    channel,\n    onPressHeaderLeft = NOOP,\n    onPressMenuBannedUsers,\n    onPressMenuMutedMembers,\n    onPressMenuOperators,\n    menuItemsCreator,\n  }) => {\n    const { left, right } = useSafeAreaInsets();\n    const { colors } = useUIKitTheme();\n    return (\n      <GroupChannelModerationModule.Provider channel={channel}>\n        <GroupChannelModerationModule.Header onPressHeaderLeft={onPressHeaderLeft} />\n        <ScrollView\n          style={{ backgroundColor: colors.background }}\n          contentContainerStyle={{\n            paddingLeft: left + styles.viewContainer.paddingHorizontal,\n            paddingRight: right + styles.viewContainer.paddingHorizontal,\n          }}\n        >\n          <GroupChannelModerationModule.Menu\n            onPressMenuBannedUsers={onPressMenuBannedUsers}\n            onPressMenuMutedMembers={onPressMenuMutedMembers}\n            onPressMenuOperators={onPressMenuOperators}\n            menuItemsCreator={menuItemsCreator}\n          />\n        </ScrollView>\n      </GroupChannelModerationModule.Provider>\n    );\n  };\n};\n\nconst styles = createStyleSheet({\n  viewContainer: {\n    paddingHorizontal: 16,\n  },\n});\n\nexport default createGroupChannelModerationFragment;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,SAASC,iBAAT,QAAkC,gCAAlC;AAEA,SAASC,gBAAT,EAA2BC,aAA3B,QAAgD,yCAAhD;AACA,SAASC,IAAT,QAAqB,uBAArB;AAEA,SAASC,kCAAT,QAAmD,kCAAnD;;AAMA,MAAMC,oCAAoC,GACxCC,UAD2C,IAER;EACnC,MAAMC,4BAA4B,GAAGH,kCAAkC,CAACE,UAAD,CAAvE;EAEA,OAAO,QAOD;IAAA,IAPE;MACNE,OADM;MAENC,iBAAiB,GAAGN,IAFd;MAGNO,sBAHM;MAINC,uBAJM;MAKNC,oBALM;MAMNC;IANM,CAOF;IACJ,MAAM;MAAEC,IAAF;MAAQC;IAAR,IAAkBf,iBAAiB,EAAzC;IACA,MAAM;MAAEgB;IAAF,IAAad,aAAa,EAAhC;IACA,oBACE,oBAAC,4BAAD,CAA8B,QAA9B;MAAuC,OAAO,EAAEM;IAAhD,gBACE,oBAAC,4BAAD,CAA8B,MAA9B;MAAqC,iBAAiB,EAAEC;IAAxD,EADF,eAEE,oBAAC,UAAD;MACE,KAAK,EAAE;QAAEQ,eAAe,EAAED,MAAM,CAACE;MAA1B,CADT;MAEE,qBAAqB,EAAE;QACrBC,WAAW,EAAEL,IAAI,GAAGM,MAAM,CAACC,aAAP,CAAqBC,iBADpB;QAErBC,YAAY,EAAER,KAAK,GAAGK,MAAM,CAACC,aAAP,CAAqBC;MAFtB;IAFzB,gBAOE,oBAAC,4BAAD,CAA8B,IAA9B;MACE,sBAAsB,EAAEZ,sBAD1B;MAEE,uBAAuB,EAAEC,uBAF3B;MAGE,oBAAoB,EAAEC,oBAHxB;MAIE,gBAAgB,EAAEC;IAJpB,EAPF,CAFF,CADF;EAmBD,CA7BD;AA8BD,CAnCD;;AAqCA,MAAMO,MAAM,GAAGnB,gBAAgB,CAAC;EAC9BoB,aAAa,EAAE;IACbC,iBAAiB,EAAE;EADN;AADe,CAAD,CAA/B;AAMA,eAAejB,oCAAf"}

package/lib/module/fragments/createGroupChannelMutedMembersFragment.js

@@ -0,0 +1,98 @@
+import React from 'react';
+import { useChannelHandler, useUserList } from '@sendbird/uikit-chat-hooks';
+import { useActionMenu } from '@sendbird/uikit-react-native-foundation';
+import { NOOP, isDifferentChannel, useFreshCallback, useUniqId } from '@sendbird/uikit-utils';
+import StatusComposition from '../components/StatusComposition';
+import UserActionBar from '../components/UserActionBar';
+import { createGroupChannelMutedMembersModule } from '../domain/groupChannelMutedMembers';
+import { useLocalization, useSendbirdChat } from '../hooks/useContext';
+const HOOK_NAME = 'createGroupChannelMutedMembersFragment';
+
+const createGroupChannelMutedMembersFragment = initModule => {
+  const GroupChannelMutedMembersModule = createGroupChannelMutedMembersModule(initModule);
+  return _ref => {
+    let {
+      onPressHeaderLeft = NOOP,
+      channel,
+      renderUser
+    } = _ref;
+    const uniqId = useUniqId(HOOK_NAME);
+    const {
+      STRINGS
+    } = useLocalization();
+    const {
+      sdk,
+      currentUser
+    } = useSendbirdChat();
+    const {
+      openMenu
+    } = useActionMenu();
+    const {
+      users,
+      deleteUser,
+      loading,
+      refresh,
+      error,
+      next
+    } = useUserList(sdk, {
+      queryCreator: () => channel.createMutedUserListQuery({
+        limit: 20
+      })
+    });
+    useChannelHandler(sdk, `${HOOK_NAME}_${uniqId}`, {
+      onUserLeft(eventChannel, user) {
+        if (isDifferentChannel(eventChannel, channel)) return;
+        deleteUser(user.userId);
+      },
+
+      onUserBanned(eventChannel, user) {
+        if (isDifferentChannel(eventChannel, channel)) return;
+        deleteUser(user.userId);
+      }
+
+    });
+
+    const _renderUser = useFreshCallback(props => {
+      if (renderUser) return renderUser(props);
+      const {
+        user
+      } = props;
+      return /*#__PURE__*/React.createElement(UserActionBar, {
+        muted: true,
+        uri: user.profileUrl,
+        name: (user.nickname || STRINGS.LABELS.USER_NO_NAME) + (user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) ? STRINGS.LABELS.USER_BAR_ME_POSTFIX : ''),
+        disabled: user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId),
+        onPressActionMenu: () => {
+          openMenu({
+            title: user.nickname || STRINGS.LABELS.USER_NO_NAME,
+            menuItems: [{
+              title: STRINGS.LABELS.UNMUTE,
+              onPress: () => channel.unmuteUser(user).then(() => deleteUser(user.userId))
+            }]
+          });
+        }
+      });
+    });
+
+    return /*#__PURE__*/React.createElement(GroupChannelMutedMembersModule.Provider, {
+      channel: channel
+    }, /*#__PURE__*/React.createElement(GroupChannelMutedMembersModule.Header, {
+      onPressHeaderLeft: onPressHeaderLeft
+    }), /*#__PURE__*/React.createElement(StatusComposition, {
+      loading: loading,
+      LoadingComponent: /*#__PURE__*/React.createElement(GroupChannelMutedMembersModule.StatusLoading, null),
+      error: Boolean(error),
+      ErrorComponent: /*#__PURE__*/React.createElement(GroupChannelMutedMembersModule.StatusError, {
+        onPressRetry: refresh
+      })
+    }, /*#__PURE__*/React.createElement(GroupChannelMutedMembersModule.List, {
+      mutedMembers: users,
+      onLoadNext: next,
+      renderUser: _renderUser,
+      ListEmptyComponent: /*#__PURE__*/React.createElement(GroupChannelMutedMembersModule.StatusEmpty, null)
+    })));
+  };
+};
+
+export default createGroupChannelMutedMembersFragment;
+//# sourceMappingURL=createGroupChannelMutedMembersFragment.js.map

package/lib/module/fragments/createGroupChannelMutedMembersFragment.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useChannelHandler","useUserList","useActionMenu","NOOP","isDifferentChannel","useFreshCallback","useUniqId","StatusComposition","UserActionBar","createGroupChannelMutedMembersModule","useLocalization","useSendbirdChat","HOOK_NAME","createGroupChannelMutedMembersFragment","initModule","GroupChannelMutedMembersModule","onPressHeaderLeft","channel","renderUser","uniqId","STRINGS","sdk","currentUser","openMenu","users","deleteUser","loading","refresh","error","next","queryCreator","createMutedUserListQuery","limit","onUserLeft","eventChannel","user","userId","onUserBanned","_renderUser","props","profileUrl","nickname","LABELS","USER_NO_NAME","USER_BAR_ME_POSTFIX","title","menuItems","UNMUTE","onPress","unmuteUser","then","Boolean"],"sources":["createGroupChannelMutedMembersFragment.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useChannelHandler, useUserList } from '@sendbird/uikit-chat-hooks';\nimport { useActionMenu } from '@sendbird/uikit-react-native-foundation';\nimport { NOOP, isDifferentChannel, useFreshCallback, useUniqId } from '@sendbird/uikit-utils';\n\nimport StatusComposition from '../components/StatusComposition';\nimport UserActionBar from '../components/UserActionBar';\nimport { createGroupChannelMutedMembersModule } from '../domain/groupChannelMutedMembers';\nimport type {\n  GroupChannelMutedMembersFragment,\n  GroupChannelMutedMembersModule,\n} from '../domain/groupChannelMutedMembers/types';\nimport { useLocalization, useSendbirdChat } from '../hooks/useContext';\n\nconst HOOK_NAME = 'createGroupChannelMutedMembersFragment';\nconst createGroupChannelMutedMembersFragment = (\n  initModule?: Partial<GroupChannelMutedMembersModule>,\n): GroupChannelMutedMembersFragment => {\n  const GroupChannelMutedMembersModule = createGroupChannelMutedMembersModule(initModule);\n\n  return ({ onPressHeaderLeft = NOOP, channel, renderUser }) => {\n    const uniqId = useUniqId(HOOK_NAME);\n\n    const { STRINGS } = useLocalization();\n    const { sdk, currentUser } = useSendbirdChat();\n    const { openMenu } = useActionMenu();\n\n    const { users, deleteUser, loading, refresh, error, next } = useUserList(sdk, {\n      queryCreator: () => channel.createMutedUserListQuery({ limit: 20 }),\n    });\n\n    useChannelHandler(sdk, `${HOOK_NAME}_${uniqId}`, {\n      onUserLeft(eventChannel, user) {\n        if (isDifferentChannel(eventChannel, channel)) return;\n        deleteUser(user.userId);\n      },\n      onUserBanned(eventChannel, user) {\n        if (isDifferentChannel(eventChannel, channel)) return;\n        deleteUser(user.userId);\n      },\n    });\n\n    const _renderUser: NonNullable<typeof renderUser> = useFreshCallback((props) => {\n      if (renderUser) return renderUser(props);\n\n      const { user } = props;\n      return (\n        <UserActionBar\n          muted\n          uri={user.profileUrl}\n          name={\n            (user.nickname || STRINGS.LABELS.USER_NO_NAME) +\n            (user.userId === currentUser?.userId ? STRINGS.LABELS.USER_BAR_ME_POSTFIX : '')\n          }\n          disabled={user.userId === currentUser?.userId}\n          onPressActionMenu={() => {\n            openMenu({\n              title: user.nickname || STRINGS.LABELS.USER_NO_NAME,\n              menuItems: [\n                {\n                  title: STRINGS.LABELS.UNMUTE,\n                  onPress: () => channel.unmuteUser(user).then(() => deleteUser(user.userId)),\n                },\n              ],\n            });\n          }}\n        />\n      );\n    });\n\n    return (\n      <GroupChannelMutedMembersModule.Provider channel={channel}>\n        <GroupChannelMutedMembersModule.Header onPressHeaderLeft={onPressHeaderLeft} />\n        <StatusComposition\n          loading={loading}\n          LoadingComponent={<GroupChannelMutedMembersModule.StatusLoading />}\n          error={Boolean(error)}\n          ErrorComponent={<GroupChannelMutedMembersModule.StatusError onPressRetry={refresh} />}\n        >\n          <GroupChannelMutedMembersModule.List\n            mutedMembers={users}\n            onLoadNext={next}\n            renderUser={_renderUser}\n            ListEmptyComponent={<GroupChannelMutedMembersModule.StatusEmpty />}\n          />\n        </StatusComposition>\n      </GroupChannelMutedMembersModule.Provider>\n    );\n  };\n};\n\nexport default createGroupChannelMutedMembersFragment;\n"],"mappings":"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"}

package/lib/module/fragments/createGroupChannelNotificationsFragment.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { NOOP } from '@sendbird/uikit-utils';
+import { createGroupChannelNotificationsModule } from '../domain/groupChannelNotifications';
+
+const createGroupChannelNotificationsFragment = initModule => {
+  const GroupChannelNotificationsModule = createGroupChannelNotificationsModule(initModule);
+  return _ref => {
+    let {
+      onPressHeaderLeft = NOOP,
+      children,
+      channel
+    } = _ref;
+    return /*#__PURE__*/React.createElement(GroupChannelNotificationsModule.Provider, {
+      channel: channel
+    }, /*#__PURE__*/React.createElement(GroupChannelNotificationsModule.Header, {
+      onPressHeaderLeft: onPressHeaderLeft
+    }), /*#__PURE__*/React.createElement(GroupChannelNotificationsModule.View, null), children);
+  };
+};
+
+export default createGroupChannelNotificationsFragment;
+//# sourceMappingURL=createGroupChannelNotificationsFragment.js.map

package/lib/module/fragments/createGroupChannelNotificationsFragment.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","NOOP","createGroupChannelNotificationsModule","createGroupChannelNotificationsFragment","initModule","GroupChannelNotificationsModule","onPressHeaderLeft","children","channel"],"sources":["createGroupChannelNotificationsFragment.tsx"],"sourcesContent":["import React from 'react';\n\nimport { NOOP } from '@sendbird/uikit-utils';\n\nimport { createGroupChannelNotificationsModule } from '../domain/groupChannelNotifications';\nimport type {\n  GroupChannelNotificationsFragment,\n  GroupChannelNotificationsModule,\n} from '../domain/groupChannelNotifications/types';\n\nconst createGroupChannelNotificationsFragment = (\n  initModule?: Partial<GroupChannelNotificationsModule>,\n): GroupChannelNotificationsFragment => {\n  const GroupChannelNotificationsModule = createGroupChannelNotificationsModule(initModule);\n\n  return ({ onPressHeaderLeft = NOOP, children, channel }) => {\n    return (\n      <GroupChannelNotificationsModule.Provider channel={channel}>\n        <GroupChannelNotificationsModule.Header onPressHeaderLeft={onPressHeaderLeft} />\n        <GroupChannelNotificationsModule.View />\n        {children}\n      </GroupChannelNotificationsModule.Provider>\n    );\n  };\n};\n\nexport default createGroupChannelNotificationsFragment;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,IAAT,QAAqB,uBAArB;AAEA,SAASC,qCAAT,QAAsD,qCAAtD;;AAMA,MAAMC,uCAAuC,GAC3CC,UAD8C,IAER;EACtC,MAAMC,+BAA+B,GAAGH,qCAAqC,CAACE,UAAD,CAA7E;EAEA,OAAO,QAAqD;IAAA,IAApD;MAAEE,iBAAiB,GAAGL,IAAtB;MAA4BM,QAA5B;MAAsCC;IAAtC,CAAoD;IAC1D,oBACE,oBAAC,+BAAD,CAAiC,QAAjC;MAA0C,OAAO,EAAEA;IAAnD,gBACE,oBAAC,+BAAD,CAAiC,MAAjC;MAAwC,iBAAiB,EAAEF;IAA3D,EADF,eAEE,oBAAC,+BAAD,CAAiC,IAAjC,OAFF,EAGGC,QAHH,CADF;EAOD,CARD;AASD,CAdD;;AAgBA,eAAeJ,uCAAf"}

package/lib/module/fragments/createGroupChannelOperatorsFragment.js

@@ -0,0 +1,111 @@
+import React from 'react';
+import { useChannelHandler, useUserList } from '@sendbird/uikit-chat-hooks';
+import { useActionMenu } from '@sendbird/uikit-react-native-foundation';
+import { ifOperator, isDifferentChannel, useFreshCallback, useUniqId } from '@sendbird/uikit-utils';
+import StatusComposition from '../components/StatusComposition';
+import UserActionBar from '../components/UserActionBar';
+import { createGroupChannelOperatorsModule } from '../domain/groupChannelOperators';
+import { useLocalization, useSendbirdChat, useUserProfile } from '../hooks/useContext';
+const name = 'createGroupChannelOperatorsFragment';
+
+const createGroupChannelOperatorsFragment = initModule => {
+  const GroupChannelOperatorsModule = createGroupChannelOperatorsModule(initModule);
+  return _ref => {
+    let {
+      channel,
+      onPressHeaderLeft,
+      onPressHeaderRight,
+      renderUser
+    } = _ref;
+    const uniqId = useUniqId(name);
+    const {
+      STRINGS
+    } = useLocalization();
+    const {
+      sdk,
+      currentUser
+    } = useSendbirdChat();
+    const {
+      openMenu
+    } = useActionMenu();
+    const {
+      show
+    } = useUserProfile();
+    const {
+      users,
+      deleteUser,
+      upsertUser,
+      loading,
+      refresh,
+      next,
+      error
+    } = useUserList(sdk, {
+      queryCreator: () => channel.createOperatorListQuery({
+        limit: 20
+      })
+    });
+    useChannelHandler(sdk, `${name}_${uniqId}`, {
+      onUserLeft(eventChannel, user) {
+        if (isDifferentChannel(eventChannel, channel)) return;
+        deleteUser(user.userId);
+      },
+
+      onUserBanned(eventChannel, user) {
+        if (isDifferentChannel(eventChannel, channel)) return;
+        deleteUser(user.userId);
+      },
+
+      onOperatorUpdated(eventChannel, updatedUsers) {
+        if (isDifferentChannel(eventChannel, channel)) return;
+        const operatorsAdded = users.length < updatedUsers.length;
+        if (operatorsAdded) updatedUsers.forEach(upsertUser);
+      }
+
+    });
+
+    const _renderUser = useFreshCallback(props => {
+      if (renderUser) return renderUser(props);
+      const {
+        user
+      } = props;
+      return /*#__PURE__*/React.createElement(UserActionBar, {
+        muted: false,
+        uri: user.profileUrl,
+        name: (user.nickname || STRINGS.LABELS.USER_NO_NAME) + (user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) ? STRINGS.LABELS.USER_BAR_ME_POSTFIX : ''),
+        disabled: user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId),
+        onPressAvatar: () => show(user),
+        onPressActionMenu: ifOperator(channel.myRole, () => {
+          openMenu({
+            title: user.nickname || STRINGS.LABELS.USER_NO_NAME,
+            menuItems: [{
+              title: STRINGS.LABELS.UNREGISTER_OPERATOR,
+              onPress: () => channel.removeOperators([user.userId]).then(() => deleteUser(user.userId))
+            }]
+          });
+        })
+      });
+    });
+
+    return /*#__PURE__*/React.createElement(GroupChannelOperatorsModule.Provider, {
+      channel: channel
+    }, /*#__PURE__*/React.createElement(GroupChannelOperatorsModule.Header, {
+      onPressHeaderLeft: onPressHeaderLeft,
+      onPressHeaderRight: onPressHeaderRight
+    }), /*#__PURE__*/React.createElement(StatusComposition, {
+      loading: loading,
+      LoadingComponent: /*#__PURE__*/React.createElement(GroupChannelOperatorsModule.StatusLoading, null),
+      error: Boolean(error),
+      ErrorComponent: /*#__PURE__*/React.createElement(GroupChannelOperatorsModule.StatusError, {
+        onPressRetry: refresh
+      })
+    }, /*#__PURE__*/React.createElement(GroupChannelOperatorsModule.List, {
+      operators: users,
+      renderUser: _renderUser,
+      onLoadNext: next,
+      ListEmptyComponent: /*#__PURE__*/React.createElement(GroupChannelOperatorsModule.StatusEmpty, null)
+    })));
+  };
+};
+
+export default createGroupChannelOperatorsFragment;
+//# sourceMappingURL=createGroupChannelOperatorsFragment.js.map

package/lib/module/fragments/createGroupChannelOperatorsFragment.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useChannelHandler","useUserList","useActionMenu","ifOperator","isDifferentChannel","useFreshCallback","useUniqId","StatusComposition","UserActionBar","createGroupChannelOperatorsModule","useLocalization","useSendbirdChat","useUserProfile","name","createGroupChannelOperatorsFragment","initModule","GroupChannelOperatorsModule","channel","onPressHeaderLeft","onPressHeaderRight","renderUser","uniqId","STRINGS","sdk","currentUser","openMenu","show","users","deleteUser","upsertUser","loading","refresh","next","error","queryCreator","createOperatorListQuery","limit","onUserLeft","eventChannel","user","userId","onUserBanned","onOperatorUpdated","updatedUsers","operatorsAdded","length","forEach","_renderUser","props","profileUrl","nickname","LABELS","USER_NO_NAME","USER_BAR_ME_POSTFIX","myRole","title","menuItems","UNREGISTER_OPERATOR","onPress","removeOperators","then","Boolean"],"sources":["createGroupChannelOperatorsFragment.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useChannelHandler, useUserList } from '@sendbird/uikit-chat-hooks';\nimport { useActionMenu } from '@sendbird/uikit-react-native-foundation';\nimport { ifOperator, isDifferentChannel, useFreshCallback, useUniqId } from '@sendbird/uikit-utils';\n\nimport StatusComposition from '../components/StatusComposition';\nimport UserActionBar from '../components/UserActionBar';\nimport { createGroupChannelOperatorsModule } from '../domain/groupChannelOperators';\nimport type { GroupChannelOperatorsFragment, GroupChannelOperatorsModule } from '../domain/groupChannelOperators/types';\nimport { useLocalization, useSendbirdChat, useUserProfile } from '../hooks/useContext';\n\nconst name = 'createGroupChannelOperatorsFragment';\nconst createGroupChannelOperatorsFragment = (\n  initModule?: Partial<GroupChannelOperatorsModule>,\n): GroupChannelOperatorsFragment => {\n  const GroupChannelOperatorsModule = createGroupChannelOperatorsModule(initModule);\n\n  return ({ channel, onPressHeaderLeft, onPressHeaderRight, renderUser }) => {\n    const uniqId = useUniqId(name);\n\n    const { STRINGS } = useLocalization();\n    const { sdk, currentUser } = useSendbirdChat();\n    const { openMenu } = useActionMenu();\n    const { show } = useUserProfile();\n\n    const { users, deleteUser, upsertUser, loading, refresh, next, error } = useUserList(sdk, {\n      queryCreator: () => channel.createOperatorListQuery({ limit: 20 }),\n    });\n\n    useChannelHandler(sdk, `${name}_${uniqId}`, {\n      onUserLeft(eventChannel, user) {\n        if (isDifferentChannel(eventChannel, channel)) return;\n        deleteUser(user.userId);\n      },\n      onUserBanned(eventChannel, user) {\n        if (isDifferentChannel(eventChannel, channel)) return;\n        deleteUser(user.userId);\n      },\n      onOperatorUpdated(eventChannel, updatedUsers) {\n        if (isDifferentChannel(eventChannel, channel)) return;\n        const operatorsAdded = users.length < updatedUsers.length;\n        if (operatorsAdded) updatedUsers.forEach(upsertUser);\n      },\n    });\n\n    const _renderUser: NonNullable<typeof renderUser> = useFreshCallback((props) => {\n      if (renderUser) return renderUser(props);\n\n      const { user } = props;\n      return (\n        <UserActionBar\n          muted={false}\n          uri={user.profileUrl}\n          name={\n            (user.nickname || STRINGS.LABELS.USER_NO_NAME) +\n            (user.userId === currentUser?.userId ? STRINGS.LABELS.USER_BAR_ME_POSTFIX : '')\n          }\n          disabled={user.userId === currentUser?.userId}\n          onPressAvatar={() => show(user)}\n          onPressActionMenu={ifOperator(channel.myRole, () => {\n            openMenu({\n              title: user.nickname || STRINGS.LABELS.USER_NO_NAME,\n              menuItems: [\n                {\n                  title: STRINGS.LABELS.UNREGISTER_OPERATOR,\n                  onPress: () => channel.removeOperators([user.userId]).then(() => deleteUser(user.userId)),\n                },\n              ],\n            });\n          })}\n        />\n      );\n    });\n\n    return (\n      <GroupChannelOperatorsModule.Provider channel={channel}>\n        <GroupChannelOperatorsModule.Header\n          onPressHeaderLeft={onPressHeaderLeft}\n          onPressHeaderRight={onPressHeaderRight}\n        />\n\n        <StatusComposition\n          loading={loading}\n          LoadingComponent={<GroupChannelOperatorsModule.StatusLoading />}\n          error={Boolean(error)}\n          ErrorComponent={<GroupChannelOperatorsModule.StatusError onPressRetry={refresh} />}\n        >\n          <GroupChannelOperatorsModule.List\n            operators={users}\n            renderUser={_renderUser}\n            onLoadNext={next}\n            ListEmptyComponent={<GroupChannelOperatorsModule.StatusEmpty />}\n          />\n        </StatusComposition>\n      </GroupChannelOperatorsModule.Provider>\n    );\n  };\n};\n\nexport default createGroupChannelOperatorsFragment;\n"],"mappings":"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"}