feat(next-international): use a regex to allow multiple interpolations

packages/next-international/__tests__/use-i18n.test.tsx

@@ -160,6 +160,33 @@ describe('useI18n', () => {
     expect(screen.getByText("Today's weather is sunny")).toBeInTheDocument();
   });
 
+  it('should translate with the same param used twice', async () => {
+    const { useI18n, I18nProvider } = createI18n<typeof import('./utils/en').default>({
+      en: () => import('./utils/en'),
+      fr: () => import('./utils/fr'),
+    });
+
+    function App() {
+      const { t } = useI18n();
+
+      return (
+        <p>
+          {t('double.param', {
+            param: '<PARAMETER>',
+          })}
+        </p>
+      );
+    }
+
+    render(
+      <I18nProvider locale={en}>
+        <App />
+      </I18nProvider>,
+    );
+
+    expect(screen.getByText('This <PARAMETER> is used twice (<PARAMETER>)')).toBeInTheDocument();
+  });
+
   it('should translate with multiple params', async () => {
     const { useI18n, I18nProvider } = createI18n<typeof import('./utils/en').default>({
       en: () => import('./utils/en'),

packages/next-international/__tests__/utils/en.ts

@@ -9,4 +9,5 @@ export default {
   'namespace.subnamespace.weather': "Today's weather is {weather}",
   'namespace.subnamespace.user.description': '{name} is {years} years old',
   'only.exists.in.en': 'EN locale',
+  'double.param': 'This {param} is used twice ({param})',
 } as const;

packages/next-international/src/i18n/create-use-i18n.ts

@@ -37,7 +37,7 @@ export function createUsei18n<Locale extends BaseLocale>(I18nContext: Context<Lo
         }
 
         for (const [param, paramValue] of Object.entries(paramObject as Locale)) {
-          value = value.toString().replace(`{${param}}`, paramValue.toString());
+          value = value.toString().replace(new RegExp(`{${param}}`, 'g'), paramValue.toString());
         }
 
         return value;