#57

This pull request introduces internationalization (i18n) support to the application by integrating i18next and refactoring UI components to dynamically adapt to language changes. Additionally, it includes structural improvements to the navigation and menu components using useMemo for performance optimization. Below are the key changes:

Internationalization (i18n) Integration:

• Added i18next, react-i18next, and i18next-browser-languagedetector dependencies to the project (lobe/package.json).
• Refactored Suspense fallback titles in lobe/src/App.tsx to use translations (e.g., t('pageTitle.loading.panel')) for dynamic language support.
• Introduced useTranslation hook in various components (e.g., DesktopPage, LayoutPage, and Nav) to enable translated text for UI elements like buttons, menus, and headers. [1] [2] [3]

Navigation and Menu Refactoring:

• Replaced hardcoded menu items in DesktopPage and Nav with dynamically generated items using useMemo to reflect language changes and improve performance. [1] [2] [3]
• Added a LanguageSwitcher component to allow users to switch languages directly from the navigation bar. [1] [2]

Structural Enhancements:

• Updated the DesktopPage and LayoutPage components to include dropdown menus and buttons with translated labels (e.g., "Enter System" and "Register"). [1] [2]
• Introduced a useMemo-based approach for dropdown menu items in LayoutPage to ensure efficient re-rendering when the language changes.

Configuration and Guidelines:

• Added a detailed configuration file (lobe/.cursor/rules/all.mdc) outlining design principles, task analysis, and quality criteria for UI design. This serves as a blueprint for consistent and professional UI development.