fix: add suspsese and add type safety

src/components/Conversation/Save/Chatting.tsx

@@ -1,13 +1,13 @@
 import { cn } from "@/lib/utils";
 
 interface ConversationSaveChatViewerProps {
-  chats: {
+  chats?: {
     date: string;
     name: string;
     email: string;
     message: string;
   }[];
-  voice: {
+  voice?: {
     date: string;
     name: string;
     email: string;
@@ -20,8 +20,8 @@ const ConversationSaveChatViewer = ({
   voice,
 }: ConversationSaveChatViewerProps) => {
   const chatting = [
-    ...chats.map((c) => ({ ...c, status: "chat" })),
-    ...voice.map((v) => ({ ...v, status: "voice" })),
+    ...(chats ?? []).map((c) => ({ ...c, status: "chat" })),
+    ...(voice ?? []).map((v) => ({ ...v, status: "voice" })),
   ];
 
   const sortedChatting = [...chatting].sort((a, b) => {
@@ -57,7 +57,7 @@ const ConversationSaveChatViewer = ({
                 <div
                   className={cn(
                     "mr-3 flex h-8 w-8 items-center justify-center rounded-full font-bold",
-                    chat.name === chats[0].name
+                    chats && chats.length > 0 && chat.name === chats[0].name
                       ? "bg-gray-300 text-black"
                       : "bg-black text-white",
                   )}

src/hooks/Users/useCheckUserValid.tsx

@@ -1,4 +1,4 @@
-import { ReactNode, useEffect } from "react";
+import { ReactNode, Suspense, useEffect } from "react";
 import { useNavigate } from "react-router-dom";
 import useCheckUserQuery from "@/hooks/Users/useCheckUserQuery";
 
@@ -20,7 +20,7 @@ export const UserLoginPageGuard = ({ children }: UserGuardProps) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [checkUser, isError]);
 
-  return children;
+  return <Suspense>{children}</Suspense>;
 };
 
 export const UserGuard = ({ children }: UserGuardProps) => {
@@ -35,5 +35,5 @@ export const UserGuard = ({ children }: UserGuardProps) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [checkUser, isError]);
 
-  return children;
+  return <Suspense>{children}</Suspense>;
 };