Improve locale access examples for i18n routing

[yoseph0524]

No description provided.

[vercel]

Suggested change

	Current locale: {locale}
	All locales: {locales?.join(', ')}
	Default locale: {defaultLocale}
	<>
	<div>Current locale: {locale}</div>
	<div>All locales: {locales?.join(', ')}</div>
	<div>Default locale: {defaultLocale}</div>
	</>

The JSX code example has invalid syntax - the return statement contains text content without wrapping it in a JSX element.

View Details

Analysis

Invalid JSX syntax in internationalization documentation example

What fails: The LocaleExample component in docs/02-pages/02-guides/internationalization.mdx (lines 226-230) has invalid JSX syntax - returns multiple text nodes without a wrapper element

How to reproduce:

cd /tmp && npm install @babel/core @babel/preset-react
node << 'EOF'
const babel = require('@babel/core');
const code = `
export default function LocaleExample() {
  const { locale, locales, defaultLocale } = useRouter();
  return (
      Current locale: {locale}
      All locales: {locales?.join(', ')}
      Default locale: {defaultLocale}
  );
}`;
babel.transformSync(code, { presets: ['@babel/preset-react'] });
EOF

Result: Babel compilation fails with error: Unexpected token, expected "," (7:14) at the "Current locale:" text line

Expected: JSX requires multiple elements/text nodes to be wrapped in a parent element or Fragment per React documentation on Fragments. All other code examples in this file properly wrap content in JSX elements.