nnbb 0.0.1

package/pages/category/[category]/page/[page].tsx

@@ -0,0 +1,103 @@
+import { getGlobalData } from '@/lib/notion/getNotionData';
+import React from 'react';
+import BLOG from '@/blog.config';
+import { useLayout } from '@/theme';
+import { useTranslation } from 'next-i18next';
+
+import type { GetStaticProps, GetStaticPaths } from 'next';
+import type {
+  PageMeta,
+  CategoryPageProps,
+  ThemeCategoryPageProps,
+} from '@/types';
+import type { FC } from 'react';
+import type { ParsedUrlQuery } from 'querystring';
+
+export interface CategoryPageParams extends ParsedUrlQuery {
+  category: string;
+  page: string;
+}
+
+/**
+ * 分类页
+ * @param {*} props
+ * @returns
+ */
+
+const CategoryPage: FC<CategoryPageProps> = (props) => {
+  const { siteInfo } = props;
+  const { t } = useTranslation('common');
+  // 根据页面路径加载不同Layout文件
+  const Layout = useLayout() as FC<ThemeCategoryPageProps>;
+
+  const pageMeta: PageMeta = {
+    title: `${props.category} | ${t('category')} | ${siteInfo?.title || ''}`,
+    description: siteInfo?.description,
+    slug: 'category/' + props.category,
+    image: siteInfo?.pageCover,
+    type: 'website',
+  };
+
+  return <Layout pageMeta={pageMeta} {...props} />;
+};
+
+export const getStaticProps: GetStaticProps<
+  CategoryPageProps,
+  CategoryPageParams
+> = async (context) => {
+  const { category, page } = context.params as CategoryPageParams;
+  const pageNumber = parseInt(page, 10);
+  const { allPages, ...globalProps } = await getGlobalData(
+    'category-page-props',
+  );
+
+  // 过滤状态类型
+  const posts = allPages
+    ?.filter(
+      (post) =>
+        post.type === 'Post' &&
+        post.status === 'Published' &&
+        post.category?.includes(category),
+    )
+    .slice(
+      BLOG.POSTS_PER_PAGE * (pageNumber - 1),
+      BLOG.POSTS_PER_PAGE * pageNumber,
+    );
+
+  return {
+    props: {
+      ...globalProps,
+      postCount: posts.length,
+      category,
+      page: pageNumber,
+    },
+    revalidate: BLOG.NEXT_REVALIDATE_SECOND,
+  };
+};
+
+export const getStaticPaths: GetStaticPaths<CategoryPageParams> = async () => {
+  const { categoryOptions, allPages } = await getGlobalData('category-paths');
+  const paths: { params: CategoryPageParams }[] = [];
+
+  categoryOptions?.forEach((category) => {
+    // 只处理发布状态的文章
+    const categoryPosts = allPages?.filter(
+      (post) =>
+        post.type === 'Post' &&
+        post.status === 'Published' &&
+        post.category?.includes(category.name),
+    );
+
+    const totalPages = Math.ceil(categoryPosts.length / BLOG.POSTS_PER_PAGE);
+    for (let i = 1; i <= totalPages; i++) {
+      paths.push({ params: { category: category.name, page: String(i) } });
+    }
+  });
+
+  return {
+    paths,
+    fallback: true,
+  };
+};
+
+export default CategoryPage;

package/pages/category/index.tsx

@@ -0,0 +1,43 @@
+import { getGlobalData } from '@/lib/notion/getNotionData';
+import React from 'react';
+import BLOG from '@/blog.config';
+import { useLayout } from '@/theme';
+import { useTranslation } from 'next-i18next';
+import { omit } from 'lodash';
+
+import type { FC } from 'react';
+import type { PageMeta, CategoryIndexProps, ThemeCategoryProps } from '@/types';
+import type { GetStaticProps } from 'next';
+
+/**
+ * 分类首页
+ * @param {*} props
+ * @returns
+ */
+const Category: FC<CategoryIndexProps> = (props) => {
+  const { siteInfo } = props;
+  const { t } = useTranslation('common');
+
+  // 根据页面路径加载不同Layout文件
+  const Layout = useLayout() as FC<ThemeCategoryProps>;
+
+  const pageMeta: PageMeta = {
+    title: `${t('category')} | ${siteInfo?.title}`,
+    description: siteInfo?.description,
+    image: siteInfo?.pageCover,
+    slug: 'category',
+    type: 'website',
+  };
+
+  return <Layout pageMeta={pageMeta} {...props} />;
+};
+
+export const getStaticProps: GetStaticProps<CategoryIndexProps> = async () => {
+  const globalData = await getGlobalData('category-index-props');
+  return {
+    props: omit(globalData, 'allPages'),
+    revalidate: BLOG.NEXT_REVALIDATE_SECOND,
+  };
+};
+
+export default Category;

