chore: update mdi icon ic

web/src/components/FullModal.tsx

@@ -48,7 +48,7 @@ export const FullModal: React.FC<FullModalProps> = React.memo((props) => {
           className="absolute right-8 top-8 cursor-pointer flex flex-col"
           onClick={handleClose}
         >
-          <Icon className="text-2xl border-2 rounded-1/2" icon="mdi-close" />
+          <Icon className="text-2xl border-2 rounded-1/2" icon="mdi:close" />
           <span className="text-center mt-0.5 font-bold">ESC</span>
         </div>
       )}

web/src/components/GroupSection.tsx

@@ -15,7 +15,7 @@ export const GroupSection: React.FC<{
       >
         <Icon
           className="mr-1"
-          icon="mdi-chevron-right"
+          icon="mdi:chevron-right"
           rotate={isShow ? 45 : 0}
         />
         <div>{props.header}</div>

web/src/components/IsDeveloping.tsx

@@ -9,7 +9,7 @@ import React from 'react';
 export const IsDeveloping: React.FC = React.memo(() => {
   return (
     <div className="text-white w-full h-full flex items-center justify-center flex-col">
-      <Icon className="text-9xl" icon="mdi-code-braces" />
+      <Icon className="text-9xl" icon="mdi:code-braces" />
       <p className="text-2xl">{t('该功能暂未开放')}</p>
     </div>
   );

web/src/components/Modal.tsx

@@ -97,7 +97,7 @@ export const Modal: React.FC<ModalProps> = React.memo((props) => {
             {closable === true && (
               <Icon
                 className="absolute right-2.5 top-3.5 text-xl z-10"
-                icon="mdi-close"
+                icon="mdi:close"
                 onClick={handleClose}
               />
             )}

web/src/components/SectionHeader.tsx

@@ -25,7 +25,7 @@ export const SectionHeader: React.FC<SectionHeaderProps> = React.memo(
                 className={clsx('text-2xl transition-transform transform', {
                   'rotate-180': visible,
                 })}
-                icon="mdi-chevron-down"
+                icon="mdi:chevron-down"
               >
                 &#xe60f;
               </Icon>

web/src/components/Spinner.tsx

@@ -2,6 +2,6 @@ import { Icon } from '@iconify/react';
 import React from 'react';
 
 export const Spinner: React.FC = React.memo(() => {
-  return <Icon className="animate-spin mr-3 inline" icon="mdi-loading" />;
+  return <Icon className="animate-spin mr-3 inline" icon="mdi:loading" />;
 });
 Spinner.displayName = 'Spinner';

web/src/components/__tests__/IconBtn.spec.tsx

@@ -4,7 +4,7 @@ import { IconBtn } from '../IconBtn';
 
 describe('IconBtn', () => {
   test('render', () => {
-    const wrapper = render(<IconBtn icon="mdi-close" />);
+    const wrapper = render(<IconBtn icon="mdi:close" />);
     expect(wrapper.container).toMatchSnapshot();
   });
 });

web/src/components/modals/GroupInvite.tsx

@@ -51,7 +51,7 @@ export const GroupInvite: React.FC<GroupInviteProps> = React.memo((props) => {
 
       <Icon
         className="text-6xl block m-auto opacity-30 mb-4 mt-2"
-        icon="mdi-email-edit-outline"
+        icon="mdi:email-edit-outline"
       />
 
       <div className="text-gray-400 font-bold text-lg mb-2">

web/src/routes/Entry/LoginView.tsx

@@ -18,7 +18,7 @@ const OAuthLoginView: React.FC = React.memo(() => {
       <Divider>或</Divider>
 
       <div className="bg-gray-400 w-1/3 px-4 py-1 text-3xl text-center rounded-md cursor-pointer shadow-md">
-        <Icon className="mx-auto" icon="mdi-github" />
+        <Icon className="mx-auto" icon="mdi:github" />
       </div>
     </>
   );
@@ -100,7 +100,7 @@ export const LoginView: React.FC = React.memo(() => {
           onClick={toRegisterView}
         >
           注册账号
-          <Icon icon="mdi-arrow-right" className="ml-1 inline" />
+          <Icon icon="mdi:arrow-right" className="ml-1 inline" />
         </button>
       </div>
     </div>

web/src/routes/Entry/RegisterView.tsx

@@ -89,7 +89,7 @@ export const RegisterView: React.FC = React.memo(() => {
           disabled={loading}
           onClick={toLoginView}
         >
-          <Icon icon="mdi-arrow-left" className="mr-1 inline" />
+          <Icon icon="mdi:arrow-left" className="mr-1 inline" />
           返回登录
         </button>
       </div>

web/src/routes/Main/Content/Personal/Friends/FriendList.tsx

@@ -37,7 +37,7 @@ export const FriendList: React.FC = React.memo(() => {
               <Tooltip key="message" title={t('发送消息')}>
                 <div>
                   <IconBtn
-                    icon="mdi-message-text-outline"
+                    icon="mdi:message-text-outline"
                     onClick={() => handleCreateConverse(friendId)}
                   />
                 </div>

web/src/routes/Main/Content/Personal/Friends/RequestReceived.tsx

@@ -41,7 +41,7 @@ export const RequestReceived: React.FC<{
               <Tooltip key="accept" title={t('接受')}>
                 <div>
                   <IconBtn
-                    icon="mdi-check"
+                    icon="mdi:check"
                     disabled={loading}
                     onClick={() => handleAccept(_id)}
                   />
@@ -50,7 +50,7 @@ export const RequestReceived: React.FC<{
               <Tooltip key="deny" title={t('拒绝')}>
                 <div>
                   <IconBtn
-                    icon="mdi-close"
+                    icon="mdi:close"
                     disabled={loading}
                     onClick={() => handleDeny(_id)}
                   />

web/src/routes/Main/Content/Personal/Friends/RequestSend.tsx

@@ -28,7 +28,7 @@ export const RequestSend: React.FC<{
               <Tooltip key="cancel" title={t('取消')}>
                 <div>
                   <IconBtn
-                    icon="mdi-close"
+                    icon="mdi:close"
                     disabled={loading}
                     onClick={() => handleCancel(_id)}
                   />

web/src/routes/Main/Content/Personal/Sidebar.tsx

@@ -30,16 +30,16 @@ export const Sidebar: React.FC = React.memo(() => {
     <div className="p-2">
       <SidebarItem
         name="好友"
-        icon={<Icon icon="mdi-account-multiple" />}
+        icon={<Icon icon="mdi:account-multiple" />}
         to="/main/personal/friends"
       />
       <SidebarItem
         name="插件中心"
-        icon={<Icon icon="mdi-puzzle" />}
+        icon={<Icon icon="mdi:puzzle" />}
         to="/main/personal/plugins"
       />
 
-      <SidebarSection action={<Icon icon="mdi-plus" />}>私信</SidebarSection>
+      <SidebarSection action={<Icon icon="mdi:plus" />}>私信</SidebarSection>
 
       {converseList.map((converse) => {
         return <SidebarDMItem key={converse._id} converse={converse} />;

web/src/routes/Main/Content/Personal/SidebarDMItem.tsx

@@ -36,7 +36,7 @@ export const SidebarDMItem: React.FC<SidebarDMItemProps> = React.memo(
         key={converse._id}
         name={name}
         // TODO
-        // action={<Icon icon="mdi-close" />}
+        // action={<Icon icon="mdi:close" />}
         to={`/main/personal/converse/${converse._id}`}
       />
     );

web/src/routes/Main/Navbar/GroupNav.tsx

@@ -43,7 +43,7 @@ export const GroupNav: React.FC = React.memo(() => {
         name={t('创建群组')}
         onClick={handleCreateGroup}
       >
-        <Icon className="text-3xl text-white" icon="mdi-plus" />
+        <Icon className="text-3xl text-white" icon="mdi:plus" />
       </NavbarNavItem>
     </div>
   );

web/src/routes/Main/Navbar/MobileMenuBtn.tsx

@@ -18,7 +18,7 @@ export const MobileMenuBtn: React.FC = React.memo(() => {
   return (
     <Icon
       className="text-5xl mb-4"
-      icon={showSidebar ? 'mdi-menu-open' : 'mdi-menu'}
+      icon={showSidebar ? 'mdi:menu-open' : 'mdi:menu'}
       onClick={handleSwitchSidebar}
     />
   );

web/src/routes/Main/Navbar/SettingBtn.tsx

@@ -11,7 +11,7 @@ export const SettingBtn: React.FC = React.memo(() => {
   return (
     <Icon
       className="text-3xl text-white cursor-pointer"
-      icon="mdi-dots-horizontal"
+      icon="mdi:dots-horizontal"
       onClick={handleClick}
     />
   );