Perf improvements and billing updates

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);