refactor: profile component for better performance

src/routes/chat/ChannelChat/index.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect, memo } from "react";
 import { useDebounce } from "rooks";
 import { NavLink, useLocation } from "react-router-dom";
 import Tippy from "@tippyjs/react";
@@ -32,7 +32,7 @@ type Props = {
   cid?: number;
   dropFiles?: File[];
 };
-export default function ChannelChat({ cid = 0, dropFiles = [] }: Props) {
+function ChannelChat({ cid = 0, dropFiles = [] }: Props) {
   const { values: agoraConfig } = useConfig("agora");
   const {
     list: msgIds,
@@ -216,3 +216,4 @@ export default function ChannelChat({ cid = 0, dropFiles = [] }: Props) {
     </>
   );
 }
+export default memo(ChannelChat);

src/routes/chat/index.tsx

@@ -1,5 +1,5 @@
 // import React from 'react';
-import { useState } from "react";
+import { memo, useState } from "react";
 import { useParams } from "react-router-dom";
 
 import StyledWrapper from "./styled";
@@ -14,7 +14,7 @@ import { useAppSelector } from "../../app/store";
 import GuestBlankPlaceholder from "./GuestBlankPlaceholder";
 import GuestChannelChatInfo from "./GuestChannelChatInfo";
 import GuestSessionList from "./GuestSessionList";
-export default function ChatPage() {
+function ChatPage() {
   const [channelModalVisible, setChannelModalVisible] = useState(false);
   const [usersModalVisible, setUsersModalVisible] = useState(false);
   const { channel_id = 0, user_id = 0 } = useParams();
@@ -66,3 +66,4 @@ export default function ChatPage() {
     </>
   );
 }
+export default memo(ChatPage);