|
1 | 1 | import { marked } from 'marked'; |
2 | | -import { DataObject } from 'mobx-restful'; |
3 | | -import { GetStaticPaths, GetStaticProps, NextPage } from 'next'; |
| 2 | +import { GetStaticPaths, GetStaticProps } from 'next'; |
4 | 3 | import { ParsedUrlQuery } from 'querystring'; |
| 4 | +import { FC } from 'react'; |
| 5 | +import { Badge, Breadcrumb, Button, Container } from 'react-bootstrap'; |
| 6 | +import { decodeBase64 } from 'web-utility'; |
5 | 7 |
|
6 | | -import { pageListOf, splitFrontMatter, traverseTree } from '../api/core'; |
| 8 | +import { PageHead } from '../../components/Layout/PageHead'; |
| 9 | +import { policyContentStore, XContent } from '../../models/Wiki'; |
| 10 | +import { splitFrontMatter } from '../api/core'; |
7 | 11 |
|
8 | 12 | interface WikiPageParams extends ParsedUrlQuery { |
9 | 13 | slug: string[]; |
10 | 14 | } |
11 | 15 |
|
12 | 16 | export const getStaticPaths: GetStaticPaths<WikiPageParams> = async () => { |
13 | | - const tree = await Array.fromAsync(pageListOf('wiki', 'public/')); |
14 | | - const list = tree.map(root => [...traverseTree(root, 'subs')]).flat(); |
15 | | - const paths = list |
16 | | - .map(({ path }) => path && { params: { slug: path.split('/') } }) |
17 | | - .filter(Boolean) as { params: WikiPageParams }[]; |
| 17 | + const nodes = await policyContentStore.getAll(); |
| 18 | + |
| 19 | + const paths = nodes |
| 20 | + .filter(({ type }) => type === 'file') |
| 21 | + .map(({ path }) => ({ params: { slug: path.split('/') } })); |
18 | 22 |
|
19 | 23 | return { paths, fallback: 'blocking' }; |
20 | 24 | }; |
21 | 25 |
|
22 | | -interface WikiPageProps { |
23 | | - meta?: DataObject; |
24 | | - markup: string; |
25 | | -} |
26 | | - |
27 | | -export const getStaticProps: GetStaticProps<WikiPageProps, WikiPageParams> = async ({ params }) => { |
| 26 | +export const getStaticProps: GetStaticProps<XContent, WikiPageParams> = async ({ params }) => { |
28 | 27 | const { slug } = params!; |
29 | | - // https://github.com/vercel/next.js/issues/12851 |
30 | | - if (slug[0] !== 'wiki') slug.unshift('wiki'); |
31 | 28 |
|
32 | | - const { meta, markdown } = await splitFrontMatter(`public/${slug.join('/')}.md`); |
| 29 | + const node = await policyContentStore.getOne(slug.join('/')); |
| 30 | + |
| 31 | + const { meta, markdown } = splitFrontMatter(decodeBase64(node.content!)); |
33 | 32 |
|
34 | 33 | const markup = marked(markdown) as string; |
35 | 34 |
|
36 | | - return { props: JSON.parse(JSON.stringify({ meta, markup })) }; |
| 35 | + return { |
| 36 | + props: JSON.parse(JSON.stringify({ ...node, content: markup, meta })), |
| 37 | + revalidate: 300, // Revalidate every 5 minutes |
| 38 | + }; |
37 | 39 | }; |
38 | 40 |
|
39 | | -const WikiPage: NextPage<WikiPageProps> = ({ meta, markup }) => ( |
40 | | - <> |
41 | | - {meta && ( |
42 | | - <blockquote> |
43 | | - <a target="_blank" href={meta.url} rel="noreferrer"> |
44 | | - {meta.url} |
45 | | - </a> |
46 | | - </blockquote> |
47 | | - )} |
48 | | - <article dangerouslySetInnerHTML={{ __html: markup }} /> |
49 | | - </> |
| 41 | +const WikiPage: FC<XContent> = ({ name, path, parent_path, content, meta }) => ( |
| 42 | + <Container className="py-4"> |
| 43 | + <PageHead title={name} /> |
| 44 | + |
| 45 | + <Breadcrumb className="mb-4"> |
| 46 | + <Breadcrumb.Item href="/wiki">Wiki</Breadcrumb.Item> |
| 47 | + |
| 48 | + {parent_path?.split('/').map((segment, index, array) => { |
| 49 | + const breadcrumbPath = array.slice(0, index + 1).join('/'); |
| 50 | + |
| 51 | + return ( |
| 52 | + <Breadcrumb.Item key={breadcrumbPath} href={`/wiki/${breadcrumbPath}`}> |
| 53 | + {segment} |
| 54 | + </Breadcrumb.Item> |
| 55 | + ); |
| 56 | + })} |
| 57 | + <Breadcrumb.Item active>{name}</Breadcrumb.Item> |
| 58 | + </Breadcrumb> |
| 59 | + |
| 60 | + <article> |
| 61 | + <header className="mb-4"> |
| 62 | + <h1>{name}</h1> |
| 63 | + |
| 64 | + {meta && ( |
| 65 | + <div className="d-flex flex-wrap align-items-center gap-3 mb-3"> |
| 66 | + <ul className="mb-0"> |
| 67 | + {meta['主题分类'] && ( |
| 68 | + <li> |
| 69 | + <Badge bg="primary">{meta['主题分类']}</Badge> |
| 70 | + </li> |
| 71 | + )} |
| 72 | + {meta['发文机构'] && ( |
| 73 | + <li> |
| 74 | + <Badge bg="secondary">{meta['发文机构']}</Badge> |
| 75 | + </li> |
| 76 | + )} |
| 77 | + {meta['有效性'] && ( |
| 78 | + <li> |
| 79 | + <Badge bg={meta['有效性'] === '现行有效' ? 'success' : 'warning'}> |
| 80 | + {meta['有效性']} |
| 81 | + </Badge> |
| 82 | + </li> |
| 83 | + )} |
| 84 | + </ul> |
| 85 | + </div> |
| 86 | + )} |
| 87 | + |
| 88 | + <div className="d-flex justify-content-between align-items-center text-muted small mb-3"> |
| 89 | + <div> |
| 90 | + {meta?.['成文日期'] && <span>成文日期: {meta['成文日期']}</span>} |
| 91 | + {meta?.['发布日期'] && meta['发布日期'] !== meta['成文日期'] && ( |
| 92 | + <span className="ms-3">发布日期: {meta['发布日期']}</span> |
| 93 | + )} |
| 94 | + </div> |
| 95 | + |
| 96 | + <div className="d-flex gap-2"> |
| 97 | + <Button |
| 98 | + variant="outline-primary" |
| 99 | + size="sm" |
| 100 | + href={`https://github.com/fpsig/open-source-policy/blob/main/China/政策/${path}`} |
| 101 | + target="_blank" |
| 102 | + rel="noopener noreferrer" |
| 103 | + > |
| 104 | + 在 GitHub 编辑 |
| 105 | + </Button> |
| 106 | + {meta?.url && ( |
| 107 | + <Button |
| 108 | + variant="outline-secondary" |
| 109 | + size="sm" |
| 110 | + href={meta.url} |
| 111 | + target="_blank" |
| 112 | + rel="noopener noreferrer" |
| 113 | + > |
| 114 | + 查看原文 |
| 115 | + </Button> |
| 116 | + )} |
| 117 | + </div> |
| 118 | + </div> |
| 119 | + </header> |
| 120 | + |
| 121 | + <div dangerouslySetInnerHTML={{ __html: content || '' }} className="markdown-body" /> |
| 122 | + </article> |
| 123 | + |
| 124 | + <footer className="mt-5 pt-4 border-top"> |
| 125 | + <div className="text-center"> |
| 126 | + <p className="text-muted"> |
| 127 | + 这是一个基于 GitHub 仓库的政策文档页面。 |
| 128 | + <a |
| 129 | + href={`https://github.com/fpsig/open-source-policy/blob/main/China/政策/${path}`} |
| 130 | + target="_blank" |
| 131 | + rel="noopener noreferrer" |
| 132 | + className="ms-2" |
| 133 | + > |
| 134 | + 在 GitHub 上查看或编辑此内容 |
| 135 | + </a> |
| 136 | + </p> |
| 137 | + </div> |
| 138 | + </footer> |
| 139 | + </Container> |
50 | 140 | ); |
| 141 | + |
51 | 142 | export default WikiPage; |
0 commit comments