generator-kodly-react-app 1.0.14 → 1.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
BASE_URL=/
|
|
2
2
|
PORT=3000
|
|
3
|
-
ALLOWED_HOSTS=sandbox.
|
|
4
|
-
VITE_API_BASE_URL=${VITE_API_BASE_URL} //injected by env variables - https://sandbox.
|
|
3
|
+
ALLOWED_HOSTS=sandbox.app.kodly.dev
|
|
4
|
+
VITE_API_BASE_URL=${VITE_API_BASE_URL} //injected by env variables - https://{port}-{projectSlug}-{userSlug}.sandbox.app.kodly.dev
|
|
@@ -8,10 +8,10 @@ The i18n setup now supports two usage patterns interchangeably:
|
|
|
8
8
|
|
|
9
9
|
| Pattern | Example | Use case |
|
|
10
10
|
|---------|---------|----------|
|
|
11
|
-
| **Flat (no namespace)** | `useTranslation()` + `t('
|
|
12
|
-
| **Namespaced** | `useTranslation('
|
|
11
|
+
| **Flat (no namespace)** | `useTranslation()` + `t('namespace.section.key')` | Quick access, explicit full path |
|
|
12
|
+
| **Namespaced** | `useTranslation('namespace')` + `t('section.key')` | Modular components, shorter keys |
|
|
13
13
|
|
|
14
|
-
Previously, only the flat pattern worked because all translations lived under a single `translation` namespace. The namespaced pattern failed because i18next couldn't find
|
|
14
|
+
Previously, only the flat pattern worked because all translations lived under a single `translation` namespace. The namespaced pattern failed because i18next couldn't find the individual namespaces (the top-level keys in your merged translation object).
|
|
15
15
|
|
|
16
16
|
---
|
|
17
17
|
|
|
@@ -57,7 +57,7 @@ if (!i18n.isInitialized) {
|
|
|
57
57
|
},
|
|
58
58
|
},
|
|
59
59
|
defaultNS: 'translation',
|
|
60
|
-
ns: ['translation',
|
|
60
|
+
ns: ['translation', ...Object.keys(enResources)],
|
|
61
61
|
supportedLngs: supportedLanguages,
|
|
62
62
|
lng,
|
|
63
63
|
fallbackLng: defaultLanguage,
|
|
@@ -72,12 +72,12 @@ if (!i18n.isInitialized) {
|
|
|
72
72
|
### What changed
|
|
73
73
|
|
|
74
74
|
1. **Resources structure**: Each language now exposes both:
|
|
75
|
-
- `translation` –
|
|
76
|
-
- Individual namespaces –
|
|
75
|
+
- `translation` – the full merged object for flat keys, e.g. `t('namespace.section.key')`
|
|
76
|
+
- Individual namespaces – one per top-level key in the merged object, for `useTranslation('namespace')` + `t('section.key')`
|
|
77
77
|
|
|
78
78
|
2. **`defaultNS: 'translation'`**: Ensures `useTranslation()` without arguments uses the flat namespace.
|
|
79
79
|
|
|
80
|
-
3. **`ns` array**:
|
|
80
|
+
3. **`ns` array**: Must list `'translation'` plus every top-level key returned by `mergeTranslations()` (e.g. `['translation', ...Object.keys(enResources)]`) so i18next can load and resolve them correctly.
|
|
81
81
|
|
|
82
82
|
---
|
|
83
83
|
|
|
@@ -89,17 +89,12 @@ Replace the `if (!i18n.isInitialized)` block with the new configuration above. T
|
|
|
89
89
|
|
|
90
90
|
### 2. Verify translation key paths (flat usage)
|
|
91
91
|
|
|
92
|
-
With the default `translation` namespace, keys must include the
|
|
92
|
+
With the default `translation` namespace, keys must include the full path from the root of your merged translations. The format is the namespace (top-level key) followed by the path inside it:
|
|
93
93
|
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
| Auth | `auth.<section>.<key>` | `auth.login.title`, `auth.messages.loginFailed` |
|
|
97
|
-
| App | `app.<key>` | `app.title`, `app.welcome.logout` |
|
|
98
|
-
| Landing | `landing.<section>.<key>` | `landing.hero.loginButton` |
|
|
99
|
-
| Common | `common.<key>` | `common.notFound.message` |
|
|
100
|
-
| Theme | `theme.<key>` | (if used) |
|
|
94
|
+
- **Format**: `t('<namespace>.<path.to.key>')`
|
|
95
|
+
- **Example**: If your merged object has a top-level key `auth` with `login.title` inside it, use `t('auth.login.title')`.
|
|
101
96
|
|
|
102
|
-
If
|
|
97
|
+
If a key used to work as `t('someKey')` and now fails, it likely lives under a namespace in your structure—update it to `t('<namespace>.<someKey>')` (or the full path that matches your locale JSON).
|
|
103
98
|
|
|
104
99
|
### 3. Optional: Use namespaced pattern in components
|
|
105
100
|
|
|
@@ -108,11 +103,11 @@ You can migrate components to the namespaced pattern for shorter keys:
|
|
|
108
103
|
```tsx
|
|
109
104
|
// Before (flat)
|
|
110
105
|
const { t } = useTranslation();
|
|
111
|
-
return <h1>{t('
|
|
106
|
+
return <h1>{t('namespace.section.title')}</h1>;
|
|
112
107
|
|
|
113
108
|
// After (namespaced) – optional
|
|
114
|
-
const { t } = useTranslation('
|
|
115
|
-
return <h1>{t('
|
|
109
|
+
const { t } = useTranslation('namespace');
|
|
110
|
+
return <h1>{t('section.title')}</h1>;
|
|
116
111
|
```
|
|
117
112
|
|
|
118
113
|
Both forms work. Choose what fits your component structure.
|
|
@@ -121,14 +116,12 @@ Both forms work. Choose what fits your component structure.
|
|
|
121
116
|
|
|
122
117
|
## Available Namespaces
|
|
123
118
|
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
| `common` | `@/locales/en/common.json`, `@/locales/ja/common.json` | notFound |
|
|
131
|
-
| `theme` | `@/locales/en/theme.json`, `@/locales/ja/theme.json` | theme-related keys |
|
|
119
|
+
Namespaces in your project are determined by **the top-level keys of the object returned by `mergeTranslations(lng)`**.
|
|
120
|
+
|
|
121
|
+
- **`translation`** – Always present. Contains the full merged tree so flat keys like `t('namespace.section.key')` work.
|
|
122
|
+
- **Other namespaces** – One for each top-level key in that merged object (e.g. if your merge yields `{ auth, app, common }`, you get namespaces `auth`, `app`, and `common`). Their contents match whatever structure your locale files and `mergeTranslations` produce.
|
|
123
|
+
|
|
124
|
+
To see which namespaces you have, inspect the keys of the result of `mergeTranslations('en')` (or your default language) and use that same list in the `ns` option in `i18n.ts`.
|
|
132
125
|
|
|
133
126
|
---
|
|
134
127
|
|
|
@@ -136,5 +129,5 @@ Both forms work. Choose what fits your component structure.
|
|
|
136
129
|
|
|
137
130
|
- **`src/locales/index.ts`** – `mergeTranslations` is unchanged
|
|
138
131
|
- **Locale JSON files** – No structure changes
|
|
139
|
-
- **Components using flat keys** – Existing `t('
|
|
132
|
+
- **Components using flat keys** – Existing `t('namespace.path.to.key')` calls continue to work
|
|
140
133
|
- **`LanguageSwitcher`** – Uses `i18n` only; no translation keys
|
package/package.json
CHANGED