Merge pull request #844 from siygle/tweet-embed

feat: 增加對內嵌推文的支持

README.md

@@ -81,8 +81,9 @@
 
   <td align="center"><a href="https://github.com/Pylogmon"><img src="https://avatars.githubusercontent.com/u/59004461" width="64px;"  alt="Pylogmon"/><br/><sub><b>派了个萌 </b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=Pylogmon" title="Pylogmon" >🔧 🐛</a></td>
   
-  <td align="center"><a href="https://github.com/SkysCrystal"><img src="https://avatars.githubusercontent.com/u/49473463" width="64px;"  alt="SkysCrystal"/><br/><sub><b>Simon Shi
-</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=SkysCrystal" title="SkysCrystal" >🔧 🐛</a></td>
+  <td align="center"><a href="https://github.com/SkysCrystal"><img src="https://avatars.githubusercontent.com/u/49473463" width="64px;"  alt="SkysCrystal"/><br/><sub><b>Simon Shi</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=SkysCrystal" title="SkysCrystal" >🔧 🐛</a></td>
+  
+  <td align="center"><a href="https://github.com/siygle"><img src="https://avatars.githubusercontent.com/u/173408" width="64px;"  alt="S.Y. Lee"/><br/><sub><b>S.Y. Lee</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=siygle" title="siygle" >🔧 🐛</a></td>
   
   
 

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 />

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