fix: correct i18n locale normalization and address code review feedback

Agent-Logs-Url: https://github.com/george-gca/expiring_products/sessions/5e766290-e7d8-4409-9762-df7fc2438a1c

Co-authored-by: george-gca <31376482+george-gca@users.noreply.github.com>

Author: Copilot

src/components/EditItemModal.tsx

@@ -18,11 +18,11 @@ export default function EditItemModal({ show, item, category, onClose }: EditIte
   const [discarded, setDiscarded] = useState(0);
 
   const total = opened + consumed + discarded;
-  const invalid = total > item.quantity;
+  const exceedsAvailableQuantity = total > item.quantity;
 
   async function handleSubmit(e: React.FormEvent) {
     e.preventDefault();
-    if (invalid) return;
+    if (exceedsAvailableQuantity) return;
 
     // Each operation may change the item's quantity in the DB, so we pass a
     // synthetic item with the remaining quantity to avoid using stale data in
@@ -55,7 +55,7 @@ export default function EditItemModal({ show, item, category, onClose }: EditIte
           </div>
           <form onSubmit={handleSubmit}>
             <div className="modal-body">
-              {invalid && <div className="alert alert-danger">{t('quantity_exceeded')}</div>}
+              {exceedsAvailableQuantity && <div className="alert alert-danger">{t('quantity_exceeded')}</div>}
               <div className="mb-3">
                 <label className="form-label">{t('opened_items')}</label>
                 <div className="input-group">
@@ -83,7 +83,7 @@ export default function EditItemModal({ show, item, category, onClose }: EditIte
             </div>
             <div className="modal-footer">
               <button type="button" className="btn btn-secondary" onClick={onClose}>{t('close')}</button>
-              <button type="submit" className="btn btn-primary" disabled={invalid}>{t('edit')}</button>
+              <button type="submit" className="btn btn-primary" disabled={exceedsAvailableQuantity}>{t('edit')}</button>
             </div>
           </form>
         </div>

src/components/LanguageToggle.tsx

@@ -6,14 +6,14 @@ export default function LanguageToggle() {
   const { language, setLanguage } = useSettingsStore();
 
   function toggle() {
-    const next = language === 'en-us' ? 'pt-br' : 'en-us';
+    const next = language === 'en-US' ? 'pt-BR' : 'en-US';
     setLanguage(next);
     i18n.changeLanguage(next).catch(console.error);
   }
 
   return (
     <button className="btn btn-outline-info" onClick={toggle}>
-      {language === 'en-us' ? 'PT-BR' : 'EN-US'}
+      {language === 'en-US' ? 'PT-BR' : 'EN-US'}
     </button>
   );
 }

src/i18n/index.ts

@@ -8,12 +8,14 @@ const language = useSettingsStore.getState().language;
 
 i18n.use(initReactI18next).init({
   resources: {
-    'en-us': { translation: enUs },
-    'pt-br': { translation: ptBr },
+    'en-US': { translation: enUs },
+    'pt-BR': { translation: ptBr },
   },
   lng: language,
-  fallbackLng: 'pt-br',
+  fallbackLng: 'pt-BR',
+  load: 'currentOnly',
   interpolation: { escapeValue: false },
+  initImmediate: false,
 });
 
 export default i18n;

src/i18n/locales/pt-br.json

@@ -12,8 +12,8 @@
   "import_data": "Importar dados",
   "item_name": "Nome",
   "medicines": "Medicamentos",
-  "no_items": "Não há items aqui.",
-  "no_items_to_export": "Não há items para exportar.",
+  "no_items": "Não há itens aqui.",
+  "no_items_to_export": "Não há itens para exportar.",
   "opened_items": "Itens abertos",
   "options": "Opções",
   "products_to_expire": "Produtos a vencer",

src/store/settingsStore.ts

@@ -1,7 +1,7 @@
 import { create } from 'zustand';
 import { persist } from 'zustand/middleware';
 
-export type Language = 'en-us' | 'pt-br';
+export type Language = 'en-US' | 'pt-BR';
 
 interface SettingsState {
   language: Language;
@@ -11,7 +11,7 @@ interface SettingsState {
 export const useSettingsStore = create<SettingsState>()(
   persist(
     (set) => ({
-      language: 'pt-br',
+      language: 'pt-BR',
       setLanguage: (language) => set({ language }),
     }),
     { name: 'expiring-products-settings' }

src/test/components/ItemCard.test.tsx

@@ -17,7 +17,7 @@ vi.mock('react-i18next', () => ({
 // Mock settingsStore
 vi.mock('../../store/settingsStore', () => ({
   useSettingsStore: (selector: (s: { language: string }) => unknown) =>
-    selector({ language: 'en-us' }),
+    selector({ language: 'en-US' }),
 }));
 
 const baseItem: Item = {

src/test/components/SettingsTab.test.tsx

@@ -18,7 +18,7 @@ vi.mock('../../store/itemsStore', () => ({
 
 vi.mock('../../store/settingsStore', () => ({
   useSettingsStore: (selector?: (s: { language: string; setLanguage: () => void }) => unknown) => {
-    const state = { language: 'en-us', setLanguage: vi.fn() };
+    const state = { language: 'en-US', setLanguage: vi.fn() };
     return selector ? selector(state) : state;
   },
 }));

src/utils/dateUtils.ts

@@ -7,7 +7,7 @@ import type { Language } from '../store/settingsStore';
  * @returns Luxon-compatible locale string
  */
 export function appLocaleToLuxonLocale(language: Language): string {
-  return language === 'en-us' ? 'en-US' : 'pt-BR';
+  return language === 'en-US' ? 'en-US' : 'pt-BR';
 }
 
 export function isExpired(isoDate: string): boolean {