fix: Handle optional params in catch-all segments correctly when usin…

…g localized pathnames (#925)

Fixes #917

This works correctly now:

```
  "/items/[[...slug]]": {
    tr: "/ilanlar/[[...slug]]",
    en: "/items/[[...slug]]",
  },
```

… should match when `/tr/ilanlar` is called.

packages/next-intl/src/shared/utils.tsx

@@ -105,13 +105,12 @@ export function matchesPathname(
 
 export function templateToRegex(template: string): RegExp {
   const regexPattern = template
-    .replace(/\[([^\]]+)\]/g, (match) => {
-      if (match.startsWith('[...')) return '(.*)';
-      if (match.startsWith('[[...')) return '(.*)';
-      return '([^/]+)';
-    })
-    // Clean up regex match remainders from optional catchall ('[[...slug]]')
-    .replaceAll('(.*)]', '(.*)');
+    // Replace optional catchall ('[[...slug]]')
+    .replaceAll(/\[\[(\.\.\.[^\]]+)\]\]/g, '?(.*)')
+    // Replace catchall ('[...slug]')
+    .replaceAll(/\[(\.\.\.[^\]]+)\]/g, '(.+)')
+    // Replace regular parameter ('[slug]')
+    .replaceAll(/\[([^\]]+)\]/g, '([^/]+)');
 
   return new RegExp(`^${regexPattern}$`);
 }

packages/next-intl/test/middleware/middleware.test.tsx

@@ -874,6 +874,10 @@ describe('prefix-based routing', () => {
           '/products/[...slug]': {
             en: '/products/[...slug]',
             de: '/produkte/[...slug]'
+          },
+          '/categories/[[...slug]]': {
+            en: '/categories/[[...slug]]',
+            de: '/kategorien/[[...slug]]'
           }
         } satisfies Pathnames<ReadonlyArray<'en' | 'de'>>
       });
@@ -895,10 +899,12 @@ describe('prefix-based routing', () => {
         middlewareWithPathnames(
           createMockRequest('/en/news/happy-newyear-g5b116754', 'en')
         );
+        middlewareWithPathnames(createMockRequest('/en/categories', 'en'));
+        middlewareWithPathnames(createMockRequest('/en/categories/new', 'en'));
 
         expect(MockedNextResponse.redirect).not.toHaveBeenCalled();
         expect(MockedNextResponse.next).not.toHaveBeenCalled();
-        expect(MockedNextResponse.rewrite).toHaveBeenCalledTimes(4);
+        expect(MockedNextResponse.rewrite).toHaveBeenCalledTimes(6);
         expect(
           MockedNextResponse.rewrite.mock.calls.map((call) =>
             call[0].toString()
@@ -907,7 +913,9 @@ describe('prefix-based routing', () => {
           'http://localhost:3000/en/about',
           'http://localhost:3000/en/users',
           'http://localhost:3000/en/users/1',
-          'http://localhost:3000/en/news/happy-newyear-g5b116754'
+          'http://localhost:3000/en/news/happy-newyear-g5b116754',
+          'http://localhost:3000/en/categories',
+          'http://localhost:3000/en/categories/new'
         ]);
       });
 
@@ -928,21 +936,24 @@ describe('prefix-based routing', () => {
         middlewareWithPathnames(
           createMockRequest('/de/neuigkeiten/gutes-neues-jahr-g5b116754', 'de')
         );
+        middlewareWithPathnames(createMockRequest('/de/kategorien', 'de'));
+        middlewareWithPathnames(createMockRequest('/de/kategorien/neu', 'de'));
 
         expect(MockedNextResponse.next).not.toHaveBeenCalled();
         expect(MockedNextResponse.redirect).not.toHaveBeenCalled();
-        expect(MockedNextResponse.rewrite.mock.calls[0][0].toString()).toBe(
-          'http://localhost:3000/de/about'
-        );
-        expect(MockedNextResponse.rewrite.mock.calls[1][0].toString()).toBe(
-          'http://localhost:3000/de/users'
-        );
-        expect(MockedNextResponse.rewrite.mock.calls[2][0].toString()).toBe(
-          'http://localhost:3000/de/users/1'
-        );
-        expect(MockedNextResponse.rewrite.mock.calls[3][0].toString()).toBe(
-          'http://localhost:3000/de/news/gutes-neues-jahr-g5b116754'
-        );
+
+        expect(
+          MockedNextResponse.rewrite.mock.calls.map((call) =>
+            call[0].toString()
+          )
+        ).toEqual([
+          'http://localhost:3000/de/about',
+          'http://localhost:3000/de/users',
+          'http://localhost:3000/de/users/1',
+          'http://localhost:3000/de/news/gutes-neues-jahr-g5b116754',
+          'http://localhost:3000/de/categories',
+          'http://localhost:3000/de/categories/neu'
+        ]);
       });
 
       it('redirects a request for a localized route that is not associated with the requested locale', () => {

packages/next-intl/test/middleware/utils.test.tsx

@@ -1,6 +1,7 @@
 import {describe, expect, it} from 'vitest';
 import {
   formatPathname,
+  getInternalTemplate,
   getNormalizedPathname,
   getRouteParams
 } from '../../src/middleware/utils';
@@ -125,3 +126,26 @@ describe('formatPathname', () => {
     );
   });
 });
+
+describe('getInternalTemplate', () => {
+  const pathnames = {
+    '/categories/[[...slug]]': {
+      en: '/categories/[[...slug]]',
+      de: '/kategorien/[[...slug]]'
+    }
+  };
+
+  it('works when passing no params to optional catch-all segments', () => {
+    expect(getInternalTemplate(pathnames, '/kategorien')).toEqual([
+      'de',
+      '/categories/[[...slug]]'
+    ]);
+  });
+
+  it('works when passing params to optional catch-all segments', () => {
+    expect(getInternalTemplate(pathnames, '/kategorien/neu')).toEqual([
+      'de',
+      '/categories/[[...slug]]'
+    ]);
+  });
+});

packages/next-intl/test/shared/utils.test.tsx

@@ -72,6 +72,7 @@ describe('matchesPathname', () => {
     expect(matchesPathname('/[[...slug]]', '/products/clothing/t-shirts')).toBe(
       true
     );
+    expect(matchesPathname('/products/[[...slug]]', '/products')).toBe(true);
   });
 
   it('returns false for non-matching paths', () => {