# General Translation React SDKs (gt-react, gt-next): Localized navigation
URL: https://generaltranslation.com/en-US/docs/react/nextjs/link.mdx
---

title: Localized navigation
description: Navigate directly to localized routes in Next.js with General Translation's locale-aware Link component. API reference for Link.

---

The `<Link>` component from `gt-next/link` wraps Next.js's `<Link>` and adds the locale prefix to internal URLs before navigation. This avoids an extra middleware redirect when changing locales; the middleware can handle any required rewrite on the localized request. See the [App Router](/docs/react/nextjs/app-router-middleware) or [Pages Router](/docs/react/nextjs/pages-router-middleware) setup.

## Overview [#overview]

Import the default export from `gt-next/link` and use it like `next/link`. It accepts the same props and forwards refs.

```tsx title="app/nav.tsx"
import Link from 'gt-next/link';

export function Navigation() {
  return <Link href="/home">Home</Link>; // /en/home for an English visitor
}
```

## The `locale` prop [#locale-prop]

**Type** `string | false | undefined`

Controls the locale prefix:

- **Omitted** - Use the current locale from [`useLocale`](/docs/react/reference/hooks/use-locale)
- **Locale string** - Link directly to that locale, such as from a language switcher
- **`false`** - Leave the href unchanged

```tsx
import Link from 'gt-next/link';

// Current locale (default): /en/home
<Link href="/home">Home</Link>;

// Explicit locale: /fr/home
<Link href="/home" locale="fr">French</Link>;

// No prefix: /legal
<Link href="/legal" locale={false}>Legal</Link>;
```

External URLs remain unchanged. For object hrefs, `<Link>` localizes only the `pathname` and preserves the other fields.