🐛 fix(deps): Remove outdated @iconify/react dependency and add iconify-json packages

apps/user/app/(main)/(user)/dashboard/content.tsx

@@ -9,7 +9,6 @@ import { getStat } from '@/services/common/common';
 import { queryApplicationConfig } from '@/services/user/subscribe';
 import { queryUserSubscribe } from '@/services/user/user';
 import { getPlatform } from '@/utils/common';
-import { Icon } from '@iconify/react';
 import { useQuery } from '@tanstack/react-query';
 import {
   Accordion,
@@ -32,6 +31,7 @@ import { Button } from '@workspace/ui/components/button';
 import { Card, CardContent, CardHeader, CardTitle } from '@workspace/ui/components/card';
 import { Separator } from '@workspace/ui/components/separator';
 import { Tabs, TabsList, TabsTrigger } from '@workspace/ui/components/tabs';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { isBrowser } from '@workspace/ui/utils';
 import { differenceInDays } from 'date-fns';
 import { useTranslations } from 'next-intl';

apps/user/app/(main)/(user)/payment/page.tsx

@@ -5,7 +5,6 @@ import { SubscribeBilling } from '@/components/subscribe/billing';
 import { SubscribeDetail } from '@/components/subscribe/detail';
 import useGlobalStore from '@/config/use-global';
 import { checkoutOrder, queryOrderDetail } from '@/services/user/order';
-import { Icon } from '@iconify/react';
 import { useQuery } from '@tanstack/react-query';
 import { Badge } from '@workspace/ui/components/badge';
 import { Button } from '@workspace/ui/components/button';
@@ -17,6 +16,7 @@ import {
   CardTitle,
 } from '@workspace/ui/components/card';
 import { Separator } from '@workspace/ui/components/separator';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { formatDate } from '@workspace/ui/utils';
 import { useCountDown } from 'ahooks';
 import { addMinutes, format } from 'date-fns';

apps/user/app/(main)/(user)/sidebar-left.tsx

@@ -1,6 +1,5 @@
 'use client';
 import { navs } from '@/config/navs';
-import { Icon } from '@iconify/react';
 import {
   Sidebar,
   SidebarContent,
@@ -11,6 +10,7 @@ import {
   SidebarMenuButton,
   SidebarMenuItem,
 } from '@workspace/ui/components/sidebar';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { useTranslations } from 'next-intl';
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';

apps/user/app/(main)/(user)/sidebar-right.tsx

@@ -3,7 +3,6 @@
 import { Display } from '@/components/display';
 import Recharge from '@/components/subscribe/recharge';
 import useGlobalStore from '@/config/use-global';
-import { Icon } from '@iconify/react';
 import { Button } from '@workspace/ui/components/button';
 import { Card, CardContent, CardHeader, CardTitle } from '@workspace/ui/components/card';
 import { Sidebar, SidebarContent } from '@workspace/ui/components/sidebar';
@@ -13,6 +12,7 @@ import {
   TooltipProvider,
   TooltipTrigger,
 } from '@workspace/ui/components/tooltip';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { isBrowser } from '@workspace/ui/utils';
 import { useTranslations } from 'next-intl';
 import CopyToClipboard from 'react-copy-to-clipboard';

apps/user/app/(main)/(user)/subscribe/page.tsx

@@ -2,12 +2,12 @@
 
 import { Display } from '@/components/display';
 import { querySubscribeGroupList, querySubscribeList } from '@/services/user/subscribe';
-import { Icon } from '@iconify/react';
 import { useQuery } from '@tanstack/react-query';
 import { Button } from '@workspace/ui/components/button';
 import { Card, CardContent, CardFooter, CardHeader } from '@workspace/ui/components/card';
 import { Separator } from '@workspace/ui/components/separator';
 import { Tabs, TabsList, TabsTrigger } from '@workspace/ui/components/tabs';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { cn } from '@workspace/ui/lib/utils';
 import { useTranslations } from 'next-intl';
 import { useState } from 'react';

apps/user/app/(main)/(user)/ticket/page.tsx

@@ -9,7 +9,6 @@ import {
   getUserTicketList,
   updateUserTicketStatus,
 } from '@/services/user/ticket';
-import { Icon } from '@iconify/react';
 import { useQuery } from '@tanstack/react-query';
 import { Button } from '@workspace/ui/components/button';
 import {
@@ -41,6 +40,7 @@ import { Label } from '@workspace/ui/components/label';
 import { ScrollArea } from '@workspace/ui/components/scroll-area';
 import { Textarea } from '@workspace/ui/components/textarea';
 import { ConfirmButton } from '@workspace/ui/custom-components/confirm-button';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { cn } from '@workspace/ui/lib/utils';
 import { formatDate } from '@workspace/ui/utils';
 import { useTranslations } from 'next-intl';

apps/user/app/auth/email/login-form.tsx

@@ -1,9 +1,9 @@
 import useGlobalStore from '@/config/use-global';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { Icon } from '@iconify/react/dist/iconify.js';
 import { Button } from '@workspace/ui/components/button';
 import { Form, FormControl, FormField, FormItem, FormMessage } from '@workspace/ui/components/form';
 import { Input } from '@workspace/ui/components/input';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { useTranslations } from 'next-intl';
 import { Dispatch, SetStateAction } from 'react';
 import { useForm } from 'react-hook-form';
@@ -60,12 +60,7 @@ export default function LoginForm({
             render={({ field }) => (
               <FormItem>
                 <FormControl>
-                  <Input
-                    disabled={loading}
-                    placeholder='Enter your password...'
-                    type='password'
-                    {...field}
-                  />
+                  <Input placeholder='Enter your password...' type='password' {...field} />
                 </FormControl>
                 <FormMessage />
               </FormItem>

apps/user/app/auth/email/register-form.tsx

@@ -1,9 +1,9 @@
 import useGlobalStore from '@/config/use-global';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { Icon } from '@iconify/react/dist/iconify.js';
 import { Button } from '@workspace/ui/components/button';
 import { Form, FormControl, FormField, FormItem, FormMessage } from '@workspace/ui/components/form';
 import { Input } from '@workspace/ui/components/input';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { Markdown } from '@workspace/ui/custom-components/markdown';
 import { useTranslations } from 'next-intl';
 import { Dispatch, SetStateAction } from 'react';
@@ -102,12 +102,7 @@ export default function RegisterForm({
               render={({ field }) => (
                 <FormItem>
                   <FormControl>
-                    <Input
-                      disabled={loading}
-                      placeholder='Enter your password...'
-                      type='password'
-                      {...field}
-                    />
+                    <Input placeholder='Enter your password...' type='password' {...field} />
                   </FormControl>
                   <FormMessage />
                 </FormItem>

apps/user/app/auth/email/reset-form.tsx

@@ -1,9 +1,9 @@
 import useGlobalStore from '@/config/use-global';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { Icon } from '@iconify/react/dist/iconify.js';
 import { Button } from '@workspace/ui/components/button';
 import { Form, FormControl, FormField, FormItem, FormMessage } from '@workspace/ui/components/form';
 import { Input } from '@workspace/ui/components/input';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { useTranslations } from 'next-intl';
 import { Dispatch, SetStateAction } from 'react';
 import { useForm } from 'react-hook-form';
@@ -65,12 +65,7 @@ export default function ResetForm({
             render={({ field }) => (
               <FormItem>
                 <FormControl>
-                  <Input
-                    disabled={loading}
-                    placeholder='Enter your password...'
-                    type='password'
-                    {...field}
-                  />
+                  <Input placeholder='Enter your password...' type='password' {...field} />
                 </FormControl>
                 <FormMessage />
               </FormItem>

apps/user/app/auth/phone/login-form.tsx

@@ -1,10 +1,10 @@
 import useGlobalStore from '@/config/use-global';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { Icon } from '@iconify/react/dist/iconify.js';
 import { Button } from '@workspace/ui/components/button';
 import { Form, FormControl, FormField, FormItem, FormMessage } from '@workspace/ui/components/form';
 import { Input } from '@workspace/ui/components/input';
 import { AreaCodeSelect } from '@workspace/ui/custom-components/area-code-select';
+import { Icon } from '@workspace/ui/custom-components/icon';
 
 import { useTranslations } from 'next-intl';
 import { Dispatch, SetStateAction, useState } from 'react';
@@ -99,7 +99,6 @@ export default function LoginForm({
                 <FormControl>
                   <div className='flex gap-2'>
                     <Input
-                      disabled={loading}
                       placeholder={mode === 'code' ? 'Enter code...' : 'Enter password...'}
                       type={mode === 'code' ? 'text' : 'password'}
                       {...field}

apps/user/app/auth/phone/register-form.tsx

@@ -1,10 +1,10 @@
 import useGlobalStore from '@/config/use-global';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { Icon } from '@iconify/react/dist/iconify.js';
 import { Button } from '@workspace/ui/components/button';
 import { Form, FormControl, FormField, FormItem, FormMessage } from '@workspace/ui/components/form';
 import { Input } from '@workspace/ui/components/input';
 import { AreaCodeSelect } from '@workspace/ui/custom-components/area-code-select';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { Markdown } from '@workspace/ui/custom-components/markdown';
 import { useTranslations } from 'next-intl';
 import { Dispatch, SetStateAction } from 'react';
@@ -116,12 +116,7 @@ export default function RegisterForm({
               render={({ field }) => (
                 <FormItem>
                   <FormControl>
-                    <Input
-                      disabled={loading}
-                      placeholder='Enter your password...'
-                      type='password'
-                      {...field}
-                    />
+                    <Input placeholder='Enter your password...' type='password' {...field} />
                   </FormControl>
                   <FormMessage />
                 </FormItem>

apps/user/app/auth/phone/reset-form.tsx

@@ -1,10 +1,10 @@
 import useGlobalStore from '@/config/use-global';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { Icon } from '@iconify/react/dist/iconify.js';
 import { Button } from '@workspace/ui/components/button';
 import { Form, FormControl, FormField, FormItem, FormMessage } from '@workspace/ui/components/form';
 import { Input } from '@workspace/ui/components/input';
 import { AreaCodeSelect } from '@workspace/ui/custom-components/area-code-select';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { useTranslations } from 'next-intl';
 import { Dispatch, SetStateAction, useState } from 'react';
 import { useForm } from 'react-hook-form';
@@ -97,12 +97,7 @@ export default function ResetForm({
             render={({ field }) => (
               <FormItem>
                 <FormControl>
-                  <Input
-                    disabled={loading}
-                    placeholder='Enter your password...'
-                    type='password'
-                    {...field}
-                  />
+                  <Input placeholder='Enter your password...' type='password' {...field} />
                 </FormControl>
                 <FormMessage />
               </FormItem>
@@ -118,7 +113,6 @@ export default function ResetForm({
                   <FormControl>
                     <div className='flex items-center gap-2'>
                       <Input
-                        disabled={loading}
                         placeholder='Enter code...'
                         type='text'
                         {...field}