djoka/bentopdf
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/alam00000/bentopdf into add-spanish-translation

Browse Source
This commit is contained in:
Raul Gonzalez
2026-01-08 14:01:02 -06:00
parent e34b106e10 280348763d
commit cc891f2b0a
160 changed files with 84719 additions and 56211 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
TRANSLATION.md
View File

@@ -22,11 +22,14 @@ BentoPDF uses **i18next** for internationalization (i18n). Currently supported l
- **English** (`en`) - Default
- **German** (`de`)
- **Vietnamese** (`vi`)
- **Indonesian** (`id`)
The app automatically detects the language from the URL path:
- `/en/` → English
- `/de/` → German
- `/vi/` → Vietnamese
- `/id/` → Indonesian
---
@@ -90,11 +93,13 @@ Open `public/locales/fr/common.json` and translate all the values:
⚠️ **Important**: Only translate the **values**, NOT the keys!
✅ **Correct:**
```json
"home": "Accueil"
```
❌ **Wrong:**
```json
"accueil": "Accueil"
```
@@ -112,49 +117,24 @@ export type SupportedLanguage = (typeof supportedLanguages)[number];
// Add French display name
export const languageNames: Record<SupportedLanguage, string> = {
en: 'English',
de: 'Deutsch',
es: 'Español',
fr: 'Français', // ← Add this
zh: '中文',
vi: 'Tiếng Việt',
};
```
Also update the `getLanguageFromUrl` function in the same file:
```typescript
export const getLanguageFromUrl = (): SupportedLanguage => {
const path = window.location.pathname;
const langMatch = path.match(/^\/(en|de|es|fr|zh|vi)(?:\/|$)/); // ← Add 'fr' here
// ... rest of the function
en: 'English',
de: 'Deutsch',
fr: 'Français', // ← Add this
};
```
### Step 4: Update Vite Configuration
Edit `vite.config.ts` to add French to the routing middleware:
In `vite.config.ts`, ensure the new language is included in the build:
```typescript
function pagesRewritePlugin(): Plugin {
return {
name: 'pages-rewrite',
configureServer(server) {
server.middlewares.use((req, res, next) => {
const url = req.url?.split('?')[0] || '';
// Add 'fr' to this regex pattern
const langMatch = url.match(/^\/(en|de|es|fr|zh|vi)(\/.*)?$/);
// ... rest of the middleware
});
},
};
}
// Add 'fr' to the language regex
const langMatch = url.match(/^\/(en|de|es|zh|vi|it|fr)(\/.*)?$/);
```
⚠️ **Important**: This step is critical! Without updating the Vite config, you'll get 404 errors when trying to access French pages.
**Important**: This step is critical! Without updating the Vite config, you'll get 404 errors when trying to access French pages.
### Step 5: Restart and Test Your Translation
### Step 5: Test Your Translation
```bash
# Stop the dev server (Ctrl+C)
@@ -250,6 +230,7 @@ Tool names and descriptions are defined in `src/js/config/tools.ts` and use a sp
```
In translations:
```json
{
"tools": {
@@ -277,14 +258,15 @@ console.log(message); // "Error" or "Fehler" depending on language
For input placeholders:
```html
<input
type="text"
placeholder="Search for a tool..."
<input
type="text"
placeholder="Search for a tool..."
data-i18n-placeholder="tools.searchPlaceholder"
/>
```
In `common.json`:
```json
{
"tools": {
@@ -300,6 +282,7 @@ In `common.json`:
### Manual Testing
1. **Start development server:**
```bash
npm run dev
```
@@ -308,6 +291,7 @@ In `common.json`:
- English: `http://localhost:5173/en/`
- German: `http://localhost:5173/de/`
- Vietnamese: `http://localhost:5173/vi/`
- Indonesian: `http://localhost:5173/id/`
- Your new language: `http://localhost:5173/fr/`
3. **Check these pages:**
@@ -332,11 +316,12 @@ Check for missing translations:
node scripts/check-translations.js
```
*(If this script doesn't exist, you may need to create it or manually compare JSON files)*
_(If this script doesn't exist, you may need to create it or manually compare JSON files)_
### Browser Testing
Test in different browsers:
- Chrome/Edge
- Firefox
- Safari
@@ -350,11 +335,13 @@ Test in different browsers:
BentoPDF is **friendly, clear, and professional**. Match this tone in your translations.
✅ **Good:**
```json
"hero.title": "Ihr kostenloses und sicheres PDF-Toolkit"
```
❌ **Too formal:**
```json
"hero.title": "Ihr gebührenfreies und gesichertes Werkzeug für PDF-Dokumente"
```
@@ -382,6 +369,7 @@ When translating, **keep the HTML tags intact**:
If your language has complex plural rules or gender distinctions, consult the [i18next pluralization guide](https://www.i18next.com/translation-function/plurals).
Example:
```json
{
"pages": "page",
@@ -392,6 +380,7 @@ Example:
### 4. Don't Translate Brand Names or Legal Terms
Keep these as-is:
- BentoPDF
- PDF
- GitHub
@@ -404,6 +393,7 @@ Keep these as-is:
### 5. Technical Terms
For technical terms, use commonly accepted translations in your language:
- "Merge" → "Fusionner" (French), "Zusammenführen" (German)
- "Split" → "Diviser" (French), "Teilen" (German)
- "Compress" → "Compresser" (French), "Komprimieren" (German)
@@ -423,6 +413,7 @@ If a translation is much longer, test it visually to ensure it doesn't break the
### Issue: Translations Not Showing Up
**Solution:**
1. Clear your browser cache
2. Hard refresh (Ctrl+F5 or Cmd+Shift+R)
3. Check browser console for errors
@@ -431,22 +422,26 @@ If a translation is much longer, test it visually to ensure it doesn't break the
### Issue: Some Text Still in English
**Possible causes:**
1. Missing translation key in your language file
2. Missing `data-i18n` attribute in HTML
3. Hardcoded text in JavaScript
**Solution:**
- Compare your language file with `en/common.json` to find missing keys
- Search the codebase for hardcoded strings
### Issue: JSON Syntax Error
**Symptoms:**
```
SyntaxError: Unexpected token } in JSON at position 1234
```
**Solution:**
- Use a JSON validator: https://jsonlint.com/
- Common mistakes:
- Trailing comma after last item
@@ -457,6 +452,7 @@ SyntaxError: Unexpected token } in JSON at position 1234
**Solution:**
Make sure you added the language to both arrays in `i18n.ts`:
```typescript
export const supportedLanguages = ['en', 'de', 'es', 'fr', 'zh', 'vi']; // ← Add here
export const languageNames = {
@@ -494,8 +490,7 @@ When adding a new language, make sure these files are updated:
- [ ] `public/locales/{lang}/common.json` - Main translation file
- [ ] `public/locales/{lang}/tools.json` - Tools translation file
- [ ] `src/js/i18n/i18n.ts` - Add to `supportedLanguages`, `languageNames`, and `getLanguageFromUrl` regex
- [ ] `vite.config.ts` - Add language code to routing regex in `pagesRewritePlugin`
- [ ] `src/js/i18n/i18n.ts` - Add to `supportedLanguages` and `languageNames`
- [ ] Test all pages: homepage, about, contact, FAQ, tool pages
- [ ] Test settings modal and shortcuts
- [ ] Test language switcher in footer
@@ -536,14 +531,14 @@ Thank you for contributing to BentoPDF! 🎉
Current translation coverage:
| Language | Code | Status | Maintainer |
|----------|------|--------|------------|
| English | `en` | ✅ Complete | Core team |
| German | `de` | 🚧 In Progress | Core team |
| Spanish | `es` | ✅ Complete | Community |
| Chinese | `zh` | ✅ Complete | Community |
| Vietnamese | `vi` | ✅ Complete | Community |
| Your Language | `??` | 🚧 In Progress | You? |
| Language | Code | Status | Maintainer |
| ------------- | ---- | -------------- | ---------- |
| English | `en` | ✅ Complete | Core team |
| German | `de` | 🚧 In Progress | Core team |
| Spanish | `es` | ✅ Complete | Community |
| Vietnamese | `vi` | ✅ Complete | Community |
| Indonesian | `id` | ✅ Complete | Community |
| Your Language | `??` | 🚧 In Progress | You? |
---