From f1e336f8683a773ba2720960f0de519d7b77b4ae Mon Sep 17 00:00:00 2001
From: tangly <tlyong1992@hotmail.com>
Date: Sun, 13 Nov 2022 14:38:38 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8D=87=E7=BA=A7react-notion-x=EF=BC=8C?=
 =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E9=83=A8=E5=88=86=E6=A0=B7=E5=BC=8F=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/NotionPage.js | 50 ++++++++++++++++++++++++++++++----------
 package.json             |  6 ++---
 pages/_app.js            |  3 ++-
 styles/notion.css        |  8 +++++++
 4 files changed, 51 insertions(+), 16 deletions(-)

diff --git a/components/NotionPage.js b/components/NotionPage.js
index a6f0a8ce..863069a3 100644
--- a/components/NotionPage.js
+++ b/components/NotionPage.js
@@ -1,27 +1,51 @@
 import { NotionRenderer } from 'react-notion-x'
 import dynamic from 'next/dynamic'
-import mediumZoom from 'medium-zoom'
+// import mediumZoom from 'medium-zoom'
+import mediumZoom from '@fisch0920/medium-zoom'
 import React from 'react'
 import { isBrowser } from '@/lib/utils'
 import Image from 'next/image'
 import Link from 'next/link'
 import { Code } from 'react-notion-x/build/third-party/code'
-
-// 支持更多的自定义语言
+import { Pdf } from 'react-notion-x/build/third-party/pdf'
+import { Equation } from 'react-notion-x/build/third-party/equation'
+import 'prismjs/components/prism-bash.js'
+import 'prismjs/components/prism-markup-templating.js'
+import 'prismjs/components/prism-markup.js'
+import 'prismjs/components/prism-c.js'
+import 'prismjs/components/prism-cpp.js'
+import 'prismjs/components/prism-csharp.js'
+import 'prismjs/components/prism-docker.js'
+import 'prismjs/components/prism-java.js'
+import 'prismjs/components/prism-js-templates.js'
+import 'prismjs/components/prism-coffeescript.js'
+import 'prismjs/components/prism-diff.js'
+import 'prismjs/components/prism-git.js'
+import 'prismjs/components/prism-go.js'
+import 'prismjs/components/prism-graphql.js'
+import 'prismjs/components/prism-handlebars.js'
+import 'prismjs/components/prism-less.js'
+import 'prismjs/components/prism-makefile.js'
+import 'prismjs/components/prism-markdown.js'
+import 'prismjs/components/prism-objectivec.js'
+import 'prismjs/components/prism-ocaml.js'
+import 'prismjs/components/prism-python.js'
+import 'prismjs/components/prism-reason.js'
+import 'prismjs/components/prism-rust.js'
+import 'prismjs/components/prism-sass.js'
+import 'prismjs/components/prism-scss.js'
+import 'prismjs/components/prism-solidity.js'
+import 'prismjs/components/prism-sql.js'
+import 'prismjs/components/prism-stylus.js'
+import 'prismjs/components/prism-swift.js'
+import 'prismjs/components/prism-wasm.js'
+import 'prismjs/components/prism-yaml.js'
 import 'prismjs/components/prism-r.js'
 
 const Collection = dynamic(() =>
   import('react-notion-x/build/third-party/collection').then((m) => m.Collection), { ssr: true }
 )
 
-const Equation = dynamic(() =>
-  import('react-notion-x/build/third-party/equation').then((m) => m.Equation), { ssr: true }
-)
-
-const Pdf = dynamic(
-  () => import('react-notion-x/build/third-party/pdf').then((m) => m.Pdf), { ssr: false }
-)
-
 const Modal = dynamic(
   () => import('react-notion-x/build/third-party/modal').then((m) => m.Modal), { ssr: false }
 )
@@ -140,7 +164,9 @@ function addWatch4Dom(element) {
   const observer = new MutationObserver(mutationCallback)
   //   console.log(observer)
   // 以上述配置开始观察目标节点
-  observer.observe(targetNode, config)
+  if (targetNode) {
+    observer.observe(targetNode, config)
+  }
 
   // observer.disconnect();
 }
diff --git a/package.json b/package.json
index e1f17edf..3d94e8d0 100644
--- a/package.json
+++ b/package.json
@@ -34,8 +34,8 @@
     "memory-cache": "^0.2.0",
     "mongodb": "^4.6.0",
     "next": "12.1.6",
-    "notion-client": "6.12.9",
-    "notion-utils": "6.10.0",
+    "notion-client": "6.15.6",
+    "notion-utils": "6.15.6",
     "preact": "^10.5.15",
     "qrcode.react": "^1.0.1",
     "react": "17.0.2",
@@ -44,7 +44,7 @@
     "react-dom": "17.0.2",
     "react-facebook": "^8.1.4",
     "react-messenger-customer-chat": "^0.8.0",
-    "react-notion-x": "6.6.2",
+    "react-notion-x": "6.15.6",
     "react-share": "^4.4.0",
     "smoothscroll-polyfill": "^0.4.4",
     "typed.js": "^2.0.12",
diff --git a/pages/_app.js b/pages/_app.js
index e4205758..2099f722 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -9,7 +9,8 @@ import '@/styles/notion.css' //  重写部分样式
 // used for collection views (optional)
 // import 'rc-dropdown/assets/index.css'
 import 'prismjs/themes/prism-tomorrow.min.css'
-import 'react-notion-x/build/third-party/equation.css'
+// import 'react-notion-x/build/third-party/equation.css'
+import 'katex/dist/katex.min.css'
 
 // waline 评论插件
 import '@waline/client/dist/waline.css'
diff --git a/styles/notion.css b/styles/notion.css
index 4dc32e95..f4bcd76e 100644
--- a/styles/notion.css
+++ b/styles/notion.css
@@ -1902,3 +1902,11 @@ pre[class*='language-'] {
 .notion-table-cell-multi_select {
   padding: 7px 8px 0;
 }
+
+.notion-simple-table  {
+ width: 100% !important;
+}
+
+.notion-simple-table td {
+ white-space: nowrap;
+}
\ No newline at end of file