🐛 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}

apps/user/components/announcement/index.tsx

@@ -1,7 +1,7 @@
 import { queryAnnouncement } from '@/services/user/announcement';
-import { Icon } from '@iconify/react';
 import { Card } from '@workspace/ui/components/card';
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@workspace/ui/components/dialog';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { Markdown } from '@workspace/ui/custom-components/markdown';
 import { getTranslations } from 'next-intl/server';
 import { Empty } from '../empty';

apps/user/components/footer.tsx

@@ -10,8 +10,8 @@ import {
   NEXT_PUBLIC_TWITTER_LINK,
 } from '@/config/constants';
 import useGlobalStore from '@/config/use-global';
-import { Icon } from '@iconify/react/dist/iconify.js';
 import { Separator } from '@workspace/ui/components/separator';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { useTranslations } from 'next-intl';
 import Link from 'next/link';
 import { Fragment } from 'react';

apps/user/components/language-switch.tsx

@@ -2,7 +2,6 @@
 
 import { locales } from '@/config/constants';
 import { setLocale } from '@/utils/common';
-import { Icon } from '@iconify/react';
 import {
   Select,
   SelectContent,
@@ -10,6 +9,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from '@workspace/ui/components/select';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { getCountry } from '@workspace/ui/utils';
 import { useLocale, useTranslations } from 'next-intl';
 import { useRouter } from 'next/navigation';

apps/user/components/main/product-showcase.tsx

@@ -3,11 +3,11 @@
 import { Display } from '@/components/display';
 import { SubscribeDetail } from '@/components/subscribe/detail';
 import { getSubscription } from '@/services/common/common';
-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 { Icon } from '@workspace/ui/custom-components/icon';
 import { cn } from '@workspace/ui/lib/utils';
 import { motion } from 'framer-motion';
 import { useTranslations } from 'next-intl';

apps/user/components/user-nav.tsx

@@ -3,7 +3,6 @@
 import { navs } from '@/config/navs';
 import useGlobalStore from '@/config/use-global';
 import { Logout } from '@/utils/common';
-import { Icon } from '@iconify/react';
 import { Avatar, AvatarFallback, AvatarImage } from '@workspace/ui/components/avatar';
 import { Button } from '@workspace/ui/components/button';
 import {
@@ -15,6 +14,7 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from '@workspace/ui/components/dropdown-menu';
+import { Icon } from '@workspace/ui/custom-components/icon';
 import { useTranslations } from 'next-intl';
 import { useRouter } from 'next/navigation';
 

apps/user/package.json

@@ -10,7 +10,6 @@
     "start": "next start"
   },
   "dependencies": {
-    "@iconify/react": "^5.2.0",
     "@stripe/react-stripe-js": "^3.1.1",
     "@stripe/stripe-js": "^5.5.0",
     "@tanstack/react-query": "^5.63.0",

apps/user/services/common/common.ts

@@ -2,6 +2,14 @@
 /* eslint-disable */
 import request from '@/utils/request';
 
+/** Get Tos Content GET /v1/common/app/info */
+export async function getAppInfo(options?: { [key: string]: any }) {
+  return request<API.Response & { data?: API.GetAppInfoResponse }>('/v1/common/app/info', {
+    method: 'GET',
+    ...(options || {}),
+  });
+}
+
 /** Get verification code POST /v1/common/send_code */
 export async function sendEmailCode(body: API.SendCodeRequest, options?: { [key: string]: any }) {
   return request<API.Response & { data?: API.SendCodeResponse }>('/v1/common/send_code', {

apps/user/services/common/typings.d.ts

@@ -10,21 +10,59 @@ declare namespace API {
     updated_at: number;
   };
 
+  type AppConfig = {
+    name: string;
+    domains: string[];
+    describe: string;
+    startup_picture: string;
+    startup_picture_skip_time: number;
+  };
+
   type Application = {
     id: number;
-    name: string;
-    platform: string;
-    subscribe_type: string;
     icon: string;
-    url: string;
+    name: string;
+    description: string;
+    subscribe_type: string;
+  };
+
+  type ApplicationPlatform = {
+    ios?: ApplicationVersion[];
+    mac?: ApplicationVersion[];
+    linux?: ApplicationVersion[];
+    android?: ApplicationVersion[];
+    windows?: ApplicationVersion[];
+    harmony?: ApplicationVersion[];
   };
 
   type ApplicationResponse = {
-    windows: Application[];
-    mac: Application[];
-    linux: Application[];
-    android: Application[];
-    ios: Application[];
+    applications: ApplicationResponseInfo[];
+  };
+
+  type ApplicationResponseInfo = {
+    id: number;
+    name: string;
+    icon: string;
+    description: string;
+    subscription_protocol: string;
+    platform: ApplicationPlatform;
+  };
+
+  type ApplicationVersion = {
+    id: number;
+    url: string;
+    version: string;
+    description: string;
+    is_default: boolean;
+  };
+
+  type AppVersion = {
+    id: number;
+    os: string;
+    version: string;
+    download_url: string;
+    describe: string;
+    default_version: boolean;
   };
 
   type AuthConfig = {
@@ -113,6 +151,11 @@ declare namespace API {
     created_at: number;
   };
 
+  type GetAppInfoResponse = {
+    config: AppConfig;
+    versions: AppVersion[];
+  };
+
   type GetGlobalConfigResponse = {
     site: SiteConfig;
     verify: VeifyConfig;

apps/user/services/user/typings.d.ts

@@ -10,21 +10,59 @@ declare namespace API {
     updated_at: number;
   };
 
+  type AppConfig = {
+    name: string;
+    domains: string[];
+    describe: string;
+    startup_picture: string;
+    startup_picture_skip_time: number;
+  };
+
   type Application = {
     id: number;
-    name: string;
-    platform: string;
-    subscribe_type: string;
     icon: string;
-    url: string;
+    name: string;
+    description: string;
+    subscribe_type: string;
+  };
+
+  type ApplicationPlatform = {
+    ios?: ApplicationVersion[];
+    mac?: ApplicationVersion[];
+    linux?: ApplicationVersion[];
+    android?: ApplicationVersion[];
+    windows?: ApplicationVersion[];
+    harmony?: ApplicationVersion[];
   };
 
   type ApplicationResponse = {
-    windows: Application[];
-    mac: Application[];
-    linux: Application[];
-    android: Application[];
-    ios: Application[];
+    applications: ApplicationResponseInfo[];
+  };
+
+  type ApplicationResponseInfo = {
+    id: number;
+    name: string;
+    icon: string;
+    description: string;
+    subscription_protocol: string;
+    platform: ApplicationPlatform;
+  };
+
+  type ApplicationVersion = {
+    id: number;
+    url: string;
+    version: string;
+    description: string;
+    is_default: boolean;
+  };
+
+  type AppVersion = {
+    id: number;
+    os: string;
+    version: string;
+    download_url: string;
+    describe: string;
+    default_version: boolean;
   };
 
   type AuthConfig = {