package/pages/index.tsx

@@ -0,0 +1,88 @@
+import BLOG from '@/blog.config';
+import { getPostBlocks } from '@/lib/notion';
+import { getGlobalData } from '@/lib/notion/getNotionData';
+import { generateRss } from '@/lib/rss';
+import { generateRobotsTxt } from '@/lib/robots.txt';
+import { useLayout } from '@/theme';
+import { omit } from 'lodash';
+
+import type { GetStaticProps } from 'next';
+import type { FC } from 'react';
+import type { HomeIndexProps, ThemeHomeProps } from '@/types';
+import type { PageInfo } from '@/lib/notion/types';
+
+/**
+ * 首页布局
+ * @param {*} props
+ * @returns
+ */
+const Index: FC<HomeIndexProps> = (props) => {
+  // 根据页面路径加载不同Layout文件
+  const Layout = useLayout() as FC<ThemeHomeProps>;
+  return <Layout {...props} />;
+};
+
+/**
+ * SSG 获取数据
+ * @returns
+ */
+export const getStaticProps: GetStaticProps<HomeIndexProps> = async () => {
+  const globalData = await getGlobalData('index');
+
+  const { siteInfo } = globalData;
+  let posts: PageInfo[] = globalData.allPages?.filter(
+    (page) => page.type === 'Post' && page.status === 'Published',
+  );
+
+  const pageMeta = {
+    title: `${siteInfo?.title} | ${siteInfo?.description}`,
+    description: siteInfo?.description,
+    image: siteInfo?.pageCover,
+    slug: '',
+    type: 'website',
+  };
+
+  // 处理分页
+  if (BLOG.POST_LIST_STYLE === 'scroll') {
+    // 滚动列表默认给前端返回所有数据
+  }
+
+  if (BLOG.POST_LIST_STYLE === 'page') {
+    posts = posts?.slice(0, BLOG.POSTS_PER_PAGE) || [];
+  }
+
+  // 预览文章内容
+  if (BLOG.POST_LIST_PREVIEW === 'true') {
+    await Promise.all(
+      posts.map(async (post) => {
+        if (!post.password) {
+          post.blockMap = await getPostBlocks(
+            post.id,
+            'slug',
+            BLOG.POST_PREVIEW_LINES,
+          );
+        }
+      }),
+    );
+  }
+
+  // 生成robotTxt
+  generateRobotsTxt();
+  // 生成Feed订阅
+  if (BLOG.ENABLE_RSS) {
+    generateRss(globalData?.latestPosts || []);
+  }
+
+  // 生成全文索引 - 仅在 yarn build 时执行 && process.env.npm_lifecycle_event === 'build'
+
+  return {
+    props: {
+      pageMeta,
+      posts,
+      ...omit(globalData, 'allPages'),
+    },
+    revalidate: BLOG.NEXT_REVALIDATE_SECOND,
+  };
+};
+
+export default Index;

package/pages/page/[page].tsx

