sync with pliny dev

components/BlogNewsletterForm.tsx

@@ -1,7 +0,0 @@
-'use client'
-
-// dot notation breaks RSC - https://github.com/vercel/next.js/issues/51593
-// temporarily workaround to re-export
-import { BlogNewsletterForm } from 'pliny/ui/NewsletterForm'
-
-export default BlogNewsletterForm

components/Comments.tsx

@@ -0,0 +1,17 @@
+'use client'
+
+import { Comments as CommentsComponent } from 'pliny/comments'
+import { useState } from 'react'
+import siteMetadata from '@/data/siteMetadata'
+
+export default function Comments({ slug }: { slug: string }) {
+  const [loadComments, setLoadComments] = useState(false)
+  return (
+    <>
+      {!loadComments && <button onClick={() => setLoadComments(true)}>Load Comments</button>}
+      {siteMetadata.comments && loadComments && (
+        <CommentsComponent commentsConfig={siteMetadata.comments} slug={slug} />
+      )}
+    </>
+  )
+}

components/MDXComponents.tsx

@@ -1,30 +1,14 @@
-import React from 'react'
-import { useMDXComponent } from 'next-contentlayer/hooks'
-import { ComponentMap } from 'pliny/mdx-components'
-import { TOCInline } from 'pliny/ui/TOCInline'
+import TOCInline from 'pliny/ui/TOCInline'
 import Pre from './Pre'
-import BlogNewsletterForm from './BlogNewsletterForm'
-// import { BlogNewsletterForm } from 'pliny/ui/NewsletterForm'
-
+import BlogNewsletterForm from 'pliny/ui/NewsletterForm'
+import type { MDXComponents } from 'mdx/types'
 import Image from './Image'
 import CustomLink from './Link'
 
-interface MdxProps {
-  code: string
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  [key: string]: any
-}
-
-export const MDXComponents: ComponentMap = {
+export const components: MDXComponents = {
   Image,
   TOCInline,
   a: CustomLink,
   pre: Pre,
   BlogNewsletterForm,
 }
-
-export function Mdx({ code, ...rest }: MdxProps) {
-  const Component = useMDXComponent(code)
-
-  return <Component components={{ ...MDXComponents }} {...rest} />
-}