fix(core): re-naming GroupChannelInfo to GroupChannelSettings

packages/uikit-react-native-core/src/domain/groupChannelInfo/component/GroupChannelInfoHeader.tsx → packages/uikit-react-native-core/src/domain/groupChannelSettings/component/GroupChannelSettingsHeader.tsx

@@ -2,15 +2,15 @@ import React, { useContext } from 'react';
 
 import { Header as DefaultHeader, Icon, Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 
-import { GroupChannelInfoContext } from '../module/moduleContext';
-import type { GroupChannelInfoProps } from '../types';
+import { GroupChannelSettingsContext } from '../module/moduleContext';
+import type { GroupChannelSettingsProps } from '../types';
 
-const GroupChannelInfoHeader: React.FC<GroupChannelInfoProps['Header']> = ({
+const GroupChannelSettingsHeader: React.FC<GroupChannelSettingsProps['Header']> = ({
  Header = DefaultHeader,
  onPressHeaderLeft,
 }) => {
  const { colors } = useUIKitTheme();
- const { headerTitle, headerRight, onPressHeaderRight } = useContext(GroupChannelInfoContext.Fragment);
+ const { headerTitle, headerRight, onPressHeaderRight } = useContext(GroupChannelSettingsContext.Fragment);
  if (!Header) return null;
  return (
  <Header
@@ -27,4 +27,4 @@ const GroupChannelInfoHeader: React.FC<GroupChannelInfoProps['Header']> = ({
  );
 };
 
-export default GroupChannelInfoHeader;
+export default GroupChannelSettingsHeader;

packages/uikit-react-native-core/src/domain/groupChannelInfo/component/GroupChannelInfoView.tsx → packages/uikit-react-native-core/src/domain/groupChannelSettings/component/GroupChannelSettingsView.tsx

@@ -23,11 +23,14 @@ import {
 
 import { useLocalization } from '../../../contexts/Localization';
 import { useSendbirdChat } from '../../../contexts/SendbirdChat';
-import { GroupChannelInfoContext } from '../module/moduleContext';
-import type { GroupChannelInfoProps } from '../types';
+import { GroupChannelSettingsContext } from '../module/moduleContext';
+import type { GroupChannelSettingsProps } from '../types';
 
-const GroupChannelInfoView: React.FC<GroupChannelInfoProps['View']> = ({ onPressMenuMembers, onLeaveChannel }) => {
- const { channel } = useContext(GroupChannelInfoContext.Fragment);
+const GroupChannelSettingsView: React.FC<GroupChannelSettingsProps['View']> = ({
+ onPressMenuMembers,
+ onLeaveChannel,
+}) => {
+ const { channel } = useContext(GroupChannelSettingsContext.Fragment);
  const { currentUser } = useSendbirdChat();
  const { LABEL } = useLocalization();
  const { colors } = useUIKitTheme();
@@ -44,21 +47,21 @@ const GroupChannelInfoView: React.FC<GroupChannelInfoProps['View']> = ({ onPress
  const menuItems: MenuBarProps[] = [
  {
  icon: 'notifications',
- name: LABEL.GROUP_CHANNEL_INFO.MENU_NOTIFICATION,
+ name: LABEL.GROUP_CHANNEL_SETTINGS.MENU_NOTIFICATION,
  onPress: toggleNotification,
  actionItem: <Switch value={channel.myPushTriggerOption !== 'off'} onChangeValue={toggleNotification} />,
  },
  {
  icon: 'members',
- name: LABEL.GROUP_CHANNEL_INFO.MENU_MEMBERS,
+ name: LABEL.GROUP_CHANNEL_SETTINGS.MENU_MEMBERS,
  onPress: () => onPressMenuMembers(),
  actionLabel: String(channel.memberCount),
  actionItem: <Icon icon={'chevron-right'} color={colors.onBackground01} />,
  },
  {
  icon: 'leave',
  iconColor: colors.error,
- name: LABEL.GROUP_CHANNEL_INFO.MENU_LEAVE_CHANNEL,
+ name: LABEL.GROUP_CHANNEL_SETTINGS.MENU_LEAVE_CHANNEL,
  onPress: () => {
  onLeaveChannel();
  channel.leave();
@@ -67,7 +70,7 @@ const GroupChannelInfoView: React.FC<GroupChannelInfoProps['View']> = ({ onPress
  ];
 
  if (!currentUser) {
- Logger.warn('Cannot render GroupChannelInfoFragment, User is not connected');
+ Logger.warn('Cannot render GroupChannelSettingsFragment, User is not connected');
  return null;
  }
 
@@ -124,4 +127,4 @@ const styles = createStyleSheet({
  userIdContainer: { paddingVertical: 16 },
  userIdLabel: { marginBottom: 4 },
 });
-export default GroupChannelInfoView;
+export default GroupChannelSettingsView;

packages/uikit-react-native-core/src/domain/groupChannelSettings/index.ts

@@ -0,0 +1,4 @@
+export { default as GroupChannelSettingsHeader } from './component/GroupChannelSettingsHeader';
+export { default as GroupChannelSettingsView } from './component/GroupChannelSettingsView';
+export { default as createGroupChannelSettingsModule } from './module/createGroupChannelSettingsModule';
+export { GroupChannelSettingsContextProvider, GroupChannelSettingsContext } from './module/moduleContext';

packages/uikit-react-native-core/src/domain/groupChannelSettings/module/createGroupChannelSettingsModule.tsx

@@ -0,0 +1,15 @@
+import GroupChannelSettingsHeader from '../component/GroupChannelSettingsHeader';
+import GroupChannelSettingsView from '../component/GroupChannelSettingsView';
+import type { GroupChannelSettingsModule } from '../types';
+import { GroupChannelSettingsContextProvider } from './moduleContext';
+
+const createGroupChannelSettingsModule = ({
+ Header = GroupChannelSettingsHeader,
+ View = GroupChannelSettingsView,
+ Provider = GroupChannelSettingsContextProvider,
+ ...module
+}: Partial<GroupChannelSettingsModule> = {}): GroupChannelSettingsModule => {
+ return { Header, View, Provider, ...module };
+};
+
+export default createGroupChannelSettingsModule;

packages/uikit-react-native-core/src/domain/groupChannelInfo/module/moduleContext.tsx → packages/uikit-react-native-core/src/domain/groupChannelSettings/module/moduleContext.tsx

@@ -9,9 +9,9 @@ import ProviderLayout from '../../../components/ProviderLayout';
 import { useLocalization } from '../../../contexts/Localization';
 import { usePlatformService } from '../../../contexts/PlatformService';
 import { useSendbirdChat } from '../../../contexts/SendbirdChat';
-import type { GroupChannelInfoContextType, GroupChannelInfoProps } from '../types';
+import type { GroupChannelSettingsContextType, GroupChannelSettingsProps } from '../types';
 
-export const GroupChannelInfoContext: GroupChannelInfoContextType = {
+export const GroupChannelSettingsContext: GroupChannelSettingsContextType = {
  Fragment: createContext({
  channel: {} as Sendbird.GroupChannel,
  headerTitle: '',
@@ -20,8 +20,8 @@ export const GroupChannelInfoContext: GroupChannelInfoContextType = {
  }),
 };
 
-const HOOK_NAME = 'GroupChannelInfoContextProvider';
-export const GroupChannelInfoContextProvider: React.FC<GroupChannelInfoProps['Provider']> = ({
+const HOOK_NAME = 'GroupChannelSettingsContextProvider';
+export const GroupChannelSettingsContextProvider: React.FC<GroupChannelSettingsProps['Provider']> = ({
  children,
  staleChannel,
 }) => {
@@ -68,9 +68,9 @@ export const GroupChannelInfoContextProvider: React.FC<GroupChannelInfoProps['Pr
 
  const changeChannelName = useCallback(() => {
  prompt({
- title: LABEL.GROUP_CHANNEL_INFO.DIALOG_CHANGE_NAME_PROMPT_TITLE,
- submitLabel: LABEL.GROUP_CHANNEL_INFO.DIALOG_CHANGE_NAME_PROMPT_OK,
- placeholder: LABEL.GROUP_CHANNEL_INFO.DIALOG_CHANGE_NAME_PROMPT_PLACEHOLDER,
+ title: LABEL.GROUP_CHANNEL_SETTINGS.DIALOG_CHANGE_NAME_PROMPT_TITLE,
+ submitLabel: LABEL.GROUP_CHANNEL_SETTINGS.DIALOG_CHANGE_NAME_PROMPT_OK,
+ placeholder: LABEL.GROUP_CHANNEL_SETTINGS.DIALOG_CHANGE_NAME_PROMPT_PLACEHOLDER,
  defaultValue: activeChannel.name,
  onSubmit: async (channelName) => {
  const params = new sdk.GroupChannelParams();
@@ -82,10 +82,10 @@ export const GroupChannelInfoContextProvider: React.FC<GroupChannelInfoProps['Pr
 
  const changeChannelImage = useCallback(() => {
  openMenu({
- title: LABEL.GROUP_CHANNEL_INFO.DIALOG_CHANGE_IMAGE_MENU_TITLE,
+ title: LABEL.GROUP_CHANNEL_SETTINGS.DIALOG_CHANGE_IMAGE_MENU_TITLE,
  menuItems: [
  {
- title: LABEL.GROUP_CHANNEL_INFO.DIALOG_CHANGE_IMAGE_MENU_CAMERA,
+ title: LABEL.GROUP_CHANNEL_SETTINGS.DIALOG_CHANGE_IMAGE_MENU_CAMERA,
  onPress: async () => {
  const file = await fileService.openCamera();
  if (!file) return;
@@ -96,7 +96,7 @@ export const GroupChannelInfoContextProvider: React.FC<GroupChannelInfoProps['Pr
  },
  },
  {
- title: LABEL.GROUP_CHANNEL_INFO.DIALOG_CHANGE_IMAGE_MENU_PHOTO_LIBRARY,
+ title: LABEL.GROUP_CHANNEL_SETTINGS.DIALOG_CHANGE_IMAGE_MENU_PHOTO_LIBRARY,
  onPress: async () => {
  const files = await fileService.openMediaLibrary({ selectionLimit: 1 });
  if (!files || !files[0]) return;
@@ -113,24 +113,24 @@ export const GroupChannelInfoContextProvider: React.FC<GroupChannelInfoProps['Pr
  const onPressHeaderRight = useCallback(() => {
  openSheet({
  sheetItems: [
- { title: LABEL.GROUP_CHANNEL_INFO.DIALOG_CHANGE_NAME, onPress: changeChannelName },
- { title: LABEL.GROUP_CHANNEL_INFO.DIALOG_CHANGE_IMAGE, onPress: changeChannelImage },
+ { title: LABEL.GROUP_CHANNEL_SETTINGS.DIALOG_CHANGE_NAME, onPress: changeChannelName },
+ { title: LABEL.GROUP_CHANNEL_SETTINGS.DIALOG_CHANGE_IMAGE, onPress: changeChannelImage },
  ],
  });
  }, [LABEL, changeChannelImage, changeChannelName]);
 
  return (
  <ProviderLayout>
- <GroupChannelInfoContext.Fragment.Provider
+ <GroupChannelSettingsContext.Fragment.Provider
  value={{
  channel: activeChannel,
- headerTitle: LABEL.GROUP_CHANNEL_INFO.HEADER_TITLE,
- headerRight: LABEL.GROUP_CHANNEL_INFO.HEADER_RIGHT,
+ headerTitle: LABEL.GROUP_CHANNEL_SETTINGS.HEADER_TITLE,
+ headerRight: LABEL.GROUP_CHANNEL_SETTINGS.HEADER_RIGHT,
  onPressHeaderRight,
  }}
  >
  {children}
- </GroupChannelInfoContext.Fragment.Provider>
+ </GroupChannelSettingsContext.Fragment.Provider>
  </ProviderLayout>
  );
 };

packages/uikit-react-native-core/src/domain/groupChannelSettings/types.ts

@@ -0,0 +1,48 @@
+import type React from 'react';
+import type Sendbird from 'sendbird';
+
+import type { BaseHeaderProps } from '@sendbird/uikit-react-native-foundation';
+
+import type { CommonComponent } from '../../types';
+
+export type GroupChannelSettingsProps = {
+ Fragment: {
+ staleChannel: GroupChannelSettingsProps['Provider']['staleChannel'];
+ Header?: GroupChannelSettingsProps['Header']['Header'];
+ onPressHeaderLeft: GroupChannelSettingsProps['Header']['onPressHeaderLeft'];
+ onPressMenuMembers: GroupChannelSettingsProps['View']['onPressMenuMembers'];
+ onLeaveChannel: GroupChannelSettingsProps['View']['onLeaveChannel'];
+ };
+ Header: {
+ Header?: null | CommonComponent<BaseHeaderProps<{ title: string; onPressLeft: () => void }>>;
+ onPressHeaderLeft: () => void;
+ };
+ View: {
+ onPressMenuMembers: () => void;
+ onLeaveChannel: () => void;
+ };
+ Provider: {
+ staleChannel: Sendbird.GroupChannel;
+ };
+};
+
+/**
+ * Internal context for GroupChannelSettings
+ * For example, the developer can create a custom header
+ * with getting data from the domain context
+ * */
+export type GroupChannelSettingsContextType = {
+ Fragment: React.Context<{
+ channel: Sendbird.GroupChannel;
+ headerTitle: string;
+ headerRight: string;
+ onPressHeaderRight: () => void;
+ }>;
+};
+export interface GroupChannelSettingsModule {
+ Provider: React.FC<GroupChannelSettingsProps['Provider']>;
+ Header: CommonComponent<GroupChannelSettingsProps['Header']>;
+ View: CommonComponent<GroupChannelSettingsProps['View']>;
+}
+
+export type GroupChannelSettingsFragment = React.FC<GroupChannelSettingsProps['Fragment']>;

packages/uikit-react-native-core/src/index.tsx

@@ -33,7 +33,7 @@ export type {
 
 /** Domain **/
 export * from './domain/groupChannel';
-export * from './domain/groupChannelInfo';
+export * from './domain/groupChannelSettings';
 export * from './domain/groupChannelList';
 export * from './domain/userList';
 export type {
@@ -43,11 +43,11 @@ export type {
  GroupChannelContextType,
 } from './domain/groupChannel/types';
 export type {
- GroupChannelInfoProps,
- GroupChannelInfoModule,
- GroupChannelInfoFragment,
- GroupChannelInfoContextType,
-} from './domain/groupChannelInfo/types';
+ GroupChannelSettingsProps,
+ GroupChannelSettingsModule,
+ GroupChannelSettingsFragment,
+ GroupChannelSettingsContextType,
+} from './domain/groupChannelSettings/types';
 export type {
  GroupChannelType,
  GroupChannelListProps,

packages/uikit-react-native-core/src/localization/label.type.ts

@@ -60,17 +60,17 @@ export interface LabelSet {
  DIALOG_ATTACHMENT_PHOTO_LIBRARY: string;
  DIALOG_ATTACHMENT_FILES: string;
  };
- GROUP_CHANNEL_INFO: {
- /** GroupChannelInfo > Header */
+ GROUP_CHANNEL_SETTINGS: {
+ /** GroupChannelSettings > Header */
  HEADER_TITLE: string;
  HEADER_RIGHT: string;
 
- /** GroupChannelInfo > Menu */
+ /** GroupChannelSettings > Menu */
  MENU_NOTIFICATION: string;
  MENU_MEMBERS: string;
  MENU_LEAVE_CHANNEL: string;
 
- /** GroupChannelInfo > Dialog */
+ /** GroupChannelSettings > Dialog */
  DIALOG_CHANGE_NAME: string;
  DIALOG_CHANGE_IMAGE: string;
  DIALOG_CHANGE_NAME_PROMPT_TITLE: string;
@@ -209,7 +209,7 @@ export const createBaseLabel = ({ dateLocale, overrides }: LabelCreateOptions):
  DIALOG_ATTACHMENT_FILES: 'Files',
  ...overrides?.GROUP_CHANNEL,
  },
- GROUP_CHANNEL_INFO: {
+ GROUP_CHANNEL_SETTINGS: {
  HEADER_TITLE: 'Channel information',
  HEADER_RIGHT: 'Edit',
  MENU_NOTIFICATION: 'Notification',
@@ -224,7 +224,7 @@ export const createBaseLabel = ({ dateLocale, overrides }: LabelCreateOptions):
  DIALOG_CHANGE_IMAGE_MENU_TITLE: 'Change channel image',
  DIALOG_CHANGE_IMAGE_MENU_CAMERA: 'Take photo',
  DIALOG_CHANGE_IMAGE_MENU_PHOTO_LIBRARY: 'Choose photo',
- ...overrides?.GROUP_CHANNEL_INFO,
+ ...overrides?.GROUP_CHANNEL_SETTINGS,
  },
  GROUP_CHANNEL_LIST: {
  HEADER_TITLE: 'Channels',