Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-10 04:22:32 +10:00
Code Issues Packages Projects Releases Wiki Activity

fix: blog posts breaking during ssr on vercel

Browse Source
This commit is contained in:
Mythie
2024-11-05 18:34:27 +11:00
parent de880aa821
commit 32b65c4d49
2 changed files with 26 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
apps/marketing/src/app/(marketing)/blog/[post]/content.tsx Normal file
View File

@ -0,0 +1,23 @@
'use client';
import Image from 'next/image';
import type { BlogPost } from 'contentlayer/generated';
import type { MDXComponents } from 'mdx/types';
import { useMDXComponent } from 'next-contentlayer/hooks';
const mdxComponents: MDXComponents = {
MdxNextImage: (props: { width: number; height: number; alt?: string; src: string }) => (
<Image {...props} alt={props.alt ?? ''} />
),
};
export type BlogPostContentProps = {
post: BlogPost;
};
export const BlogPostContent = ({ post }: BlogPostContentProps) => {
const MdxContent = useMDXComponent(post.body.code);
return <MdxContent components={mdxComponents} />;
};

15
apps/marketing/src/app/(marketing)/blog/[post]/page.tsx
View File

@ -1,16 +1,15 @@
import Image from 'next/image';
import Link from 'next/link';
import { notFound } from 'next/navigation';
import { allBlogPosts } from 'contentlayer/generated';
import { ChevronLeft } from 'lucide-react';
import type { MDXComponents } from 'mdx/types';
import { useMDXComponent } from 'next-contentlayer/hooks';
import { setupI18nSSR } from '@documenso/lib/client-only/providers/i18n.server';
import { CallToAction } from '~/components/(marketing)/call-to-action';
import { BlogPostContent } from './content';
export const dynamic = 'force-dynamic';
export const generateMetadata = ({ params }: { params: { post: string } }) => {
@ -42,12 +41,6 @@ export const generateMetadata = ({ params }: { params: { post: string } }) => {
};
};
const mdxComponents: MDXComponents = {
MdxNextImage: (props: { width: number; height: number; alt?: string; src: string }) => (
<Image {...props} alt={props.alt ?? ''} />
),
};
export default async function BlogPostPage({ params }: { params: { post: string } }) {
await setupI18nSSR();
@ -57,8 +50,6 @@ export default async function BlogPostPage({ params }: { params: { post: string
notFound();
}
const MDXContent = useMDXComponent(post.body.code);
return (
<div>
<article className="prose dark:prose-invert mx-auto py-8">
@ -87,7 +78,7 @@ export default async function BlogPostPage({ params }: { params: { post: string
</div>
</div>
<MDXContent components={mdxComponents} />
<BlogPostContent post={post} />
{post.tags.length > 0 && (
<ul className="not-prose flex list-none flex-row space-x-2 px-0">