This wasn't hard but I didn't find good search results for it so here's a quick tip.
I'm using next-translate with nextjs for localization but this technique will probably work with other localization frameworks like next-i18next.
in pages/_app.ts
import Head from 'next/head';
import type { AppProps } from 'next/app';
import {useRouter} from 'next/router';
const supportedLocales = ['ar-ye', 'en-us', 'fr'];
export default function MyApp({ Component, pageProps }: AppProps): ReactElement {
const {asPath} = useRouter();
return (
<>
<Head>
{supportedLocales.map(loc =>
<link rel="alternate" hrefLang={loc} href={`/${loc}${asPath}`}/>)}
</Head>
<Component {...pageProps} />
</>
);
}
I hope this helps google find your translated pages!