From 1c825b18514f9ae21c30b76ac03f222015fd474a Mon Sep 17 00:00:00 2001
From: sy <shiyung@gmail.com>
Date: Sat, 11 Mar 2023 17:24:52 +0800
Subject: [PATCH] feat(page): support tweet embed rendering

---
 components/NotionPage.js | 8 +++++++-
 package.json             | 1 +
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/components/NotionPage.js b/components/NotionPage.js
index 1953be10..abb8586e 100644
--- a/components/NotionPage.js
+++ b/components/NotionPage.js
@@ -4,6 +4,7 @@ import mediumZoom from '@fisch0920/medium-zoom'
 import React from 'react'
 import { isBrowser } from '@/lib/utils'
 import { Code } from 'react-notion-x/build/third-party/code'
+import TweetEmbed from 'react-tweet-embed'
 
 import 'katex/dist/katex.min.css'
 import { mapImgUrl } from '@/lib/notion/mapImage'
@@ -36,6 +37,10 @@ const Modal = dynamic(
   () => import('react-notion-x/build/third-party/modal').then((m) => m.Modal), { ssr: false }
 )
 
+const Tweet = ({ id }) => {
+  return <TweetEmbed tweetId={id} />
+}
+
 const NotionPage = ({ post, className }) => {
   const zoom = isBrowser() && mediumZoom({
     container: '.notion-viewport',
@@ -89,7 +94,8 @@ const NotionPage = ({ post, className }) => {
         Collection,
         Equation,
         Modal,
-        Pdf
+        Pdf,
+        Tweet
       }} />
 
       <PrismMac />
diff --git a/package.json b/package.json
index f4d2d459..09316777 100644
--- a/package.json
+++ b/package.json
@@ -52,6 +52,7 @@
     "react-messenger-customer-chat": "^0.8.0",
     "react-notion-x": "6.15.8",
     "react-share": "^4.4.0",
+    "react-tweet-embed": "~2.0.0",
     "smoothscroll-polyfill": "^0.4.4",
     "twikoo": "1.6.9",
     "typed.js": "^2.0.12",