@@ -0,0 +1,93 @@
+import BLOG from '@/blog.config';
+import { getPostBlocks } from '@/lib/notion';
+import { getGlobalData } from '@/lib/notion/getNotionData';
+import { useLayout } from '@/theme';
+import { omit } from 'lodash';
+
+import type { GetStaticProps, GetStaticPaths } from 'next';
+import type { PageMeta, PageIndexProps, ThemePageProps } from '@/types';
+import type { FC } from 'react';
+import type { ParsedUrlQuery } from 'querystring';
+
+export interface PageParams extends ParsedUrlQuery {
+  page: string;
+}
+
+/**
+ * 文章列表分页
+ * @param {*} props
+ * @returns
+ */
+const Page: FC<PageIndexProps> = (props) => {
+  const { siteInfo } = props;
+
+  // 根据页面路径加载不同Layout文件
+  const PostList = useLayout() as FC<ThemePageProps>;
+  const pageMeta: PageMeta = {
+    title: `${props?.page} | Page | ${siteInfo?.title}`,
+    description: siteInfo?.description,
+    image: siteInfo?.pageCover,
+    slug: 'page/' + props.page,
+    type: 'website',
+  };
+
+  return <PostList pageMeta={pageMeta} {...props} />;
+};
+
+export const getStaticPaths: GetStaticPaths<PageParams> = async () => {
+  const from = 'page-paths';
+  const { postCount } = await getGlobalData(from);
+  const totalPages = Math.ceil(postCount / BLOG.POSTS_PER_PAGE);
+  return {
+    // remove first page, we 're not gonna handle that.
+    paths: Array.from({ length: totalPages - 1 }, (_, i) => ({
+      params: { page: '' + (i + 2) },
+    })),
+    fallback: true,
+  };
+};
+
+export const getStaticProps: GetStaticProps<
+  PageIndexProps,
+  PageParams
+> = async (context) => {
+  const { page } = context.params as PageParams;
+  const pageNumber = parseInt(page, 10);
+  const props = await getGlobalData(`page-${pageNumber}`);
+  const { allPages } = props;
+  const allPosts = allPages?.filter(
+    (page) => page.type === 'Post' && page.status === 'Published',
+  );
+  // 处理分页
+  const posts = allPosts.slice(
+    BLOG.POSTS_PER_PAGE * (pageNumber - 1),
+    BLOG.POSTS_PER_PAGE * pageNumber,
+  );
+
+  // 处理预览
+  if (BLOG.POST_LIST_PREVIEW === 'true') {
+    await Promise.all(
+      posts.map(async (post) => {
+        if (!post.password) {
+          post.blockMap = await getPostBlocks(
+            post.id,
+            'slug',
+            BLOG.POST_PREVIEW_LINES,
+          );
+        }
+      }),
+    );
+  }
+
+  omit(props, 'allPages');
+  return {
+    props: {
+      ...props,
+      posts,
+      page: pageNumber,
+    },
+    revalidate: BLOG.NEXT_REVALIDATE_SECOND,
+  };
+};
+
+export default Page;

package/pages/search/[keyword]/index.tsx

