Fix translations in async component (#175)

next.config.mjs

@@ -8,6 +8,21 @@ import createNextIntlPlugin from 'next-intl/plugin'
  */
 !process.env.SKIP_ENV_VALIDATION && (await import('./src/env.mjs'))
 
+/** @type {import('next').NextConfig} */
+const nextBaseConfig = {
+  images: {
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: `${process.env.NEXT_PUBLIC_AWS_BUCKET_NAME ?? '*'}.s3.${
+          process.env.NEXT_PUBLIC_AWS_BUCKET_REGION ?? '*'
+        }.amazonaws.com`,
+      },
+    ],
+    unoptimized: process.env.VERCEL_ENV !== 'production',
+  },
+}
+
 /**
  * Create config wrapper required for using next-intl with RSCs.
  * See https://next-intl-docs.vercel.app/docs/getting-started/app-router-server-components
@@ -30,22 +45,6 @@ const withPWA = withPWAInit({
 })
 
 /** @type {import('next').NextConfig} */
-const nextConfig = withAxiom(
-  withNextIntl(
-    withPWA({
-      images: {
-        remotePatterns: [
-          {
-            protocol: 'https',
-            hostname: `${process.env.NEXT_PUBLIC_AWS_BUCKET_NAME ?? '*'}.s3.${
-              process.env.NEXT_PUBLIC_AWS_BUCKET_REGION ?? '*'
-            }.amazonaws.com`,
-          },
-        ],
-        unoptimized: process.env.VERCEL_ENV !== 'production',
-      },
-    })
-  )
-)
+const nextConfig = withAxiom(withNextIntl(withPWA(nextBaseConfig)))
 
 export default nextConfig

src/app/[locale]/admin-login/page.tsx

@@ -1,6 +1,5 @@
 import { IconBarrierBlock, IconBolt } from '@tabler/icons-react'
 import type { Metadata } from 'next'
-import { useTranslations } from 'next-intl'
 import { getTranslations } from 'next-intl/server'
 import type { FC } from 'react'
 import { LoginForm } from '~/components/login-form/login-form'
@@ -31,7 +30,7 @@ const AdminLoginPage: FC<LocaleRouteParams> = async () => {
 
   const isLoggedInAsNotAdmin = !!session && session.user.role !== 'admin'
 
-  const t = useTranslations('admin-login')
+  const t = await getTranslations('admin-login')
 
   return (
     <>