feat: add internationalization support

src/pages/tools/video/change-speed/index.tsx

@@ -9,6 +9,7 @@ import ToolFileResult from '@components/result/ToolFileResult';
 import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
 import { FFmpeg } from '@ffmpeg/ffmpeg';
 import { fetchFile } from '@ffmpeg/util';
+import { useTranslation } from 'react-i18next';
 
 const initialValues: InitialValuesType = {
   newSpeed: 2
@@ -18,6 +19,7 @@ export default function ChangeSpeed({
   title,
   longDescription
 }: ToolComponentProps) {
+  const { t } = useTranslation();
   const [input, setInput] = useState<File | null>(null);
   const [result, setResult] = useState<File | null>(null);
   const [loading, setLoading] = useState(false);
@@ -128,13 +130,13 @@ export default function ChangeSpeed({
     updateField
   }) => [
     {
-      title: 'New Video Speed',
+      title: t('video.changeSpeed.newVideoSpeed'),
       component: (
         <Box>
           <TextFieldWithDesc
             value={values.newSpeed.toString()}
             onOwnChange={(val) => updateField('newSpeed', Number(val))}
-            description="Default multiplier: 2 means 2x faster"
+            description={t('video.changeSpeed.defaultMultiplier')}
             type="number"
           />
         </Box>
@@ -149,21 +151,32 @@ export default function ChangeSpeed({
         <ToolVideoInput
           value={input}
           onChange={setInput}
-          title={'Input Video'}
+          title={t('video.changeSpeed.inputTitle')}
         />
       }
       resultComponent={
         loading ? (
-          <ToolFileResult title="Setting Speed" value={null} loading={true} />
+          <ToolFileResult
+            title={t('video.changeSpeed.settingSpeed')}
+            value={null}
+            loading={true}
+          />
         ) : (
-          <ToolFileResult title="Edited Video" value={result} extension="mp4" />
+          <ToolFileResult
+            title={t('video.changeSpeed.resultTitle')}
+            value={result}
+            extension="mp4"
+          />
         )
       }
       initialValues={initialValues}
       getGroups={getGroups}
       setInput={setInput}
       compute={compute}
-      toolInfo={{ title: `What is a ${title}?`, description: longDescription }}
+      toolInfo={{
+        title: t('video.changeSpeed.toolInfo.title', { title }),
+        description: longDescription
+      }}
     />
   );
 }

src/pages/tools/video/change-speed/meta.ts

@@ -2,12 +2,17 @@ import { defineTool } from '@tools/defineTool';
 import { lazy } from 'react';
 
 export const tool = defineTool('video', {
-  name: 'Change speed',
+  name: 'Change Video Speed',
   path: 'change-speed',
-  icon: 'material-symbols-light:speed-outline',
+  icon: 'material-symbols:speed',
   description:
-    'This online utility lets you change the speed of a video. You can speed it up or slow it down.',
-  shortDescription: 'Quickly change video speed',
-  keywords: ['change', 'speed'],
-  component: lazy(() => import('./index'))
+    'Change the playback speed of video files. Speed up or slow down videos while maintaining audio synchronization. Supports various speed multipliers and common video formats.',
+  shortDescription: 'Change video playback speed',
+  keywords: ['video', 'speed', 'playback', 'fast', 'slow'],
+  component: lazy(() => import('./index')),
+  i18n: {
+    name: 'video.changeSpeed.name',
+    description: 'video.changeSpeed.description',
+    shortDescription: 'video.changeSpeed.shortDescription'
+  }
 });