From 63c73bc6d94ef5dd3a259961bd92e0ab8945aef5 Mon Sep 17 00:00:00 2001
From: Kshitij <kshitijk@tuta.io>
Date: Mon, 23 Jun 2025 20:22:06 +0530
Subject: [PATCH] Added guide for translation!

---
 TRANSLATION.md | 156 +++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 156 insertions(+)
 create mode 100644 TRANSLATION.md

diff --git a/TRANSLATION.md b/TRANSLATION.md
new file mode 100644
index 0000000..afa7caa
--- /dev/null
+++ b/TRANSLATION.md
@@ -0,0 +1,156 @@
+# Translation
+
+This is a guide for translation. Thank you for helping us make our platform accessible in more languages!  
+
+---
+
+## Table of Contents
+
+- [1. Files to Modify](#1-files-to-modify)
+- [2. Step-by-Step Instructions](#2-step-by-step-instructions)
+- [3. Translation Key Naming](#3-translation-key-naming)
+- [4. Testing Your Translation](#4-testing-your-translation)
+- [5. Submitting Your Contribution](#5-submitting-your-contribution)
+- [6. Tips for Quality Translations](#6-tips-for-quality-translations)
+- [7. FAQ](#7-faq)
+
+---
+
+## 1. Files to Modify
+
+To contribute a new language or update an existing one, you **must** modify the following files:
+
+- **Frontend/src/App.jsx**  
+  Update the language dropdown to include your language.
+- **Frontend/src/LanguageSwitcher.jsx**  
+  Add your language to the dropdown options.
+- **Frontend/src/locales/lang.json**  
+  (Replace `lang.json` with your language code, e.g. `es.json` for Spanish.)  
+  Add or edit the translation file for your language.
+- **Frontend/src/service/translation.js**  
+  Import your language file and register it in the `translations` object.
+
+---
+
+## 2. Step-by-Step Instructions
+
+### **A. Add Your Language to the Dropdown**
+
+#### In `App.jsx`:
+```jsx
+function LanguageSwitcher({ language, setLanguage }) {
+  return (
+     {
+        setLanguage(e.target.value);
+        localStorage.setItem("language", e.target.value);
+      }}
+      className="absolute top-2 right-2 p-1 rounded border"
+      aria-label="Select language"
+    >
+      English
+      Hindi (हिंदी)
+      Marathi (मराठी)
+      Français
+      {/* Add your language here, e.g.: */}
+      Español
+    
+  );
+}
+```
+
+#### In `Frontend/src/LanguageSwitcher.jsx`:
+```jsx
+const LanguageSwitcher = ({ currentLanguage, onChangeLanguage }) => (
+   onChangeLanguage(e.target.value)}>
+    English
+    Hindi (हिंदी)
+    Marathi (मराठी)
+    French (Français)
+    {/* Add your language here, e.g.: */}
+    Español
+  
+);
+```
+
+---
+
+### **B. Add or Update Your Language File**
+
+- **File location:** `Frontend/src/locales/`
+- **File name:** Use your language code, e.g. `es.json` for Spanish.
+- **How:**  
+  - Copy `en.json` as a template.
+  - **Do not change the keys!** Only translate the values.
+
+**Example (`es.json`):**
+```json
+{
+  "login_button": "Iniciar sesión",
+  "signup_heading": "Registrarse",
+  "...": "..."
+}
+```
+
+---
+
+### **C. Register Your Language in the Translation Loader**
+
+In `Frontend/src/service/translation.js`:
+
+```js
+import en from '../locales/en.json';
+import hi from '../locales/hi.json';
+import mr from '../locales/mr.json';
+import fr from '../locales/fr.json';
+import es from '../locales/es.json'; //  {
+  return translations[lang][key] || key; // Fallback to key if missing
+};
+```
+
+---
+
+## 3. Translation Key Naming
+
+- **Keys** must remain unchanged and in English (snake_case).
+- **Only translate the values**.
+
+---
+
+## 4. Testing Your Translation
+
+1. **Switch the app** to your language using the dropdown.
+2. **Browse all screens** and ensure all text is translated and displays correctly.
+3. If you see any untranslated keys, add them to your language file.
+
+---
+
+## 5. Submitting Your Contribution
+
+- **Commit your changes** to the files listed above.
+- **Open a pull request** with a clear title, e.g.  
+  `Add Spanish translation (es.json)` or `Update French translation`.
+- **Describe** what you translated or updated in the PR description.
+
+---
+
+## 6. Tips for Quality Translations
+
+- Be concise and clear.
+- Use formal or polite forms if unsure.
+- Match the tone of the English original.
+- Double-check spelling and grammar.
+- If unsure about a term, ask or leave a comment in your PR.
+
+---
+
+## 7. FAQ
+
+**Q: What if I see a key in English that isn’t in my language file?**  
+A: Copy it from `en.json` and translate the value.
+
+**Q: Can I add a new key?**  
+A: Only if you are also updating the code to use it. Otherwise, only translate existing keys.
+
+---
+
+If you have any questions, please ask in the project chat or open an issue.