feat: Add i18n system and comprehensive AI agent documentation#95
Closed
feat: Add i18n system and comprehensive AI agent documentation#95
Conversation
Documents the full implementation plan for: - i18n infrastructure in pos/src/i18n/ - Language resolution strategy - Component refactoring to use t() - AGENTS.MD documentation files for pos/, root, and URYMosaic/ https://claude.ai/code/session_01QhB9M6JhTa6gJRp1wfZZbv
- Add pos/src/i18n/ infrastructure: config, loader, resolve-language, t() - Add en.json and fr.json translation files with structured namespaces - Wire initI18n() into main.tsx before React render - Refactor Header, OrderPanel, POSOpeningDialog, CommentDialog, CustomerSelect, PaymentDialog, POS, and Orders to use t() - Create pos/AGENTS.MD: detailed POS frontend docs for AI agents - Create AGENTS.MD (root): Frappe backend structure and navigation guide - Create URYMosaic/AGENTS.MD: KOT display system docs for AI agents - Create CLAUDE.MD files pointing to AGENTS.MD in each location https://claude.ai/code/session_01QhB9M6JhTa6gJRp1wfZZbv
frappe.local.lang is already set from the user's ERPNext language preference. Wrapping item_name and course with _() causes Frappe to look up Translation DocType entries for the active language, so cashiers see translated item and course names without any frontend changes. https://claude.ai/code/session_01QhB9M6JhTa6gJRp1wfZZbv
Audit identifies 47 layout anti-patterns that break with dir=rtl: - 8 space-x-* utilities (should use gap-*) - 14 directional margins ml-*/mr-* (should use ms-*/me-* or gap) - 9 absolute positioning with left/right - 6 directional padding issues - 4 directional borders Critical case flagged: - Header.tsx line 141: User menu button uses space-x-2 Pattern: div(avatar) + span(username) + svg(arrow) This creates ml-* margins that don't flip in RTL Fix: Replace space-x-* with gap-* which auto-mirrors in RTL
…layout-for-i18n-rtl-support
…rtl-support Fix/standardize layout for i18n rtl support
…t-for-i18n-rtl-support Revert "Fix/standardize layout for i18n rtl support"
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR introduces a lightweight internationalization (i18n) system to the POS frontend and adds comprehensive AI agent documentation across the URY repository. The i18n system enables multi-language support without external dependencies, while the documentation provides detailed guidance for AI agents working on the codebase.
Key Changes
i18n System (
pos/src/i18n/)config.ts: Defines default language ('en') and supported languages maploader.ts: Dynamic locale loader with caching to avoid repeated importsindex.ts: Core translation API witht(key, params?)function supporting dot-notation keys and{{placeholder}}interpolationresolve-language.ts: Language resolution with priority chain (Frappe boot → localStorage → default)locales/en.json&locales/fr.json: Complete English and French translation files covering all UI strings across namespaces (common, header, menu, cart, order, payment, pos, customer, comment, errors, success)Component Refactoring
Updated components to use
t()for user-visible strings:Header.tsx: Search placeholders, menu items, logoutOrderPanel.tsx: Cart labels, validation errors, button textPaymentDialog.tsx: Payment dialog strings and error messagesPOSOpeningDialog.tsx: POS opening/closing dialog textCustomerSelect.tsx: Customer search and form labelsCommentDialog.tsx: Comment dialog labelsOrders.tsx: Order action strings and success/error messagesPOS.tsx: Menu filter labelsApp Initialization
main.tsx: Modified to callinitI18n()before React mount, ensuring translations are loaded synchronously before first renderDocumentation
pos/AGENTS.MD: 312-line comprehensive guide covering overview, tech stack, project structure, component architecture, data flow, API integration, i18n system, design principles, and AI modification guidelinesAGENTS.MD(root): 240-line guide to the URY backend covering app overview, repository structure, Frappe backend organization, key doctypes, document event hooks, and API modulesURYMosaic/AGENTS.MD: 216-line guide to the KOT display system covering Vue 3 architecture, Socket.io integration, API interactions, data flow, and extension pointsCLAUDE.MDfiles: Added at root,pos/, andURYMosaic/pointing to respectiveAGENTS.MDfilesImplementation Details
import()for dynamic locale loading{{key}}token replacement for parameterized stringsTesting Considerations
t()functionhttps://claude.ai/code/session_01QhB9M6JhTa6gJRp1wfZZbv