From 1b84143bbe73a4f0d578d89bf14c9df040ccb945 Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Wed, 2 Aug 2023 20:54:23 +0800
Subject: [PATCH] feat: add person icon badge when has unprocessed friend
 request

---
 .../web/src/routes/Main/Navbar/PersonalNav.tsx | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/client/web/src/routes/Main/Navbar/PersonalNav.tsx b/client/web/src/routes/Main/Navbar/PersonalNav.tsx
index 5905fbf1..49527c6e 100644
--- a/client/web/src/routes/Main/Navbar/PersonalNav.tsx
+++ b/client/web/src/routes/Main/Navbar/PersonalNav.tsx
@@ -1,6 +1,12 @@
 import { Avatar } from 'tailchat-design';
 import React from 'react';
-import { t, useDMConverseList, useUserInfo, useUnread } from 'tailchat-shared';
+import {
+  t,
+  useDMConverseList,
+  useUserInfo,
+  useUnread,
+  useAppSelector,
+} from 'tailchat-shared';
 import { NavbarNavItem } from './NavItem';
 
 function usePersonalUnread(): boolean {
@@ -13,6 +19,14 @@ function usePersonalUnread(): boolean {
 export const PersonalNav: React.FC = React.memo(() => {
   const userInfo = useUserInfo();
   const unread = usePersonalUnread();
+  const hasFriendRequest = useAppSelector(
+    (state) =>
+      state.user.friendRequests.findIndex(
+        (item) => item.to === state.user.info?._id
+      ) >= 0
+  );
+
+  const badge = unread || hasFriendRequest;
 
   return (
     <div data-tc-role="navbar-personal">
@@ -20,7 +34,7 @@ export const PersonalNav: React.FC = React.memo(() => {
         name={t('我')}
         to={'/main/personal'}
         showPill={true}
-        badge={unread}
+        badge={badge}
       >
         <Avatar
           shape="square"