Update navigation.mdx and add link from Server Components docs

Author: amannn

docs/pages/docs/environments/server-client-components.mdx

@@ -171,6 +171,43 @@ By doing this, we can use interactive features from React like `useState` on tra
 
 Learn more in the Next.js docs: [Passing Server Components to Client Components as Props](https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#supported-pattern-passing-server-components-to-client-components-as-props)
 
+<details>
+<summary>Example: How can I implement a locale switcher?</summary>
+
+If you implement a locale switcher as an interactive select, you can keep internationalization on the server side by rendering the labels from a Server Component and only marking the `select` element as a Client Component.
+
+```tsx filename="LocaleSwitcher.tsx"
+import {useLocale, useTranslations} from 'next-intl';
+import {locales} from 'config';
+
+// A Client Component that registers an event listener for
+// the `change` event of the select, uses `useRouter`
+// to change the locale and uses `useTransition` to display
+// a loading state during the transition.
+import LocaleSwitcherSelect from './LocaleSwitcherSelect';
+
+export default function LocaleSwitcher() {
+  const t = useTranslations('LocaleSwitcher');
+  const locale = useLocale();
+
+  return (
+    <LocaleSwitcherSelect defaultValue={locale} label={t('label')}>
+      {locales.map((cur) => (
+        <option key={cur} value={cur}>
+          {t('locale', {locale: cur})}
+        </option>
+      ))}
+    </LocaleSwitcherSelect>
+  );
+}
+```
+
+[Example implementation](https://github.com/amannn/next-intl/blob/main/examples/example-app-router/src/components/LocaleSwitcher.tsx) ([demo](https://next-intl-example-app-router.vercel.app/en))
+
+See also: [`useRouter`](/docs/routing/navigation#userouter)
+
+</details>
+
 <details>
 <summary>Example: How can I implement a form?</summary>
 
@@ -217,41 +254,6 @@ export default function RegisterPage() {
 
 </details>
 
-<details>
-<summary>Example: How can I implement a locale switcher?</summary>
-
-If you implement a locale switcher as an interactive select, you can keep internationalization on the server side by rendering the labels from a Server Component and only marking the select element as a Client Component.
-
-```tsx filename="LocaleSwitcher.tsx"
-import {useLocale, useTranslations} from 'next-intl';
-import {locales} from 'config';
-
-// A Client Component that registers an event listener for
-// the `change` event of the select, uses `useRouter`
-// to change the locale and uses `useTransition` to display
-// a loading state during the transition.
-import LocaleSwitcherSelect from './LocaleSwitcherSelect';
-
-export default function LocaleSwitcher() {
-  const t = useTranslations('LocaleSwitcher');
-  const locale = useLocale();
-
-  return (
-    <LocaleSwitcherSelect defaultValue={locale} label={t('label')}>
-      {locales.map((cur) => (
-        <option key={cur} value={cur}>
-          {t('locale', {locale: cur})}
-        </option>
-      ))}
-    </LocaleSwitcherSelect>
-  );
-}
-```
-
-[Example implementation](https://github.com/amannn/next-intl/blob/main/examples/example-app-router/src/components/LocaleSwitcher.tsx) ([demo](https://next-intl-example-app-router.vercel.app/en))
-
-</details>
-
 ### Option 2: Moving state to the server side
 
 You might run into cases where you have dynamic state, such as pagination, that should be reflected in translated messages.

docs/pages/docs/routing/navigation.mdx

@@ -418,13 +418,10 @@ const router = useRouter();
 const params = useParams();
 
 router.replace(
-  {
-    pathname,
-    // TypeScript validates that only known `params` are used in combination
-    // with a given `pathname`. Since the two will always match for the current
-    // route, we can skip runtime checks.
-    params: params as any
-  },
+  // @ts-expect-error -- TypeScript will validate that only known `params`
+  // are used in combination with a given `pathname`. Since the two will
+  // always match for the current route, we can skip runtime checks.
+  {pathname, params},
   {locale: 'de'}
 );
 ```