@@ -0,0 +1,162 @@
+import { getGlobalData } from '@/lib/notion/getNotionData';
+import BLOG from '@/blog.config';
+import { useLayout } from '@/theme';
+import { useTranslation } from 'next-i18next';
+
+import type { GetStaticProps, GetStaticPaths } from 'next';
+import type {
+  PageMeta,
+  SearchDetailProps,
+  ThemeSearchDetailProps,
+} from '@/types';
+import type { FC } from 'react';
+import type { ParsedUrlQuery } from 'querystring';
+import { DataBaseInfo, PageInfo } from '@/lib/notion/types';
+import { getDataFromCache } from '@/lib/cache/cacheManager';
+
+export interface CategoryDetailParams extends ParsedUrlQuery {
+  keyword: string;
+}
+
+const SearchDetail: FC<SearchDetailProps> = (props) => {
+  const { keyword, siteInfo } = props;
+  const { t } = useTranslation('nav');
+
+  // 根据页面路径加载不同Layout文件
+  const Layout = useLayout() as FC<ThemeSearchDetailProps>;
+
+  const pageMeta: PageMeta = {
+    title: `${keyword || ''}${keyword ? ' | ' : ''}${t('search')} | ${siteInfo?.title}`,
+    description: siteInfo?.title,
+    image: siteInfo?.pageCover,
+    slug: 'search/' + (keyword || ''),
+    type: 'website',
+  };
+
+  return <Layout {...props} pageMeta={pageMeta} />;
+};
+
+/**
+ * 服务端搜索
+ * @param {*} param0
+ * @returns
+ */
+export const getStaticProps: GetStaticProps<
+  SearchDetailProps,
+  CategoryDetailParams
+> = async (context) => {
+  const { allPages, ...restProps } = await getGlobalData('search-detail-page');
+  const { keyword } = context.params as CategoryDetailParams;
+  const allPosts = allPages?.filter(
+    (page) => page.type === 'Post' && page.status === 'Published',
+  );
+  const filteredPosts = await filterByMemCache(allPosts, keyword);
+  const posts =
+    BLOG.POST_LIST_STYLE === 'page'
+      ? filteredPosts.slice(0, BLOG.POSTS_PER_PAGE)
+      : filteredPosts;
+
+  return {
+    props: {
+      ...restProps,
+      postCount: posts.length,
+      keyword,
+      posts,
+    },
+    revalidate: BLOG.NEXT_REVALIDATE_SECOND,
+  };
+};
+
+export const getStaticPaths: GetStaticPaths<
+  CategoryDetailParams
+> = async () => {
+  return {
+    paths: [{ params: { keyword: BLOG.TITLE } }],
+    fallback: true,
+  };
+};
+
+function extractTextContent(
+  sourceText: string[],
+  targetObj: any,
+  key: string,
+): string[] {
+  if (!targetObj) return sourceText;
+  const textArray = targetObj[key];
+  const text =
+    typeof textArray === 'object' ? getTextContent(textArray) : textArray;
+  return text && text !== 'Untitled' ? sourceText.concat(text) : sourceText;
+}
+
+/**
+ * 递归获取层层嵌套的数组
+ * @param {*} textArray
+ * @returns
+ */
+function getTextContent(textArray: any): string {
+  return Array.isArray(textArray)
+    ? textArray.reduce((acc, item) => acc + getTextContent(item), '')
+    : typeof textArray === 'string'
+      ? textArray
+      : '';
+}
+
+/**
+ * 在内存缓存中进行全文索引
+ * @param {*} posts
+ * @param keyword 关键词
+ * @returns
+ */
+async function filterByMemCache(posts: PageInfo[], keyword: string) {
+  if (!keyword) return [];
+  const lowerKeyword = keyword.toLowerCase().trim();
+  const filterPosts: PageInfo[] = [];
+
+  posts.forEach(async (post) => {
+    const page = await getDataFromCache<DataBaseInfo>(
+      `page_block_${post.id}`,
+      true,
+    );
+    const tagContent = post?.tags?.join(' ') || '';
+    const categoryContent = post?.category || '';
+    const articleInfo = (
+      post.title +
+      post.summary +
+      tagContent +
+      categoryContent
+    ).toLowerCase();
+
+    post.results = [];
+    let hit = articleInfo.includes(lowerKeyword);
+    let hitCount = 0;
+
+    const indexContent = page ? getPageContentText(post, page) : [];
+    for (const content of indexContent) {
+      if (!content) continue;
+      if (content.toLowerCase().includes(lowerKeyword)) {
+        hit = true;
+        hitCount += 1;
+        post.results.push(content);
+      } else if ((post.results.length - 1) / (hitCount || 1) < 3) {
+        post.results.push(content);
+      }
+    }
+
+    if (hit) filterPosts.push(post);
+  });
+  return filterPosts;
+}
+
+export function getPageContentText(post: PageInfo, dataBaseInfo: DataBaseInfo) {
+  let indexContent: string[] = [];
+  if (dataBaseInfo && dataBaseInfo?.block && !post.password) {
+    Object.keys(dataBaseInfo.block).forEach((id) => {
+      const properties = dataBaseInfo.block[id]?.value?.properties;
+      indexContent = extractTextContent(indexContent, properties, 'title');
+      indexContent = extractTextContent(indexContent, properties, 'caption');
+    });
+  }
+  return indexContent;
+}
+
+export default SearchDetail;

package/pages/search/[keyword]/page/[page].tsx

