diff --git a/docs-validation/1_introduction/SendYourFirstMessage.tsx b/docs-validation/1_introduction/SendYourFirstMessage.tsx
index 8d0b3f344..b1d281c17 100644
--- a/docs-validation/1_introduction/SendYourFirstMessage.tsx
+++ b/docs-validation/1_introduction/SendYourFirstMessage.tsx
@@ -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,
@@ -90,9 +91,7 @@ const GroupChannelListScreen = () => {
       }}
       onPressChannel={(channel) => {
         // Navigate to GroupChannel function.
-        navigation.navigate('GroupChannel', {
-          serializedChannel: channel.serialize(),
-        });
+        navigation.navigate('GroupChannel', { channelUrl: channel.url });
       }}
     />
   );
@@ -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.
@@ -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
@@ -137,9 +135,7 @@ const GroupChannelScreen = () => {
       }}
       onPressHeaderRight={() => {
         // Navigate to GroupChannelSettings function.
-        navigation.navigate('GroupChannelSettings', {
-          serializedChannel: params.serializedChannel,
-        });
+        navigation.navigate('GroupChannelSettings', { channelUrl: params.channelUrl });
       }}
     />
   );
diff --git a/docs-validation/4_key-functions/ChattingInAChannel/ChatInAGroupChannel.tsx b/docs-validation/4_key-functions/ChattingInAChannel/ChatInAGroupChannel.tsx
index cd9e3d962..de4739af5 100644
--- a/docs-validation/4_key-functions/ChattingInAChannel/ChatInAGroupChannel.tsx
+++ b/docs-validation/4_key-functions/ChattingInAChannel/ChatInAGroupChannel.tsx
@@ -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 = () => {};
@@ -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}
diff --git a/docs-validation/4_key-functions/ConfiguringChannelSettings/ConfigureGroupChannelSettings.tsx b/docs-validation/4_key-functions/ConfiguringChannelSettings/ConfigureGroupChannelSettings.tsx
index 21b76e77b..fa5447e2f 100644
--- a/docs-validation/4_key-functions/ConfiguringChannelSettings/ConfigureGroupChannelSettings.tsx
+++ b/docs-validation/4_key-functions/ConfiguringChannelSettings/ConfigureGroupChannelSettings.tsx
@@ -6,15 +6,18 @@ 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
@@ -22,6 +25,7 @@ const GroupChannelSettingsScreen = ({ params }: { params: { serializedChannel: o
       onPressHeaderLeft={navigateToBack}
       onPressMenuLeaveChannel={navigateToGroupChannelListScreen}
       onPressMenuMembers={navigateToGroupChannelMembersScreen}
+      onPressMenuModerations={navigateToGroupChannelModerationsScreen}
     />
   );
 };
@@ -59,15 +63,18 @@ 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
@@ -75,6 +82,7 @@ const GroupChannelSettingsScreen2 = ({ params }: { params: { serializedChannel:
       onPressHeaderLeft={navigateToBack}
       onPressMenuLeaveChannel={navigateToGroupChannelListScreen}
       onPressMenuMembers={navigateToGroupChannelMembersScreen}
+      onPressMenuModerations={navigateToGroupChannelModerationsScreen}
       menuItemsCreator={(items) => {
         items.unshift({
           icon: 'channels',
diff --git a/docs-validation/4_key-functions/InviteUsers.tsx b/docs-validation/4_key-functions/InviteUsers.tsx
index fa88bff15..d47f3d646 100644
--- a/docs-validation/4_key-functions/InviteUsers.tsx
+++ b/docs-validation/4_key-functions/InviteUsers.tsx
@@ -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 = () => {};
@@ -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 };
 
@@ -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 = () => {};
diff --git a/docs-validation/4_key-functions/ListingUsers/ListChannelMembers.tsx b/docs-validation/4_key-functions/ListingUsers/ListChannelMembers.tsx
index 036b2d41a..3b8ed2463 100644
--- a/docs-validation/4_key-functions/ListingUsers/ListChannelMembers.tsx
+++ b/docs-validation/4_key-functions/ListingUsers/ListChannelMembers.tsx
@@ -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 = () => {};
@@ -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 = () => {};