[add] Block transforming of Wiki Catalog & Task

[add] Document Rendering example

Author: TechQuery

ReadMe.md

@@ -23,7 +23,7 @@ Unofficial [TypeScript][1] SDK for [FeiShu/Lark API][2], which is based on [MobX
     - [BI Table example](https://idea2app.feishu.cn/wiki/Jzqbwv4biiY1Ckkqf95cS97Ynig)
 - [API document](https://idea2app.github.io/MobX-Lark/)
 
-### 1. Initialization
+### 1. Initialize Lark app
 
 #### User access token (front-end)
 
@@ -64,7 +64,7 @@ export const larkApp = new LarkApp({
 });
 ```
 
-### 2. Defination
+### 2. Define a model
 
 For example, we use a BI Table as a database:
 
@@ -92,7 +92,7 @@ export class ClientModel extends BiDataTable<Client>() {
 }
 ```
 
-### 3. Querying
+### 3. Query data
 
 Use Next.js page router for example:
 
@@ -126,6 +126,27 @@ const ClientIndexPage: FC<{ fullList: Client[] }> = ({ fullList }) => (
 export default ClientIndexPage;
 ```
 
+### 4. Render a document
+
+```ts
+import { writeFile } from 'fs/promises';
+import { DocumentModel, renderBlocks } from 'mobx-lark';
+import { renderToStaticMarkup } from 'react-dom/server';
+
+import { lark } from '../utility/lark';
+
+class MyDocumentModel extends DocumentModel {
+    client = lark.client;
+}
+const documentStore = new MyDocumentModel('idea2app.feishu.cn');
+
+const blocks = await documentStore.getOneBlocks('a_docx_token');
+
+const markup = renderToStaticMarkup(renderBlocks(blocks));
+
+await writeFile('document.html', markup);
+```
+
 ## Scaffolds
 
 1. https://github.com/idea2app/Lark-Next-Bootstrap-ts

package.json

@@ -31,7 +31,7 @@
         "mobx": "^6.13.7",
         "mobx-restful": "^2.1.0",
         "regenerator-runtime": "^0.14.1",
-        "web-utility": "^4.5.0"
+        "web-utility": "^4.5.1"
     },
     "peerDependencies": {
         "react": ">=16"

pnpm-lock.yaml

@@ -1,10 +1,12 @@
 import { HTTPError } from 'koajax';
 import { BaseListModel } from 'mobx-restful';
-import { cache } from 'web-utility';
+import { cache, formatDate, uniqueID } from 'web-utility';
 
 import { isLarkError, LarkData } from '../../type';
 import { createPageStream } from '../base';
+import { TaskModel } from '../Task';
 import { User } from '../User/type';
+import { WikiNode, WikiNodeModel } from '../Wiki';
 import {
     BiTableBlock,
     Block,
@@ -14,10 +16,15 @@ import {
     IframeBlock,
     IframeComponentType,
     ImageBlock,
+    OrderedBlock,
+    QuoteContainerBlock,
     SheetBlock,
+    SubPageList,
+    TaskBlock,
     TextBlock,
     TextElement,
-    TextRun
+    TextRun,
+    WikiCatalog
 } from './type';
 
 export * from './type';
@@ -93,10 +100,33 @@ export abstract class DocumentModel extends BaseListModel<Document> {
             }
     }
 
+    async #getWikiSubDocuments(token: string) {
+        const { client } = this;
+
+        class MyWikiNodeModel extends WikiNodeModel {
+            client = client;
+        }
+        const { body } = await client.get<LarkData<{ node: WikiNode }>>(
+            `wiki/v2/spaces/get_node?token=${token}`
+        );
+        const { space_id } = body!.data!.node;
+
+        const wikiNodeStore = new MyWikiNodeModel(this.domain, space_id);
+
+        return wikiNodeStore.getAll({ parent_node_token: token });
+    }
+
     async *#resolveBlocks(
         stream: AsyncIterable<Block<any, any, any>>,
         resolveFileURL?: FileURLResolver
     ) {
+        const { client } = this;
+
+        class MyTaskModel extends TaskModel {
+            client = client;
+        }
+        const taskStore = new MyTaskModel();
+
         for await (let block of stream) {
             if (block.block_type === BlockType.text) {
                 const { text } = block as TextBlock;
@@ -135,6 +165,61 @@ export abstract class DocumentModel extends BaseListModel<Document> {
                     `https://${this.domain}/base/${token}?table=${table}`
                 );
                 continue;
+            } else if (
+                block.block_type === BlockType.wiki_catalog ||
+                block.block_type === BlockType.sub_page_list
+            ) {
+                const parentBlock = {
+                    ...block,
+                    block_type: BlockType.quote_container,
+                    quote_container: {},
+                    children: []
+                } as QuoteContainerBlock;
+
+                yield parentBlock;
+
+                const { wiki_token } =
+                    'wiki_catalog' in block
+                        ? (block as WikiCatalog).wiki_catalog
+                        : (block as SubPageList).sub_page_list;
+
+                for (const { title, node_token } of await this.#getWikiSubDocuments(wiki_token)) {
+                    const text_run = {
+                        content: title,
+                        text_element_style: {
+                            link: { url: `https://${this.domain}/wiki/${node_token}` }
+                        }
+                    } as TextRun;
+
+                    const block_id = uniqueID();
+
+                    yield {
+                        parent_id: parentBlock.block_id,
+                        block_id,
+                        block_type: BlockType.ordered,
+                        ordered: { elements: [{ text_run }] }
+                    } as OrderedBlock;
+
+                    parentBlock.children!.push(block_id);
+                }
+                continue;
+            } else if (block.block_type === BlockType.task) {
+                const { task_id } = (block as TaskBlock).task;
+
+                const { url, summary, members, due, status } = await taskStore.getOne(task_id);
+                const content = [
+                    summary,
+                    members.map(({ name }) => `@${name}`).join(' '),
+                    due && formatDate(due.timestamp)
+                ]
+                    .filter(Boolean)
+                    .join(' ');
+                const newBlock = this.#createLinkBlock(block, url, content);
+
+                newBlock.text.style = { done: status === 'done' };
+
+                yield newBlock;
+                continue;
             }
             yield block;
         }

src/module/Document/index.ts

@@ -16,3 +16,7 @@ export type BiTableBlock = Block<
     'bitable',
     { token: string; view_type: BiTableViewType }
 >;
+
+export type WikiCatalog = Block<BlockType.wiki_catalog, 'wiki_catalog', { wiki_token: string }>;
+
+export type SubPageList = Block<BlockType.sub_page_list, 'sub_page_list', { wiki_token: string }>;