@@ -0,0 +1,166 @@
+import { getGlobalData } from '@/lib/notion/getNotionData';
+import { getDataFromCache } from '@/lib/cache/cacheManager';
+import BLOG from '@/blog.config';
+import { useLayout } from '@/theme';
+import { useTranslation } from 'next-i18next';
+import { isIterable } from '@/lib/utils';
+
+import type { FC } from 'react';
+import type { PageMeta, SearchPageProps, ThemeSearchPageProps } from '@/types';
+import type { ParsedUrlQuery } from 'querystring';
+import type { GetStaticPaths, GetStaticProps } from 'next';
+import type { DataBaseInfo, PageInfo } from '@/lib/notion/types';
+
+export interface SearchPageParams extends ParsedUrlQuery {
+  keyword: string;
+  page: string;
+}
+
+const SearchPage: FC<SearchPageProps> = (props) => {
+  const { keyword, siteInfo } = props;
+  const { t } = useTranslation('nav');
+
+  // 根据页面路径加载不同Layout文件
+  const Layout = useLayout() as FC<ThemeSearchPageProps>;
+
+  const pageMeta: PageMeta = {
+    title: `${keyword || ''}${keyword ? ' | ' : ''}${t('search')} | ${siteInfo?.title}`,
+    description: siteInfo?.title,
+    image: siteInfo?.pageCover,
+    slug: 'search/' + (keyword || ''),
+    type: 'website',
+  };
+
+  return <Layout {...props} pageMeta={pageMeta} />;
+};
+
+/**
+ * 服务端搜索
+ * @param {*} param0
+ * @returns
+ */
+export const getStaticProps: GetStaticProps<
+  SearchPageProps,
+  SearchPageParams
+> = async (context) => {
+  const { keyword, page } = context.params as SearchPageParams;
+  const { allPages, ...restProps } = await getGlobalData('search-props');
+  const pageNumber = parseInt(page, 10);
+  const filteredPosts = allPages?.filter(
+    (page) => page.type === 'Post' && page.status === 'Published',
+  );
+  const posts = (await filterByMemCache(filteredPosts, keyword)).slice(
+    BLOG.POSTS_PER_PAGE * (pageNumber - 1),
+    BLOG.POSTS_PER_PAGE * pageNumber,
+  );
+  return {
+    props: {
+      ...restProps,
+      posts,
+      postCount: posts.length,
+      page: pageNumber,
+      keyword,
+    },
+    revalidate: BLOG.NEXT_REVALIDATE_SECOND,
+  };
+};
+
+export const getStaticPaths: GetStaticPaths<SearchPageParams> = () => {
+  return {
+    paths: [{ params: { keyword: BLOG.TITLE, page: '1' } }],
+    fallback: true,
+  };
+};
+
+/**
+ * 将对象的指定字段拼接到字符串
+ * @param sourceTextArray
+ * @param targetObj
+ * @param key
+ * @returns {*}
+ */
+function appendText(sourceTextArray: string[], targetObj: any, key: string) {
+  if (!targetObj) return sourceTextArray;
+  const textArray = targetObj[key];
+  const text = textArray ? getTextContent(textArray) : '';
+  if (text && text !== 'Untitled') {
+    return sourceTextArray.concat(text);
+  }
+  return sourceTextArray;
+}
+
+/**
+ * 递归获取层层嵌套的数组
+ * @param {*} textArray
+ * @returns
+ */
+function getTextContent(textArray: any) {
+  if (typeof textArray === 'object' && isIterable(textArray)) {
+    let result = '';
+    for (const textObj of textArray) {
+      result = result + getTextContent(textObj);
+    }
+    return result;
+  } else if (typeof textArray === 'string') {
+    return textArray;
+  }
+}
+
+/**
+ * 在内存缓存中进行全文索引
+ * @param {*} posts
+ * @param keyword 关键词
+ * @returns
+ */
+async function filterByMemCache(posts: PageInfo[], keyword: string) {
+  if (!keyword) return [];
+  const lowerKeyword = keyword.toLowerCase().trim();
+  const filterPosts: PageInfo[] = [];
+
+  posts.forEach(async (post) => {
+    const page = await getDataFromCache<DataBaseInfo>(
+      `page_block_${post.id}`,
+      true,
+    );
+    const tagContent = post?.tags?.join(' ') || '';
+    const categoryContent = post?.category || '';
+    const articleInfo = (
+      post.title +
+      post.summary +
+      tagContent +
+      categoryContent
+    ).toLowerCase();
+
+    post.results = [];
+    let hit = articleInfo.includes(lowerKeyword);
+    let hitCount = 0;
+
+    let indexContent = [post.summary];
+    if (page && page.block) {
+      Object.values(page.block).forEach((block) => {
+        const properties = block.value.properties;
+        indexContent = appendText(indexContent, properties, 'title');
+        indexContent = appendText(indexContent, properties, 'caption');
+      });
+    }
+
+    indexContent.forEach((content, index) => {
+      if (content && post.results) {
+        if (content.toLowerCase().includes(lowerKeyword)) {
+          hit = true;
+          hitCount += 1;
+          post.results.push(content);
+        } else if ((post.results.length - 1) / hitCount < 3 || index === 0) {
+          post.results.push(content);
+        }
+      }
+    });
+
+    if (hit) {
+      filterPosts.push(post);
+    }
+  });
+  return filterPosts;
+}
+
+export default SearchPage;