sync with pliny dev

app/Main.tsx

@@ -3,7 +3,7 @@ import Link from '@/components/Link'
 import Tag from '@/components/Tag'
 import siteMetadata from '@/data/siteMetadata'
 import { formatDate } from 'pliny/utils/formatDate'
-import { NewsletterForm } from 'pliny/ui/NewsletterForm'
+import NewsletterForm from 'pliny/ui/NewsletterForm'
 
 const MAX_DISPLAY = 5
 

app/about/page.tsx

@@ -1,5 +1,5 @@
 import { Authors, allAuthors } from 'contentlayer/generated'
-import { Mdx } from '@/components/MDXComponents'
+import { MDXLayoutRenderer } from 'pliny/mdx-components'
 import AuthorLayout from '@/layouts/AuthorLayout'
 import { coreContent } from 'pliny/utils/contentlayer'
 import { genPageMetadata } from 'app/seo'
@@ -13,7 +13,7 @@ export default function Page() {
   return (
     <>
       <AuthorLayout content={mainContent}>
-        <Mdx code={author.body.code} />
+        <MDXLayoutRenderer code={author.body.code} />
       </AuthorLayout>
     </>
   )

app/blog/[...slug]/page.tsx

@@ -1,5 +1,6 @@
 import PageTitle from '@/components/PageTitle'
-import { Mdx } from '@/components/MDXComponents'
+import { components } from '@/components/MDXComponents'
+import { MDXLayoutRenderer } from 'pliny/mdx-components'
 import { sortedBlogPost, coreContent } from 'pliny/utils/contentlayer'
 import { allBlogs, allAuthors } from 'contentlayer/generated'
 import type { Authors, Blog } from 'contentlayer/generated'
@@ -104,7 +105,7 @@ export default async function Page({ params }: { params: { slug: string[] } }) {
             {JSON.stringify(jsonLd)}
           </script>
           <PostLayout content={mainContent} authorDetails={authorDetails} next={next} prev={prev}>
-            <Mdx code={post.body.code} toc={post.toc} />
+            <MDXLayoutRenderer code={post.body.code} components={components} toc={post.toc} />
           </PostLayout>
         </>
       )}

app/blog/page.tsx

@@ -21,14 +21,11 @@ export default function BlogPage() {
   }
 
   return (
-    <>
-      {/* <PageSEO title={`Blog - ${siteMetadata.author}`} description={siteMetadata.description} /> */}
-      <ListLayout
-        posts={posts}
-        initialDisplayPosts={initialDisplayPosts}
-        pagination={pagination}
-        title="All Posts"
-      />
-    </>
+    <ListLayout
+      posts={posts}
+      initialDisplayPosts={initialDisplayPosts}
+      pagination={pagination}
+      title="All Posts"
+    />
   )
 }

app/blog/page/[page]/page.tsx

@@ -1,5 +1,3 @@
-// import { PageSEO } from '@/components/SEO'
-import siteMetadata from '@/data/siteMetadata'
 import ListLayout from '@/layouts/ListLayout'
 import { allCoreContent, sortedBlogPost } from 'pliny/utils/contentlayer'
 import { allBlogs } from 'contentlayer/generated'
@@ -28,14 +26,11 @@ export default function Page({ params }: { params: { page: string } }) {
   }
 
   return (
-    <>
-      {/* <PageSEO title={siteMetadata.title} description={siteMetadata.description} /> */}
-      <ListLayout
-        posts={allCoreContent(posts)}
-        initialDisplayPosts={allCoreContent(initialDisplayPosts)}
-        pagination={pagination}
-        title="All Posts"
-      />
-    </>
+    <ListLayout
+      posts={allCoreContent(posts)}
+      initialDisplayPosts={allCoreContent(initialDisplayPosts)}
+      pagination={pagination}
+      title="All Posts"
+    />
   )
 }

app/globals.css

@@ -1,29 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-.task-list-item::before {
-    @apply hidden;
-}
-
-.task-list-item {
-    @apply list-none;
-}
-
-.footnotes {
-    @apply mt-12 border-t border-gray-200 pt-8 dark:border-gray-700;
-}
-
-.data-footnote-backref {
-    @apply no-underline;
-}
-
-.csl-entry {
-    @apply my-5;
-}
-
-/* https://stackoverflow.com/questions/61083813/how-to-avoid-internal-autofill-selected-style-to-be-applied */
-input:-webkit-autofill,
-input:-webkit-autofill:focus {
-    transition: background-color 600000s 0s, color 600000s 0s;
-}

app/layout.tsx

@@ -1,8 +1,10 @@
-import './globals.css'
+import 'css/tailwind.css'
+import 'css/prism.css'
+import 'pliny/search/algolia.css'
 
 import { Inter } from 'next/font/google'
-import { Analytics } from 'pliny/analytics'
-import { SearchProvider } from 'pliny/search'
+import { Analytics, AnalyticsConfig } from 'pliny/analytics'
+import { SearchProvider, SearchConfig } from 'pliny/search'
 import Header from '@/components/Header'
 import SectionContainer from '@/components/SectionContainer'
 import Footer from '@/components/Footer'
@@ -68,13 +70,13 @@ export default function RootLayout({ children }: { children: React.ReactNode })
       <link rel="alternate" type="application/rss+xml" href="/feed.xml" />
       <body className="bg-white text-black antialiased dark:bg-gray-900 dark:text-white">
         <ThemeProviders>
-          {/* <Analytics analyticsConfig={siteMetadata.analytics} /> */}
+          <Analytics analyticsConfig={siteMetadata.analytics as AnalyticsConfig} />
           <SectionContainer>
             <div className="flex h-screen flex-col justify-between font-sans">
-              {/* <SearchProvider searchConfig={siteMetadata.search}> */}
-              <Header />
-              <main className="mb-auto">{children}</main>
-              {/* </SearchProvider> */}
+              <SearchProvider searchConfig={siteMetadata.search as SearchConfig}>
+                <Header />
+                <main className="mb-auto">{children}</main>
+              </SearchProvider>
               <Footer />
             </div>
           </SectionContainer>