Perf improvements and billing updates

apps/web/app/(dashboard)/home/(user)/loading.tsx

@@ -1,3 +1,5 @@
 import { GlobalLoader } from '@kit/ui/global-loader';
 
-export default GlobalLoader;
+import { withI18n } from '~/lib/i18n/with-i18n';
+
+export default withI18n(GlobalLoader);

apps/web/app/(dashboard)/home/[account]/billing/_components/team-account-checkout-form.tsx

@@ -26,6 +26,7 @@ export function TeamAccountCheckoutForm(params: { accountId: string }) {
   if (checkoutToken) {
     return (
       <EmbeddedCheckout
+        load
         checkoutToken={checkoutToken}
         provider={billingConfig.provider}
       />

apps/web/app/(dashboard)/home/[account]/billing/return/page.tsx

@@ -16,11 +16,18 @@ interface SessionPageProps {
   };
 }
 
-const LazyEmbeddedCheckout = dynamic(async () => {
-  const { EmbeddedCheckout } = await import('@kit/billing-gateway/components');
+const LazyEmbeddedCheckout = dynamic(
+  async () => {
+    const { EmbeddedCheckout } = await import(
+      '@kit/billing-gateway/components'
+    );
 
-  return EmbeddedCheckout;
-});
+    return EmbeddedCheckout;
+  },
+  {
+    ssr: false,
+  },
+);
 
 async function ReturnStripeSessionPage({ searchParams }: SessionPageProps) {
   const { customerEmail, checkoutToken } = await loadCheckoutSession(

apps/web/app/(dashboard)/home/[account]/loading.tsx

@@ -1,3 +1,5 @@
 import { GlobalLoader } from '@kit/ui/global-loader';
 
-export default GlobalLoader;
+import { withI18n } from '~/lib/i18n/with-i18n';
+
+export default withI18n(GlobalLoader);

apps/web/app/(dashboard)/home/loading.tsx

@@ -1,3 +1,5 @@
 import { GlobalLoader } from '@kit/ui/global-loader';
 
-export default GlobalLoader;
+import { withI18n } from '~/lib/i18n/with-i18n';
+
+export default withI18n(GlobalLoader);

apps/web/app/(marketing)/_components/site-navigation.tsx

@@ -44,7 +44,7 @@ export function SiteNavigation() {
     <>
       <div className={'hidden items-center lg:flex'}>
         <NavigationMenu>
-          <NavigationMenuList className={'space-x-2.5'}>
+          <NavigationMenuList className={'space-x-3'}>
             <NavigationMenuItem>
               <Link className={className} href={links.Blog.path}>
                 {links.Blog.label}

apps/web/app/(marketing)/blog/[slug]/page.tsx

@@ -9,7 +9,7 @@ import Post from '~/(marketing)/blog/_components/post';
 import appConfig from '~/config/app.config';
 import { withI18n } from '~/lib/i18n/with-i18n';
 
-export async function generateMetadata({
+export function generateMetadata({
   params,
 }: {
   params: { slug: string };
@@ -49,7 +49,7 @@ export async function generateMetadata({
   };
 }
 
-async function BlogPost({ params }: { params: { slug: string } }) {
+function BlogPost({ params }: { params: { slug: string } }) {
   const post = allPosts.find((post) => post.slug === params.slug);
 
   if (!post) {

apps/web/app/(marketing)/blog/_components/post.tsx

@@ -1,11 +1,13 @@
-import React from 'react';
+import dynamic from 'next/dynamic';
 
 import type { Post as PostType } from 'contentlayer/generated';
 
-import { Mdx } from '@kit/ui/mdx';
-
 import { PostHeader } from './post-header';
 
+const Mdx = dynamic(() =>
+  import('@kit/ui/mdx').then((mod) => ({ default: mod.Mdx })),
+);
+
 export const Post: React.FC<{
   post: PostType;
   content: string;

apps/web/app/(marketing)/loading.tsx

@@ -1,3 +1,5 @@
 import { GlobalLoader } from '@kit/ui/global-loader';
 
-export default GlobalLoader;
+import { withI18n } from '~/lib/i18n/with-i18n';
+
+export default withI18n(GlobalLoader);

apps/web/app/loading.tsx

@@ -0,0 +1,5 @@
+import { GlobalLoader } from '@kit/ui/global-loader';
+
+import { withI18n } from '~/lib/i18n/with-i18n';
+
+export default withI18n(GlobalLoader);

apps/web/app/not-found.tsx

@@ -2,6 +2,7 @@ import Link from 'next/link';
 
 import { ArrowLeft } from 'lucide-react';
 
+import { getSupabaseServerComponentClient } from '@kit/supabase/server-component-client';
 import { Button } from '@kit/ui/button';
 import { Heading } from '@kit/ui/heading';
 import { Trans } from '@kit/ui/trans';
@@ -14,10 +15,16 @@ export const metadata = {
   title: `Page not found - ${appConfig.name}`,
 };
 
-const NotFoundPage = () => {
+const NotFoundPage = async () => {
+  const client = getSupabaseServerComponentClient();
+
+  const {
+    data: { session },
+  } = await client.auth.getSession();
+
   return (
     <div className={'flex h-screen flex-1 flex-col'}>
-      <SiteHeader session={null} />
+      <SiteHeader session={session} />
 
       <div
         className={