Merge branch 'main' into staging

apps/marketing/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@documenso/marketing",
-  "version": "1.7.2-rc.3",
+  "version": "1.7.2-rc.4",
   "private": true,
   "license": "AGPL-3.0",
   "scripts": {

apps/marketing/src/app/(marketing)/[content]/content.tsx

@@ -0,0 +1,23 @@
+'use client';
+
+import Image from 'next/image';
+
+import type { DocumentTypes } 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 ContentPageContentProps = {
+  document: DocumentTypes;
+};
+
+export const ContentPageContent = ({ document }: ContentPageContentProps) => {
+  const MDXContent = useMDXComponent(document.body.code);
+
+  return <MDXContent components={mdxComponents} />;
+};

apps/marketing/src/app/(marketing)/[content]/page.tsx

@@ -1,12 +1,11 @@
-import Image from 'next/image';
 import { notFound } from 'next/navigation';
 
 import { allDocuments } from 'contentlayer/generated';
-import type { MDXComponents } from 'mdx/types';
-import { useMDXComponent } from 'next-contentlayer/hooks';
 
 import { setupI18nSSR } from '@documenso/lib/client-only/providers/i18n.server';
 
+import { ContentPageContent } from './content';
+
 export const dynamic = 'force-dynamic';
 
 export const generateMetadata = ({ params }: { params: { content: string } }) => {
@@ -19,12 +18,6 @@ export const generateMetadata = ({ params }: { params: { content: string } }) =>
   return { title: document.title };
 };
 
-const mdxComponents: MDXComponents = {
-  MdxNextImage: (props: { width: number; height: number; alt?: string; src: string }) => (
-    <Image {...props} alt={props.alt ?? ''} />
-  ),
-};
-
 /**
  * A generic catch all page for the root level that checks for content layer documents.
  *
@@ -39,11 +32,9 @@ export default async function ContentPage({ params }: { params: { content: strin
     notFound();
   }
 
-  const MDXContent = useMDXComponent(post.body.code);
-
   return (
     <article className="prose dark:prose-invert mx-auto">
-      <MDXContent components={mdxComponents} />
+      <ContentPageContent document={post} />
     </article>
   );
 }

apps/marketing/src/app/(marketing)/blog/[post]/content.tsx

@@ -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} />;
+};

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

@@ -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">

apps/marketing/src/app/(marketing)/open/page.tsx

@@ -1,6 +1,7 @@
 import type { Metadata } from 'next';
 
 import { Trans, msg } from '@lingui/macro';
+import { useLingui } from '@lingui/react';
 import { z } from 'zod';
 
 import { setupI18nSSR } from '@documenso/lib/client-only/providers/i18n.server';
@@ -130,9 +131,9 @@ const fetchEarlyAdopters = async () => {
 };
 
 export default async function OpenPage() {
-  const { i18n } = await setupI18nSSR();
+  await setupI18nSSR();
 
-  const { _ } = i18n;
+  const { _ } = useLingui();
 
   const [
     { forks_count: forksCount, stargazers_count: stargazersCount },