When I use await params inside a layout.tsx file and try to access a page, it just hangs (loads forever). When I just use params without await, I get the nextjs warning about using await to get params.
Here is src/app/[locale]/layout.tsx

import Header from '@/components/header';
import '@/app/globals.css';
import { getDictionary } from '@/lib/dictionary';
import Footer from '@/components/footer';

export default async function RootLayout({
  children,
  params,
}: {
  children: React.ReactNode;
  params: { locale: 'ar' | 'en' };
}) {
  const locale = (await params).locale;
  const dict = getDictionary(locale);
  return (
    <>
      <Header dict={dict} />
      {children}
      <Footer dict={dict} />
    </>
  );
}