chore: add full languages array

.idea/workspace.xml

@@ -4,11 +4,11 @@
     <option name="autoReloadType" value="SELECTIVE" />
   </component>
   <component name="ChangeListManager">
-    <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="feat: password generator to test translation">
+    <list default="true" id="b30e2810-c4c1-4aad-b134-794e52cc1c7d" name="Changes" comment="docs: translation docs">
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/README.md" beforeDir="false" afterPath="$PROJECT_DIR$/README.md" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/src/components/Navbar/index.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Navbar/index.tsx" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/i18n/index.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/i18n/index.ts" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -326,7 +326,7 @@
       <recent name="C:\Users\Ibrahima\IdeaProjects\omni-tools\src\pages\categories" />
     </key>
   </component>
-  <component name="RunManager" selected="Vitest.generatePassword">
+  <component name="RunManager" selected="npm.dev">
     <configuration name="generatePassword" type="JavaScriptTestRunnerVitest" temporary="true" nameIsGenerated="true">
       <node-interpreter value="project" />
       <vitest-package value="$PROJECT_DIR$/node_modules/vitest" />
@@ -400,10 +400,10 @@
     </list>
     <recent_temporary>
       <list>
-        <item itemvalue="Vitest.generatePassword" />
         <item itemvalue="npm.dev" />
-        <item itemvalue="npm.i18n:sync" />
         <item itemvalue="npm.i18n:pull" />
+        <item itemvalue="Vitest.generatePassword" />
+        <item itemvalue="npm.i18n:sync" />
         <item itemvalue="npm.i18n:push" />
       </list>
     </recent_temporary>
@@ -517,15 +517,7 @@
       <workItem from="1752157409587" duration="2415000" />
       <workItem from="1752403829295" duration="13253000" />
       <workItem from="1752493585622" duration="11629000" />
-      <workItem from="1752507105323" duration="7873000" />
+      <workItem from="1752507105323" duration="9008000" />
-    </task>
-    <task id="LOCAL-00183" summary="refactor: compress pdf">
-      <option name="closed" value="true" />
-      <created>1743644703041</created>
-      <option name="number" value="00183" />
-      <option name="presentableId" value="LOCAL-00183" />
-      <option name="project" value="LOCAL" />
-      <updated>1743644703042</updated>
     </task>
     <task id="LOCAL-00184" summary="refactor: lib">
       <option name="closed" value="true" />
@@ -911,7 +903,15 @@
       <option name="project" value="LOCAL" />
       <updated>1752514466233</updated>
     </task>
-    <option name="localTasksCounter" value="232" />
+    <task id="LOCAL-00232" summary="docs: translation docs">
+      <option name="closed" value="true" />
+      <created>1752515675314</created>
+      <option name="number" value="00232" />
+      <option name="presentableId" value="LOCAL-00232" />
+      <option name="project" value="LOCAL" />
+      <updated>1752515675314</updated>
+    </task>
+    <option name="localTasksCounter" value="233" />
     <servers />
   </component>
   <component name="TypeScriptGeneratedFilesManager">
@@ -958,7 +958,6 @@
     <option name="CHECK_CODE_SMELLS_BEFORE_PROJECT_COMMIT" value="false" />
     <option name="CHECK_NEW_TODO" value="false" />
     <option name="ADD_EXTERNAL_FILES_SILENTLY" value="true" />
-    <MESSAGE value="chore: remove flip x and y" />
     <MESSAGE value="chore: new logo and font" />
     <MESSAGE value="chore: white logo" />
     <MESSAGE value="chore: png icon" />
@@ -983,7 +982,8 @@
     <MESSAGE value="fix: translations" />
     <MESSAGE value="fix: translation related behaviors" />
     <MESSAGE value="feat: password generator to test translation" />
-    <option name="LAST_COMMIT_MESSAGE" value="feat: password generator to test translation" />
+    <MESSAGE value="docs: translation docs" />
+    <option name="LAST_COMMIT_MESSAGE" value="docs: translation docs" />
   </component>
   <component name="VgoProject">
     <integration-enabled>false</integration-enabled>

README.md

@@ -154,14 +154,13 @@ We use **[Locize](https://locize.com)** for managing translations.
 
 ### 🔁 Workflow
 
-1. **Join the Locize project** via the [invitation link](https://www.locize.app/register?invitation=Uk9mvOCKkB7sjuUqI5jDBjZROveZIvdBQqzrpmB4oQtT1LNB4BnzzT0S0o1gx79N).
+1. Join the Locize project** via the [invitation link](https://www.locize.app/register?invitation=Uk9mvOCKkB7sjuUqI5jDBjZROveZIvdBQqzrpmB4oQtT1LNB4BnzzT0S0o1gx79N).
-
+2. Make sure `LOCIZE_API_KEY` is available in your environment (e.g., in `.env`). You can get it from API, CDN, NOTIFICATIONS
-2. **Pull latest translations** before editing:
+3. Pull latest translations** before editing:
    ```bash
    npm run i18n:pull
    ```
-3. **Edit translation files** in `public/locales/{lang}/{namespace}.json`.
+4. **Edit translation files** in `public/locales/{lang}/{namespace}.json`.
-4. Make sure `LOCIZE_API_KEY` is available in your environment (e.g., in `.env`).
 5. **Push your changes** after editing:
    ```bash
    npm run i18n:sync

package.json

@@ -24,7 +24,7 @@
     "lint": "eslint src --max-warnings=0 --fix",
     "typecheck": "tsc --project tsconfig.json --noEmit",
     "prepare": "husky install",
-    "i18n:pull": "locize download --project-id e7156a3e-66fb-4035-a0f0-cebf1c63a3ba --api-key $LOCIZE_API_KEY --path ./public/locales",
+    "i18n:pull": "locize download --project-id e7156a3e-66fb-4035-a0f0-cebf1c63a3ba --path ./public/locales",
     "i18n:sync": "locize sync --project-id e7156a3e-66fb-4035-a0f0-cebf1c63a3ba --path ./public/locales --update-values true"
   },
   "dependencies": {

src/components/Navbar/index.tsx

@@ -28,6 +28,18 @@ interface NavbarProps {
   mode: Mode;
   onChangeMode: () => void;
 }
+const languages = [
+  { code: 'en', label: 'English' },
+  { code: 'de', label: 'Deutsch' },
+  { code: 'es', label: 'Español' },
+  { code: 'fr', label: 'Français' },
+  { code: 'pt', label: 'Português' },
+  { code: 'ja', label: '日本語' },
+  { code: 'hi', label: 'हिंदी' },
+  { code: 'nl', label: 'Nederlands' },
+  { code: 'ru', label: 'Русский' },
+  { code: 'zh', label: '中文' }
+];
 
 const Navbar: React.FC<NavbarProps> = ({
   mode,
@@ -75,8 +87,11 @@ const Navbar: React.FC<NavbarProps> = ({
           }
         }}
       >
-        <MenuItem value="en">English</MenuItem>
+        {languages.map((lang) => (
-        <MenuItem value="hi">हिंदी</MenuItem>
+          <MenuItem key={lang.code} value={lang.code}>
+            {lang.label}
+          </MenuItem>
+        ))}
       </Select>
     </FormControl>
   );