Merge branch 'Update' of https://github.com/RS-Imagine/NotionNext

.env.local

@@ -1,5 +1,5 @@
 # 环境变量 @see https://www.nextjs.cn/docs/basic-features/environment-variables
-NEXT_PUBLIC_VERSION=4.2.1
+NEXT_PUBLIC_VERSION=4.2.3
 
 
 # 可在此添加环境变量，去掉最左边的（# ）注释即可

.github/ISSUE_TEMPLATE/bug_report.md

@@ -27,6 +27,7 @@ assignees: tangly1024
 
 - 【必填】NotionNext版本 [例如. 4.0.18]
 - 【必填】主题 [例如. hexo]
+- 【必填】部署方案 [例如. vercel]
 - 【可选】操作系统: [例如. iOS, Android, macOS, windows]
 - 【可选】浏览器 [例如. chrome, safari, firefox]
 

.gitignore

@@ -36,7 +36,6 @@ yarn-error.log*
 
 # dev
 /data.json
-/yarn.lock
 /pnpm-lock.yaml
 .idea
 .vscode
@@ -45,4 +44,9 @@ yarn-error.log*
 # sitemap
 /public/robots.txt
 /public/sitemap.xml
-/public/rss/*
+/public/rss/*
+
+
+# yarn
+package-lock.json
+# yarn.lock

blog.config.js

@@ -37,6 +37,8 @@ const BLOG = {
 
   BLOG_FAVICON: process.env.NEXT_PUBLIC_FAVICON || '/favicon.ico', // blog favicon 配置, 默认使用 /public/favicon.ico，支持在线图片，如 https://img.imesong.com/favicon.png
 
+  IMAGE_COMPRESS_WIDTH: process.env.NEXT_PUBLIC_IMAGE_COMPRESS_WIDTH || 800, // 图片压缩宽度默认值，作用于博客封面和文章内容 越小加载图片越快
+  IMAGE_ZOOM_IN_WIDTH: process.env.NEXT_PUBLIC_IMAGE_ZOOM_IN_WIDTH || 1200, // 文章图片点击放大后的画质宽度，不代表在网页中的实际展示宽度
   RANDOM_IMAGE_URL: process.env.NEXT_PUBLIC_RANDOM_IMAGE_URL || '', // 随机图片API,如果未配置下面的关键字，主页封面，头像，文章封面图都会被替换为随机图片
   RANDOM_IMAGE_REPLACE_TEXT: process.env.NEXT_PUBLIC_RANDOM_IMAGE_NOT_REPLACE_TEXT || 'images.unsplash.com', // 触发替换图片的 url 关键字(多个支持用英文逗号分开)，只有图片地址中包含此关键字才会替换为上方随机图片url
   // eg: images.unsplash.com(notion图床的所有图片都会替换),如果你在 notion 里已经添加了一个随机图片 url，恰巧那个服务跑路或者挂掉，想一键切换所有配图可以将该 url 配置在这里
@@ -244,7 +246,7 @@ const BLOG = {
   //   ********挂件组件相关********
   // ----> 评论互动 可同时开启多个支持 WALINE VALINE GISCUS CUSDIS UTTERRANCES GITALK
 
-  COMMENT_HIDE_SINGLE_TAB: process.env.NEXT_PUBLIC_COMMENT_HIDE_SINGLE_TAB || false, //Whether hide the tab when there's no tabs. 只有一个评论组件时是否隐藏切换组件的标签页
+  COMMENT_HIDE_SINGLE_TAB: process.env.NEXT_PUBLIC_COMMENT_HIDE_SINGLE_TAB || false, // Whether hide the tab when there's no tabs. 只有一个评论组件时是否隐藏切换组件的标签页
 
   // artalk 评论插件
   COMMENT_ARTALK_SERVER: process.env.NEXT_PUBLIC_COMMENT_ARTALK_SERVER || '', // ArtalkServert后端地址 https://artalk.js.org/guide/deploy.html
@@ -352,6 +354,9 @@ const BLOG = {
   SEO_BAIDU_SITE_VERIFICATION:
         process.env.NEXT_PUBLIC_SEO_BAIDU_SITE_VERIFICATION || '', // Remove the value or replace it with your own google site verification code
 
+  // 微软 Clarity 站点分析
+  CLARITY_ID: process.env.NEXT_PUBLIC_CLARITY_ID || null, // 只需要复制Clarity脚本中的ID部分，ID是一个十位的英文数字组合
+
   // <---- 站点统计
 
   // START---->营收相关
@@ -417,7 +422,7 @@ const BLOG = {
   // 开发相关
   NOTION_ACCESS_TOKEN: process.env.NOTION_ACCESS_TOKEN || '', // Useful if you prefer not to make your database public
   DEBUG: process.env.NEXT_PUBLIC_DEBUG || false, // 是否显示调试按钮
-  ENABLE_CACHE: process.env.ENABLE_CACHE || process.env.npm_lifecycle_event === 'build', // 缓存在开发调试和打包过程中选择性开启，正式部署开启此功能意义不大。
+  ENABLE_CACHE: process.env.ENABLE_CACHE || process.env.npm_lifecycle_event === 'build' || process.env.npm_lifecycle_event === 'export', // 在打包过程中默认开启缓存，开发或运行时开启此功能意义不大。
   isProd: process.env.VERCEL_ENV === 'production', // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables)  isProd: process.env.VERCEL_ENV === 'production' // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables)
   BUNDLE_ANALYZER: process.env.ANALYZE === 'true' || false, // 是否展示编译依赖内容与大小
   VERSION: process.env.NEXT_PUBLIC_VERSION // 版本号

components/Collapse.js

@@ -1,4 +1,4 @@
-import React, { useEffect, useImperativeHandle } from 'react'
+import { useEffect, useImperativeHandle, useRef } from 'react'
 
 /**
  * 折叠面板组件，支持水平折叠、垂直折叠
@@ -7,7 +7,7 @@ import React, { useEffect, useImperativeHandle } from 'react'
  */
 const Collapse = props => {
   const { collapseRef } = props
-  const ref = React.useRef(null)
+  const ref = useRef(null)
   const type = props.type || 'vertical'
 
   useImperativeHandle(collapseRef, () => {
@@ -17,8 +17,10 @@ const Collapse = props => {
        * @param {*} param0
        */
       updateCollapseHeight: ({ height, increase }) => {
-        ref.current.style.height = ref.current.scrollHeight
-        ref.current.style.height = 'auto'
+        if (props.isOpen) {
+          ref.current.style.height = ref.current.scrollHeight
+          ref.current.style.height = 'auto'
+        }
       }
     }
   })

components/CustomContextMenu.js

@@ -100,6 +100,26 @@ export default function CustomContextMenu(props) {
     router.push({ pathname: router.pathname, query })
   }
 
+  /**
+   * 复制内容
+   */
+  function handleCopy() {
+    const selectedText = document.getSelection().toString();
+    if (selectedText) {
+      const tempInput = document.createElement('input');
+      tempInput.value = selectedText;
+      document.body.appendChild(tempInput);
+      tempInput.select();
+      document.execCommand('copy');
+      document.body.removeChild(tempInput);
+      // alert("Text copied: " + selectedText);
+    } else {
+      // alert("Please select some text first.");
+    }
+
+    setShow(false)
+  }
+
   function handleChangeDarkMode() {
     const newStatus = !isDarkMode
     saveDarkModeToCookies(newStatus)
@@ -153,7 +173,14 @@ export default function CustomContextMenu(props) {
                 {/* 功能按钮 */}
                 <div className='w-full px-2'>
 
-                    <div onClick={handleCopyLink} title={locale.MENU.COPY_URL} className='w-full px-2 h-10 flex justify-start items-center flex-nowrap cursor-pointer hover:bg-blue-600 hover:text-white rounded-lg duration-200 transition-all'>
+                    {siteConfig('CAN_COPY') && (
+                         <div onClick={handleCopy} title={locale.MENU.COPY} className='w-full px-2 h-10 flex justify-start items-center flex-nowrap cursor-pointer hover:bg-blue-600 hover:text-white rounded-lg duration-200 transition-all'>
+                         <i className="fa-solid fa-copy mr-2" />
+                         <div className='whitespace-nowrap'>{locale.MENU.COPY}</div>
+                     </div>
+                    )}
+
+                    <div onClick={handleCopyLink} title={locale.MENU.SHARE_URL} className='w-full px-2 h-10 flex justify-start items-center flex-nowrap cursor-pointer hover:bg-blue-600 hover:text-white rounded-lg duration-200 transition-all'>
                         <i className="fa-solid fa-arrow-up-right-from-square mr-2" />
                         <div className='whitespace-nowrap'>{locale.MENU.COPY_URL}</div>
                     </div>
@@ -167,7 +194,8 @@ export default function CustomContextMenu(props) {
                         <i className="fa-solid fa-palette mr-2" />
                         <div className='whitespace-nowrap'>{locale.MENU.THEME_SWITCH}</div>
                     </div>
-          )}
+                    )}
+
                 </div>
 
             </div>

components/Gitalk.js

@@ -21,6 +21,11 @@ const Gitalk = ({ frontMatter }) => {
     await loadExternalResource(gitalkCSSCDN, 'css')
     await loadExternalResource(gitalkJSCDN, 'js')
     const Gitalk = window.Gitalk
+    if (!Gitalk) {
+      // 可以加入延时重试
+      console.warn('Gitalk 初始化失败')
+      return
+    }
     const gitalk = new Gitalk({
       clientID: clientId,
       clientSecret: clientSecret,