trans

client/src/components/ClaimTokensButton/ClaimTokensButton.jsx

@@ -1,8 +1,10 @@
 import React, { useEffect, useState } from 'react';
 import axios from 'axios';
 import { FaRegThumbsUp, FaSpinner } from 'react-icons/fa';
+import { useLocalize } from '~/hooks';
 
 const ClaimTokensButton = ({ refetchBalance }) => {
+  const localize = useLocalize();
   const [isActive, setIsActive] = useState(false);
   const [countdown, setCountdown] = useState(0);
   const [isSuccess, setIsSuccess] = useState(false);
@@ -90,12 +92,17 @@ const ClaimTokensButton = ({ refetchBalance }) => {
           {isLoading ? (
             <span className="flex items-center">
               <FaSpinner className="mr-2 animate-spin" />
-              Loading...
             </span>
           ) : (
             <>
               <span className={`${isSuccess ? 'invisible' : ''}`}>
-                {isActive ? 'Claim 20K Tokens' : `Claim in ${formatTime(countdown)}`}
+                {isActive ? (
+                  localize('claim_active')
+                ) : (
+                  <>
+                    {localize('claim_inactive')} {formatTime(countdown)}
+                  </>
+                )}
               </span>
               {isSuccess && (
                 <span className="absolute inset-0 flex items-center justify-center animate-in fade-in">

client/src/localization/languages/Eng.ts

@@ -614,4 +614,6 @@ export default {
   home_feature_4: '• All your favorite AI models under one roof',
   home_feature_5: '• Flexibility to purchase additional tokens as needed',
   home_feature_6: '• User-friendly experience tailored to your requirements',
+  claim_active: 'Claim 20K Tokens',
+  claim_inactive: 'Claim in',
 };

client/src/localization/languages/Zh.ts

@@ -552,4 +552,6 @@ export default {
   home_feature_4: '• 多款热门 AI 模型,一站即可体验',
   home_feature_5: '• 根据需要灵活购买额外的算力',
   home_feature_6: '• 根据您的需求量身定制的用户友好体验',
+  claim_active: '领取 20k 算力',
+  claim_inactive: '领取倒计时',
 };