Next-Intl not working for nested routes in Next JS

Question

I am using next-intl for internationalization. I have followed the installation instructions here. This works as expected on the index/home page, however, when I try to navigate to /register it ignores the locale and thus returns not-found.jsx

I am using <Link href={"/register"}> to navigate.

Folder structure

src
|-- app
|   |-- [locale]
|       |-- (public)
|           |-- layout.jsx
|           |-- page.jsx
|           |-- not-found.jsx
|           |-- register
|               |-- page.jsx
|-- middleware.js
|-- i18n.js

middleware.js

import createMiddleware from "next-intl/middleware";

export default createMiddleware({
  locales: ["en", "ka", "ru"],
  defaultLocale: "en",
});

export const config = {
  matcher: ["/", "/(en|ka|ru)/:path*"],
};

i18n.js

import { notFound } from "next/navigation";
import { getRequestConfig } from "next-intl/server";

const locales = ["en", "ka", "ru"];

export default getRequestConfig(async ({ locale }) => {
  if (!locales.includes(locale)) notFound();

  return {
    messages: (await import(`../messages/${locale}.json`)).default,
  };
});