feat: add internationalization support

src/pages/tools/video/flip/index.tsx

@@ -10,6 +10,7 @@ import ToolVideoInput from '@components/input/ToolVideoInput';
 import { flipVideo } from './service';
 import { FlipOrientation, InitialValuesType } from './types';
 import SimpleRadio from '@components/options/SimpleRadio';
+import { useTranslation } from 'react-i18next';
 
 export const initialValues: InitialValuesType = {
   orientation: 'horizontal'
@@ -30,6 +31,7 @@ const orientationOptions: { value: FlipOrientation; label: string }[] = [
 ];
 
 export default function FlipVideo({ title }: ToolComponentProps) {
+  const { t } = useTranslation();
   const [input, setInput] = useState<File | null>(null);
   const [result, setResult] = useState<File | null>(null);
   const [loading, setLoading] = useState(false);
@@ -58,13 +60,13 @@ export default function FlipVideo({ title }: ToolComponentProps) {
     updateField
   }) => [
     {
-      title: 'Orientation',
+      title: t('video.flip.orientation'),
       component: (
         <Box>
           {orientationOptions.map((orientationOption) => (
             <SimpleRadio
               key={orientationOption.value}
-              title={orientationOption.label}
+              title={t(`video.flip.${orientationOption.value}Label`)}
               checked={values.orientation === orientationOption.value}
               onClick={() => {
                 updateField('orientation', orientationOption.value);
@@ -84,20 +86,20 @@ export default function FlipVideo({ title }: ToolComponentProps) {
         <ToolVideoInput
           value={input}
           onChange={setInput}
-          title={'Input Video'}
+          title={t('video.flip.inputTitle')}
         />
       }
       resultComponent={
         loading ? (
           <ToolFileResult
-            title={'Flipping Video'}
+            title={t('video.flip.flippingVideo')}
             value={null}
             loading={true}
             extension={''}
           />
         ) : (
           <ToolFileResult
-            title={'Flipped Video'}
+            title={t('video.flip.resultTitle')}
             value={result}
             extension={'mp4'}
           />

src/pages/tools/video/flip/meta.ts

@@ -4,12 +4,15 @@ import { lazy } from 'react';
 export const tool = defineTool('video', {
   name: 'Flip Video',
   path: 'flip',
-  icon: 'mdi:flip-horizontal',
+  icon: 'material-symbols:flip',
   description:
-    'This online utility allows you to flip videos horizontally or vertically. You can preview the flipped video before processing. Supports common video formats like MP4, WebM, and OGG.',
-  shortDescription: 'Flip videos horizontally or vertically',
-  keywords: ['flip', 'video', 'mirror', 'edit', 'horizontal', 'vertical'],
-  longDescription:
-    'Easily flip your videos horizontally (mirror) or vertically (upside down) with this simple online tool.',
-  component: lazy(() => import('./index'))
+    'Flip video files horizontally or vertically. Mirror videos for special effects or correct orientation issues.',
+  shortDescription: 'Flip video horizontally or vertically',
+  keywords: ['video', 'flip', 'mirror', 'horizontal', 'vertical'],
+  component: lazy(() => import('./index')),
+  i18n: {
+    name: 'video.flip.name',
+    description: 'video.flip.description',
+    shortDescription: 'video.flip.shortDescription'
+  }
 });