diff --git a/I18N_SETUP.md b/I18N_SETUP.md new file mode 100644 index 0000000..13e2450 --- /dev/null +++ b/I18N_SETUP.md @@ -0,0 +1,125 @@ +# i18n Setup Guide for MinIO WebUI + +This guide helps you set up the internationalization (i18n) dependencies for MinIO WebUI in different environments. + +## Quick Fix + +If you're getting errors about missing `react-i18next`, `i18next`, or `i18next-browser-languagedetector` modules: + +### Option 1: Using the Install Script (Recommended) + +```bash +cd frontend +./install-i18n.sh +``` + +### Option 2: Manual Installation + +```bash +cd frontend +rm -rf node_modules package-lock.json +npm install --legacy-peer-deps +``` + +### Option 3: Docker Environment + +If running in Docker, rebuild the frontend container: + +```bash +docker-compose down frontend +docker-compose up -d --build frontend +``` + +## Troubleshooting + +### Module Not Found Errors + +If you see errors like: +- `Module not found: Error: Can't resolve 'react-i18next'` +- `Cannot find module 'i18next' or its corresponding type declarations` + +**Solution:** +1. Delete `node_modules` and `package-lock.json` +2. Run `npm install --legacy-peer-deps` +3. If issues persist, install packages explicitly: + ```bash + npm install i18next@^23.7.6 react-i18next@^13.5.0 i18next-browser-languagedetector@^7.2.0 --legacy-peer-deps + ``` + +### Peer Dependency Conflicts + +Use the `--legacy-peer-deps` flag when installing to bypass peer dependency conflicts: + +```bash +npm install --legacy-peer-deps +``` + +### TypeScript Declaration Errors + +If TypeScript can't find type declarations, ensure you have the correct versions: +- i18next: ^23.7.6 +- react-i18next: ^13.5.0 +- i18next-browser-languagedetector: ^7.2.0 + +## Verifying Installation + +After installation, verify the packages are installed: + +```bash +npm list i18next react-i18next i18next-browser-languagedetector +``` + +You should see all three packages listed with their versions. + +## Development Environment Setup + +1. **Clone the repository** +2. **Navigate to frontend directory**: `cd frontend` +3. **Run the install script**: `./install-i18n.sh` +4. **Start the development server**: `npm start` + +## Production Build + +For production builds: + +```bash +cd frontend +npm install --legacy-peer-deps +npm run build +``` + +## Docker Setup + +The Dockerfile already includes the necessary dependencies. If you need to rebuild: + +```bash +docker-compose build frontend +docker-compose up -d frontend +``` + +## Language Configuration + +- Default language: German (de) +- Fallback language: English (en) +- Language selection is persisted in localStorage +- Language can be changed via the dropdown in the app header + +## Translation Files Location + +- German: `/frontend/src/locales/de/` +- English: `/frontend/src/locales/en/` + +Each language has the following translation files: +- `common.json` - Navigation and common UI elements +- `dashboard.json` - Dashboard page translations +- `quickWizard.json` - Quick Start Wizard translations +- `reports.json` - Reports page translations +- `errors.json` - Error messages + +## Need Help? + +If you continue to experience issues: +1. Check that you're using Node.js version 16 or higher +2. Clear npm cache: `npm cache clean --force` +3. Delete `node_modules`, `package-lock.json`, and reinstall +4. Check the console for specific error messages \ No newline at end of file diff --git a/frontend/install-i18n.sh b/frontend/install-i18n.sh new file mode 100755 index 0000000..285da1d --- /dev/null +++ b/frontend/install-i18n.sh @@ -0,0 +1,29 @@ +#!/bin/bash + +# Script to install i18n dependencies for MinIO WebUI frontend +# This ensures proper installation in different environments + +echo "Installing i18n dependencies for MinIO WebUI..." + +# Remove existing node_modules and package-lock.json to ensure clean install +echo "Cleaning existing dependencies..." +rm -rf node_modules package-lock.json + +# Install dependencies with legacy peer deps flag to avoid conflicts +echo "Installing dependencies..." +npm install --legacy-peer-deps + +# Verify i18n packages are installed +echo "Verifying i18n packages..." +if npm list i18next react-i18next i18next-browser-languagedetector 2>/dev/null | grep -E "(i18next|react-i18next|i18next-browser-languagedetector)" > /dev/null; then + echo "✅ i18n packages installed successfully!" + echo "" + echo "Installed versions:" + npm list i18next react-i18next i18next-browser-languagedetector 2>/dev/null | grep -E "(i18next|react-i18next|i18next-browser-languagedetector)" +else + echo "❌ Error: i18n packages not found. Trying to install them explicitly..." + npm install i18next@^23.7.6 react-i18next@^13.5.0 i18next-browser-languagedetector@^7.2.0 --legacy-peer-deps +fi + +echo "" +echo "Installation complete! You can now run 'npm start' to start the development server." \ No newline at end of file diff --git a/frontend/package.json b/frontend/package.json index 831a86d..01ad97c 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -16,13 +16,13 @@ "axios": "^1.6.5", "chart.js": "^4.4.1", "date-fns": "^3.2.0", - "i18next": "^25.3.2", - "i18next-browser-languagedetector": "^8.2.0", + "i18next": "^23.7.6", + "i18next-browser-languagedetector": "^7.2.0", "react": "^18.2.0", "react-chartjs-2": "^5.2.0", "react-dom": "^18.2.0", "react-hook-form": "^7.48.2", - "react-i18next": "^15.6.1", + "react-i18next": "^13.5.0", "react-router-dom": "^6.21.1", "react-scripts": "5.0.1", "typescript": "^5.3.3",