Merge pull request #777 from tangly1024/feat_custom_table_options

Feat custom table options

.env.local

@@ -1,2 +1,2 @@
 # 环境变量 @see https://www.nextjs.cn/docs/basic-features/environment-variables
-NEXT_PUBLIC_VERSION=3.10.1
+NEXT_PUBLIC_VERSION=3.10.2

blog.config.js

@@ -194,9 +194,14 @@ const BLOG = {
   // 自定义配置notion数据库字段名
   NOTION_PROPERTY_NAME: {
     password: process.env.NEXT_PUBLIC_NOTION_PROPERTY_PASSWORD || 'password',
-    type: process.env.NEXT_PUBLIC_NOTION_PROPERTY_TYPE || 'type',
-    title: process.env.NEXT_PUBLIC_NOTION_PROPERTY_TITLE || 'title',
+    type: process.env.NEXT_PUBLIC_NOTION_PROPERTY_TYPE || 'type', // 文章类型，
+    type_post: process.env.NEXT_PUBLIC_NOTION_PROPERTY_TYPE_POST || 'Post', // 当type文章类型与此值相同时，为博文。
+    type_page: process.env.NEXT_PUBLIC_NOTION_PROPERTY_TYPE_PAGE || 'Page', // 当type文章类型与此值相同时，为单页。
+    type_notice: process.env.NEXT_PUBLIC_NOTION_PROPERTY_TYPE_NOTICE || 'Notice', // 当type文章类型与此值相同时，为公告。
+    title: process.env.NEXT_PUBLIC_NOTION_PROPERTY_TITLE || 'title', // 文章标题
     status: process.env.NEXT_PUBLIC_NOTION_PROPERTY_STATUS || 'status',
+    status_publish: process.env.NEXT_PUBLIC_NOTION_PROPERTY_STATUS_PUBLISH || 'Published', // 当status状态值与此相同时为发布，可以为中文
+    status_invisible: process.env.NEXT_PUBLIC_NOTION_PROPERTY_STATUS_INVISIBLE || 'Invisible', // 当status状态值与此相同时为隐藏发布，可以为中文 ， 除此之外其他页面状态不会显示在博客上
     summary: process.env.NEXT_PUBLIC_NOTION_PROPERTY_SUMMARY || 'summary',
     slug: process.env.NEXT_PUBLIC_NOTION_PROPERTY_SLUG || 'slug',
     category: process.env.NEXT_PUBLIC_NOTION_PROPERTY_CATEGORY || 'category',

lib/lang/en-US.js

@@ -38,7 +38,8 @@ export default {
     RECENT_COMMENTS: 'Recent Comments',
     DEBUG_OPEN: 'Debug',
     DEBUG_CLOSE: 'Close',
-    THEME_SWITCH: 'Theme Switch'
+    THEME_SWITCH: 'Theme Switch',
+    ANNOUNCEMENT: 'Announcement'
   },
   PAGINATION: {
     PREV: 'Prev',

lib/lang/zh-CN.js

@@ -40,7 +40,8 @@ export default {
     RECENT_COMMENTS: '最新评论',
     DEBUG_OPEN: '开启调试',
     DEBUG_CLOSE: '关闭调试',
-    THEME_SWITCH: '切换主题'
+    THEME_SWITCH: '切换主题',
+    ANNOUNCEMENT: '公告'
   },
   PAGINATION: {
     PREV: '上一页',

lib/notion/getPageProperties.js

@@ -61,7 +61,7 @@ export default async function getPageProperties(id, block, schema, authToken, ta
     }
   }
 
-  // 设置自定义字段
+  // 映射键：用户自定义表头名
   const fieldNames = BLOG.NOTION_PROPERTY_NAME
   if (fieldNames) {
     Object.keys(fieldNames).forEach(key => {
@@ -69,9 +69,13 @@ export default async function getPageProperties(id, block, schema, authToken, ta
     })
   }
 
+  // type\status是下拉选框 取数组第一个
   properties.type = properties.type?.[0]
   properties.status = properties.status?.[0]
 
+  // 映射值：用户个性化type和status字段的下拉框选项，在此映射回代码的英文标识
+  mapProperties(properties)
+
   if (properties.type === 'Post') {
     properties.slug = BLOG.POST_URL_PREFIX ? (BLOG.POST_URL_PREFIX + '/' + (properties.slug ?? properties.id)) : (properties.slug ?? properties.id)
   } else {
@@ -121,3 +125,21 @@ function getImageUrl(imgObj, blockVal) {
   // 其他图片链接 或 emoji
   return imgObj
 }
+
+function mapProperties(properties) {
+  if (properties?.type === BLOG.NOTION_PROPERTY_NAME.type_post) {
+    properties.type = 'Post'
+  }
+  if (properties?.type === BLOG.NOTION_PROPERTY_NAME.type_page) {
+    properties.type = 'Page'
+  }
+  if (properties?.type === BLOG.NOTION_PROPERTY_NAME.type_notice) {
+    properties.type = 'Notice'
+  }
+  if (properties?.status === BLOG.NOTION_PROPERTY_NAME.status_publish) {
+    properties.status = 'Published'
+  }
+  if (properties?.status === BLOG.NOTION_PROPERTY_NAME.status_invisible) {
+    properties.status = 'Invisible'
+  }
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "notion-next",
-  "version": "3.10.1",
+  "version": "3.10.2",
   "homepage": "https://github.com/tangly1024/NotionNext.git",
   "license": "MIT",
   "repository": {

themes/example/components/Announcement.js

@@ -1,16 +1,18 @@
+import { useGlobal } from '@/lib/global'
 import dynamic from 'next/dynamic'
 
 const NotionPage = dynamic(() => import('@/components/NotionPage'))
 
 const Announcement = ({ post, className }) => {
+  const { locale } = useGlobal()
   if (!post) {
     return <></>
   }
   return <aside className="rounded shadow overflow-hidden mb-6">
 
            <h3 className="text-sm bg-gray-100 text-gray-700 dark:bg-hexo-black-gray dark:text-gray-200 py-3 px-4 dark:border-hexo-black-gray border-b">
-                <i className="mr-2 fas fa-bullhorn" />
-           公告</h3>
+                <i className="mr-2 fas fa-bullhorn" />{locale.COMMON.ANNOUNCEMENT}
+           </h3>
 
         {post && (<div id="announcement-content">
             <NotionPage post={post} className='text-center ' />

themes/hexo/components/Announcement.js

@@ -1,12 +1,12 @@
+import { useGlobal } from '@/lib/global'
 import dynamic from 'next/dynamic'
 
 const NotionPage = dynamic(() => import('@/components/NotionPage'))
 
 const Announcement = ({ post, className }) => {
-  if (!post) {
-    return <></>
-  }
-  return <div
+  const { locale } = useGlobal()
+  if (post?.blockMap) {
+    return <div
         data-aos="fade-up"
         data-aos-duration="600"
         data-aos-easing="ease-in-out"
@@ -14,11 +14,14 @@ const Announcement = ({ post, className }) => {
         data-aos-anchor-placement="top-bottom"
         className={className}>
         <section id='announcement-wrapper' className="hover:shadow-md dark:text-gray-300 border dark:border-black rounded-xl px-2 py-4 bg-white dark:bg-hexo-black-gray">
-            <div><i className='mr-2 fas fa-bullhorn' />公告</div>
+            <div><i className='mr-2 fas fa-bullhorn' />{locale.COMMON.ANNOUNCEMENT}</div>
             {post && (<div id="announcement-content">
             <NotionPage post={post} className='text-center ' />
         </div>)}
         </section>
     </div>
+  } else {
+    return <></>
+  }
 }
 export default Announcement

themes/hexo/components/SideRight.js

@@ -9,6 +9,7 @@ import CONFIG_HEXO from '../config_hexo'
 import BLOG from '@/blog.config'
 import dynamic from 'next/dynamic'
 import Announcement from './Announcement'
+import { useGlobal } from '@/lib/global'
 
 const HexoRecentComments = dynamic(() => import('./HexoRecentComments'))
 /**
@@ -21,6 +22,8 @@ export default function SideRight(props) {
     post, currentCategory, categories, latestPosts, tags,
     currentTag, showCategory, showTag, slot, notice
   } = props
+
+  const { locale } = useGlobal()
   return (
     <div className={'space-y-4 lg:w-80 lg:pt-0 px-2 pt-4'}>
       <InfoCard {...props} />
@@ -29,7 +32,7 @@ export default function SideRight(props) {
       {showCategory && (
         <Card>
           <div className='ml-2 mb-1 '>
-            <i className='fas fa-th' /> 分类
+            <i className='fas fa-th' /> {locale.COMMON.CATEGORY}
           </div>
           <CategoryGroup
             currentCategory={currentCategory}

themes/next/components/Announcement.js

@@ -1,16 +1,17 @@
+import { useGlobal } from '@/lib/global'
 import dynamic from 'next/dynamic'
 
 const NotionPage = dynamic(() => import('@/components/NotionPage'))
 
 const Announcement = ({ post, className }) => {
+  const { locale } = useGlobal()
   if (!post) {
     return <></>
   }
   return <>
         <div className="text-sm pb-1 px-2 flex flex-nowrap justify-between">
             <div className="font-light text-gray-600  dark:text-gray-200">
-                <i className="mr-2 fas fa-bullhorn" />
-                公告
+                <i className="mr-2 fas fa-bullhorn" />{locale.COMMON.ANNOUNCEMENT}
             </div>
         </div>
         {post && (<div id="announcement-content">