chore: i18n in meta

src/i18n/index.ts

@@ -70,12 +70,9 @@ export type FullI18nKey = {
 }[I18nNamespaces];
 
 i18n.use(Backend).use(initReactI18next).init({
-  resources,
   lng: 'en',
   fallbackLng: 'en',
-  backend: locizeOptions,
+  backend: locizeOptions
-  saveMissing: true, // Send missing keys to Locize
-  updateMissing: true // Update keys in Locize
 });
 
 export default i18n;

src/pages/tools-by-category/index.tsx

@@ -2,8 +2,8 @@ import {
   Box,
   Divider,
   Stack,
-  TextField,
   styled,
+  TextField,
   useTheme
 } from '@mui/material';
 import Grid from '@mui/material/Grid';
@@ -11,16 +11,16 @@ import Typography from '@mui/material/Typography';
 import { Link, useNavigate, useParams } from 'react-router-dom';
 import { filterTools, getToolsByCategory } from '../../tools';
 import Hero from 'components/Hero';
-import { capitalizeFirstLetter, getToolCategoryTitle } from '@utils/string';
+import { getToolCategoryTitle } from '@utils/string';
 import { Icon } from '@iconify/react';
 import { categoriesColors } from 'config/uiConfig';
 import React, { useEffect } from 'react';
 import IconButton from '@mui/material/IconButton';
-import { ArrowBack } from '@mui/icons-material';
-import BackButton from '@components/BackButton';
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
 import SearchIcon from '@mui/icons-material/Search';
 import { Helmet } from 'react-helmet';
