From 88b05da0c97d3a43f00a8149ab085477f89a942c Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Mon, 29 Apr 2024 18:14:18 +0800
Subject: [PATCH] fix: fix a problem which deleted conversation can not get
 name occur crash

---
 client/shared/redux/hooks/useDMConverseName.ts |  8 ++++++--
 client/web/src/components/ConverseName.tsx     | 10 ++++++++--
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/client/shared/redux/hooks/useDMConverseName.ts b/client/shared/redux/hooks/useDMConverseName.ts
index 6abfd549ae2..2f69d3e62e4 100644
--- a/client/shared/redux/hooks/useDMConverseName.ts
+++ b/client/shared/redux/hooks/useDMConverseName.ts
@@ -4,16 +4,20 @@ import type { ChatConverseState } from '../slices/chat';
 import { useUserId } from './useUserInfo';
 import type { FriendInfo } from '../slices/user';
 
-export function useDMConverseName(converse: ChatConverseState) {
+export function useDMConverseName(converse: ChatConverseState | undefined) {
   const userId = useUserId();
   const friends: FriendInfo[] = useAppSelector((state) => state.user.friends);
   const { value: name = '' } = useAsync(async () => {
+    if (!converse) {
+      return '';
+    }
+
     if (!isValidStr(userId)) {
       return '';
     }
 
     return getDMConverseName(userId, converse);
-  }, [userId, converse.name, converse.members.join(','), friends]);
+  }, [userId, converse?.name, converse?.members.join(','), friends]);
 
   return name;
 }
diff --git a/client/web/src/components/ConverseName.tsx b/client/web/src/components/ConverseName.tsx
index 28a0ec4a6a3..2167e3f8a82 100644
--- a/client/web/src/components/ConverseName.tsx
+++ b/client/web/src/components/ConverseName.tsx
@@ -1,5 +1,9 @@
 import React from 'react';
-import { useAppSelector, useDMConverseName } from 'tailchat-shared';
+import {
+  ChatConverseState,
+  useAppSelector,
+  useDMConverseName,
+} from 'tailchat-shared';
 
 interface ConverseNameProps {
   converseId: string;
@@ -9,7 +13,9 @@ interface ConverseNameProps {
 
 export const ConverseName: React.FC<ConverseNameProps> = React.memo((props) => {
   const { converseId, className, style } = props;
-  const converse = useAppSelector((state) => state.chat.converses[converseId]);
+  const converse = useAppSelector<ChatConverseState | undefined>(
+    (state) => state.chat.converses[converseId]
+  );
   const converseName = useDMConverseName(converse);
 
   return (