feat: add person icon badge when has unprocessed friend request

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"