+import { useTranslation } from 'react-i18next';
+import { I18nNamespaces } from '../../i18n';
 
 const StyledLink = styled(Link)(({ theme }) => ({
   '&:hover': {
@@ -34,7 +34,15 @@ export default function ToolsByCategory() {
   const { categoryName } = useParams();
   const [searchTerm, setSearchTerm] = React.useState<string>('');
   const rawTitle = getToolCategoryTitle(categoryName as string);
-
+  const categoryTools = filterTools(
+    getToolsByCategory().find(({ type }) => type === categoryName)?.tools ?? [],
+    searchTerm
+  );
+  const { t } = useTranslation(
+    categoryTools.length
+      ? (categoryTools[0].name.split(':')[0] as I18nNamespaces)
+      : 'translation'
+  );
   useEffect(() => {
     if (mainContentRef.current) {
       mainContentRef.current.scrollIntoView({ behavior: 'smooth' });
@@ -82,11 +90,7 @@ export default function ToolsByCategory() {
           />
         </Stack>
         <Grid container spacing={2} mt={2}>
-          {filterTools(
+          {categoryTools.map((tool, index) => (
-            getToolsByCategory().find(({ type }) => type === categoryName)
-              ?.tools ?? [],
-            searchTerm
-          ).map((tool, index) => (
             <Grid item xs={12} md={6} lg={4} key={tool.path}>
               <Stack
                 sx={{
@@ -120,10 +124,10 @@ export default function ToolsByCategory() {
                     }}
                     to={'/' + tool.path}
                   >
-                    {tool.name}
+                    {t(tool.name)}
                   </StyledLink>
                   <Typography sx={{ mt: 2 }}>
-                    {tool.shortDescription}
+                    {t(tool.shortDescription)}
                   </Typography>
                 </Box>
               </Stack>

src/pages/tools/audio/i18n/en.json

@@ -11,7 +11,6 @@
       "title": "What is {{title}}?",
       "description": "This tool allows you to extract the audio track from video files. You can choose from different audio formats including AAC, MP3, and WAV."
     },
-    "title": "Extract audio",
     "shortDescription": "Extract audio from video files (MP4, MOV, etc.) to AAC, MP3, or WAV."
   },
   "changeSpeed": {
@@ -27,8 +26,7 @@
     "toolInfo": {
       "title": "What is {{title}}?",
       "description": ""
-    },
+    }
-    "title": "Change audio speed"
   },
   "mergeAudio": {
     "title": "Merge Audio",

src/pages/tools/string/i18n/en.json

@@ -4,7 +4,6 @@
     "description": "Convert text to uppercase letters.",
     "inputTitle": "Input text",
     "resultTitle": "Uppercase text",
-    "title": "Uppercase",
     "shortDescription": "Convert text to uppercase"
   },
   "base64": {
@@ -19,7 +18,6 @@
       "title": "What is Base64?",
       "description": "Base64 is an encoding scheme that represents data in an ASCII string format by translating it into a radix-64 representation. Although it can be used to encode strings, it is commonly used to encode binary data for transmission over media that are designed to deal with textual data."
     },
-    "title": "Base64",
     "shortDescription": "Encode or decode data using Base64."
   },
   "truncate": {
@@ -45,7 +43,6 @@
       "title": "Truncate text",
       "description": "Load your text in the input form on the left and you will automatically get truncated text on the right."
     },
-    "title": "Truncate",
     "shortDescription": "Truncate text to a specified length"
   },
   "quote": {
@@ -63,7 +60,6 @@
       "title": "Text Quoter",
       "description": "This tool allows you to add quotes around text. You can choose different quote characters, handle multi-line text, and control how empty lines are processed. It's useful for preparing text for programming, formatting data, or creating stylized text."
     },
-    "title": "Quote",
     "shortDescription": "Add quotes around text with various styles"
   },
   "join": {
@@ -83,7 +79,6 @@
       "title": "What Is a Text Joiner?",
       "description": "With this tool you can join parts of the text together. It takes a list of text values, separated by newlines, and merges them together. You can set the character that will be placed between the parts of the combined text. Also, you can ignore all empty lines and remove spaces and tabs at the end of all lines. Textabulous!"
     },
-    "title": "Join",
     "shortDescription": "Join text elements with a specified separator"
   },
   "rotate": {
@@ -100,7 +95,6 @@
       "title": "String Rotation",
       "description": "This tool allows you to rotate characters in a string by a specified number of positions. You can rotate to the left or right, and process multi-line text by rotating each line separately. String rotation is useful for simple text transformations, creating patterns, or implementing basic encryption techniques."
     },
-    "title": "Rotate",
     "shortDescription": "Shift characters in text by position."
   },
   "repeat": {
@@ -118,7 +112,6 @@
       "title": "Repeat text",
       "description": "This tool allows you to repeat a given text multiple times with an optional separator."
     },
-    "title": "Repeat text",
     "shortDescription": "Repeat text multiple times"
   },
   "rot13": {
@@ -130,11 +123,9 @@
       "title": "What Is ROT13?",
       "description": "ROT13 (rotate by 13 places) is a simple letter substitution cipher that replaces a letter with the 13th letter after it in the alphabet. ROT13 is a special case of the Caesar cipher which was developed in ancient Rome. Because there are 26 letters in the English alphabet, ROT13 is its own inverse; that is, to undo ROT13, the same algorithm is applied, so the same action can be used for encoding and decoding."
     },
-    "title": "Rot13",
     "shortDescription": "Encode or decode text using ROT13 cipher."
   },
   "toMorse": {
-    "title": "To Morse",
     "description": "Convert text to Morse code.",
     "resultTitle": "Morse code",
     "shortSignal": "Short Signal",
@@ -165,7 +156,6 @@
       "title": "What is a {{title}}?",
       "description": "This tool allows you to analyze text and generate comprehensive statistics including character count, word count, line count, and frequency analysis of characters and words."
     },
-    "title": "Text Statistics",
     "shortDescription": "Get statistics about your text"
   },
   "textReplacer": {

src/tools/defineTool.tsx

@@ -70,10 +70,10 @@ export const defineTool = (
   return {
     type: basePath,
     path: `${basePath}/${path}`,
-    name,
+    name: i18n?.name || name,
     icon,
-    description,
+    description: i18n?.description || description,
-    shortDescription,
+    shortDescription: i18n?.shortDescription || shortDescription,
     keywords,
     component: () => {
       return (