Skip to content

Commit

Permalink
docs: update docs validation snippet
Browse files Browse the repository at this point in the history
  • Loading branch information
@bang9
bang9 committed Oct 29, 2022
1 parent 4ac84ee commit 4aaeb89
Show file tree
Hide file tree
Showing 5 changed files with 44 additions and 30 deletions.
16 changes: 6 additions & 10 deletions docs-validation/1_introduction/SendYourFirstMessage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,7 @@ const App = () => {
* {@link https://sendbird.com/docs/uikit/v3/react-native/introduction/send-first-message#2-get-started-3-step-7-create-a-fragment-and-module-components}
* */
import { useNavigation, useRoute } from '@react-navigation/native';
import { useGroupChannel } from '@sendbird/uikit-chat-hooks';
import {
useSendbirdChat,
createGroupChannelListFragment,
Expand All @@ -90,9 +91,7 @@ const GroupChannelListScreen = () => {
}}
onPressChannel={(channel) => {
// Navigate to GroupChannel function.
navigation.navigate('GroupChannel', {
serializedChannel: channel.serialize(),
});
navigation.navigate('GroupChannel', { channelUrl: channel.url });
}}
/>
);
Expand All @@ -105,9 +104,7 @@ const GroupChannelCreateScreen = () => {
<GroupChannelCreateFragment
onCreateChannel={async (channel) => {
// Navigate to GroupChannel function.
navigation.replace('GroupChannel', {
serializedChannel: channel.serialize(),
});
navigation.replace('GroupChannel', { channelUrl: channel.url });
}}
onPressHeaderLeft={() => {
// Go back to the previous screen.
Expand All @@ -122,7 +119,8 @@ const GroupChannelScreen = () => {
const { params } = useRoute<any>();

const { sdk } = useSendbirdChat();
const channel = sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel);
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

return (
<GroupChannelFragment
Expand All @@ -137,9 +135,7 @@ const GroupChannelScreen = () => {
}}
onPressHeaderRight={() => {
// Navigate to GroupChannelSettings function.
navigation.navigate('GroupChannelSettings', {
serializedChannel: params.serializedChannel,
});
navigation.navigate('GroupChannelSettings', { channelUrl: params.channelUrl });
}}
/>
);
Expand Down
15 changes: 9 additions & 6 deletions docs-validation/4_key-functions/ChattingInAChannel/ChatInAGroupChannel.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,14 @@ const AdvertiseMessage = (_:object) => <></>
* */
import { useState } from 'react';
import { useSendbirdChat, createGroupChannelFragment } from "@sendbird/uikit-react-native";
import { useGroupChannel } from "@sendbird/uikit-chat-hooks";

const GroupChannelFragment = createGroupChannelFragment();

const GroupChannelScreen = ({ params }: { params: { serializedChannel: object } }) => {
const GroupChannelScreen = ({ params }: { params: { channelUrl: string } }) => {
const { sdk } = useSendbirdChat();
const [channel] = useState(() => sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel));
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

const navigateToGroupChannelListScreen = () => {};
const navigateToGroupChannelSettingsScreen = () => {};
Expand Down Expand Up @@ -111,16 +113,17 @@ const UseReactNavigationHeader: GroupChannelModule['Header'] = ({ onPressHeaderR
const GroupChannelFragment2 = createGroupChannelFragment({
Header: UseReactNavigationHeader, // Hide header and use react-navigation header
});
const GroupChannelScreen2 = ({ params }: { params: { serializedChannel: object } }) => {
const GroupChannelScreen2 = ({ params }: { params: { channelUrl: string } }) => {
const height = useHeaderHeight();

const { sdk } = useSendbirdChat();
const [channel] = useState(() => sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel));
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

const navigateToGroupChannelListScreen = () => {};
const navigateToGroupChannelSettingsScreen = () => {};
const navigateToBack = () => {};

const height = useHeaderHeight();

return (
<GroupChannelFragment2
keyboardAvoidOffset={height}
Expand Down
16 changes: 12 additions & 4 deletions docs-validation/4_key-functions/ConfiguringChannelSettings/ConfigureGroupChannelSettings.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,22 +6,26 @@ import type { GroupChannelSettingsContextsType } from '@sendbird/uikit-react-nat
* */
import React, { useState } from 'react';
import { useSendbirdChat, createGroupChannelSettingsFragment } from '@sendbird/uikit-react-native';
import { useGroupChannel } from "@sendbird/uikit-chat-hooks";

const GroupChannelSettingsFragment = createGroupChannelSettingsFragment();
const GroupChannelSettingsScreen = ({ params }: { params: { serializedChannel: object } }) => {
const GroupChannelSettingsScreen = ({ params }: { params: { channelUrl: string } }) => {
const { sdk } = useSendbirdChat();
const [channel] = useState(() => sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel));
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

const navigateToBack = () => {};
const navigateToGroupChannelListScreen = () => {};
const navigateToGroupChannelMembersScreen = () => {};
const navigateToGroupChannelModerationsScreen = () => {};

return (
<GroupChannelSettingsFragment
channel={channel}
onPressHeaderLeft={navigateToBack}
onPressMenuLeaveChannel={navigateToGroupChannelListScreen}
onPressMenuMembers={navigateToGroupChannelMembersScreen}
onPressMenuModerations={navigateToGroupChannelModerationsScreen}
/>
);
};
Expand Down Expand Up @@ -59,22 +63,26 @@ const Component = () => {
import { Share } from 'react-native';

import { Icon } from '@sendbird/uikit-react-native-foundation';
// import { useGroupChannel } from "@sendbird/uikit-chat-hooks";

const GroupChannelSettingsFragment2 = createGroupChannelSettingsFragment();
const GroupChannelSettingsScreen2 = ({ params }: { params: { serializedChannel: object } }) => {
const GroupChannelSettingsScreen2 = ({ params }: { params: { channelUrl: string } }) => {
const { sdk } = useSendbirdChat();
const [channel] = useState(() => sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel));
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

const navigateToBack = () => {};
const navigateToGroupChannelListScreen = () => {};
const navigateToGroupChannelMembersScreen = () => {};
const navigateToGroupChannelModerationsScreen = () => {};

return (
<GroupChannelSettingsFragment2
channel={channel}
onPressHeaderLeft={navigateToBack}
onPressMenuLeaveChannel={navigateToGroupChannelListScreen}
onPressMenuMembers={navigateToGroupChannelMembersScreen}
onPressMenuModerations={navigateToGroupChannelModerationsScreen}
menuItemsCreator={(items) => {
items.unshift({
icon: 'channels',
Expand Down
12 changes: 8 additions & 4 deletions docs-validation/4_key-functions/InviteUsers.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,13 @@ const createMyAppUserQuery = () => ({
import { useState } from 'react';
import { useSendbirdChat, createGroupChannelInviteFragment } from "@sendbird/uikit-react-native";
import type { SendbirdUser } from "@sendbird/uikit-utils";
import { useGroupChannel } from "@sendbird/uikit-chat-hooks";

const GroupChannelInviteFragment = createGroupChannelInviteFragment<SendbirdUser>();
const GroupChannelInviteScreen = ({ params }: { params: { serializedChannel: object } }) => {
const GroupChannelInviteScreen = ({ params }: { params: { channelUrl: string } }) => {
const { sdk } = useSendbirdChat();
const [channel] = useState(() => sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel));
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

const navigateToBack = () => {};
const navigateToGroupChannel = () => {};
Expand Down Expand Up @@ -82,6 +84,7 @@ const Component2 = () => {
* */
import { CustomQuery } from '@sendbird/uikit-chat-hooks';
// import { useSendbirdChat, createGroupChannelInviteFragment } from '@sendbird/uikit-react-native';
// import { useGroupChannel } from '@sendbird/uikit-chat-hooks';

type MyAppUser = { uid: string; name: string; profile: string };

Expand All @@ -101,9 +104,10 @@ const myAppUserQueryCreator = () => {
};

const GroupChannelInviteFragment2 = createGroupChannelInviteFragment<MyAppUser>();
const GroupChannelInviteScreen2 = ({ params }: { params: { serializedChannel: object } }) => {
const GroupChannelInviteScreen2 = ({ params }: { params: { channelUrl: string } }) => {
const { sdk } = useSendbirdChat();
const [channel] = useState(() => sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel));
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

const navigateToBack = () => {};
const navigateToGroupChannel = () => {};
Expand Down
15 changes: 9 additions & 6 deletions docs-validation/4_key-functions/ListingUsers/ListChannelMembers.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,13 @@ import { useBottomSheet } from '@sendbird/uikit-react-native-foundation';
* */
import React, { useState } from 'react';
import { useSendbirdChat, createGroupChannelMembersFragment } from '@sendbird/uikit-react-native';
import { useGroupChannel } from "@sendbird/uikit-chat-hooks";

const GroupChannelMembersFragment = createGroupChannelMembersFragment();
const GroupChannelMembersScreen = ({ params }: { params: { serializedChannel: object } }) => {
const GroupChannelMembersScreen = ({ params }: { params: { channelUrl: string } }) => {
const { sdk } = useSendbirdChat();
const [channel] = useState(() => sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel));
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

const navigateToBack = () => {};
const navigateToGroupChannelInvite = () => {};
Expand Down Expand Up @@ -79,12 +81,13 @@ const Component2 = () => {
// import { useBottomSheet } from '@sendbird/uikit-react-native-foundation';

const GroupChannelMembersFragment2 = createGroupChannelMembersFragment();
const GroupChannelMembersScreen2 = ({ params }: { params: { serializedChannel: object } }) => {
const { sdk } = useSendbirdChat();
const [channel] = useState(() => sdk.groupChannel.buildGroupChannelFromSerializedData(params.serializedChannel));

const GroupChannelMembersScreen2 = ({ params }: { params: { channelUrl: string } }) => {
const { openSheet } = useBottomSheet();

const { sdk } = useSendbirdChat();
const { channel } = useGroupChannel(sdk, params.channelUrl);
if (!channel) return null;

const navigateToBack = () => {};
const navigateToGroupChannelInvite = () => {};

Expand Down

0 comments on commit 4aaeb89

Please sign in to comment.