Merge pull request #1889 from comeback01/traduction

 feat(i18n): Add French language support.

README.en.md

 <p align="right">
-   <a href="./README.md">中文</a> | <strong>English</strong>
+   <a href="./README.md">中文</a> | <strong>English</strong> | <a href="./README.fr.md">Français</a>
 </p>
 <div align="center">
 

README.md

 <p align="right">
-   <strong>中文</strong> | <a href="./README.en.md">English</a>
+   <strong>中文</strong> | <a href="./README.en.md">English</a> | <a href="./README.fr.md">Français</a>
 </p>
 <div align="center">
 

web/src/components/layout/headerbar/LanguageSelector.jsx

@@ -20,7 +20,7 @@ For commercial licensing, please contact support@quantumnous.com
 import React from 'react';
 import { Button, Dropdown } from '@douyinfe/semi-ui';
 import { Languages } from 'lucide-react';
-import { CN, GB } from 'country-flag-icons/react/3x2';
+import { CN, GB, FR } from 'country-flag-icons/react/3x2';
 
 const LanguageSelector = ({ currentLang, onLanguageChange, t }) => {
   return (
@@ -42,12 +42,19 @@ const LanguageSelector = ({ currentLang, onLanguageChange, t }) => {
             <GB title='English' className='!w-5 !h-auto' />
             <span>English</span>
           </Dropdown.Item>
+          <Dropdown.Item
+            onClick={() => onLanguageChange('fr')}
+            className={`!flex !items-center !gap-2 !px-3 !py-1.5 !text-sm !text-semi-color-text-0 dark:!text-gray-200 ${currentLang === 'fr' ? '!bg-semi-color-primary-light-default dark:!bg-blue-600 !font-semibold' : 'hover:!bg-semi-color-fill-1 dark:hover:!bg-gray-600'}`}
+          >
+            <FR title='Français' className='!w-5 !h-auto' />
+            <span>Français</span>
+          </Dropdown.Item>
         </Dropdown.Menu>
       }
     >
       <Button
         icon={<Languages size={18} />}
-        aria-label={t('切换语言')}
+        aria-label={t('common.changeLanguage')}
         theme='borderless'
         type='tertiary'
         className='!p-1.5 !text-current focus:!bg-semi-color-fill-1 dark:focus:!bg-gray-700 !rounded-full !bg-semi-color-fill-0 dark:!bg-semi-color-fill-1 hover:!bg-semi-color-fill-1 dark:hover:!bg-semi-color-fill-2'

web/src/i18n/i18n.js

@@ -22,6 +22,7 @@ import { initReactI18next } from 'react-i18next';
 import LanguageDetector from 'i18next-browser-languagedetector';
 
 import enTranslation from './locales/en.json';
+import frTranslation from './locales/fr.json';
 import zhTranslation from './locales/zh.json';
 
 i18n
@@ -36,6 +37,9 @@ i18n
       zh: {
         translation: zhTranslation,
       },
+      fr: {
+        translation: frTranslation,
+      },
     },
     fallbackLng: 'zh',
     interpolation: {

web/src/i18n/locales/en.json

@@ -2130,5 +2130,8 @@
   "域名IP过滤详细说明": "⚠️ This is an experimental option. A domain may resolve to multiple IPv4/IPv6 addresses. If enabled, ensure the IP filter list covers these addresses, otherwise access may fail.",
   "域名黑名单": "Domain Blacklist",
   "白名单": "Whitelist",
-  "黑名单": "Blacklist"
+  "黑名单": "Blacklist",
+  "common": {
+    "changeLanguage": "Change Language"
+  }
 }

web/src/i18n/locales/zh.json

@@ -33,5 +33,8 @@
   "输入端口后回车，如：80 或 8000-8999": "输入端口后回车，如：80 或 8000-8999",
   "更新SSRF防护设置": "更新SSRF防护设置",
   "域名IP过滤详细说明": "⚠️此功能为实验性选项，域名可能解析到多个 IPv4/IPv6 地址，若开启，请确保 IP 过滤列表覆盖这些地址，否则可能导致访问失败。",
+  "common": {
+    "changeLanguage": "切换语言"
+  },
   "允许在 Stripe 支付中输入促销码": "允许在 Stripe 支付中输入促销码"
 }