feat: 插件中心增加文档预览

shared/cache/cache.ts

@@ -8,6 +8,7 @@ import {
   PluginManifest,
 } from '../model/plugin';
 import { fetchUserInfo, UserBaseInfo } from '../model/user';
+import { parseUrlStr } from '../utils/url-helper';
 import { queryClient } from './index';
 
 /**
@@ -68,7 +69,7 @@ export async function getCachedRegistryPlugins(): Promise<PluginManifest[]> {
             list.map((manifest) => ({
               ...manifest,
               // 后端url策略。根据前端的url在获取时自动变更为当前链接的后端地址
-              url: String(manifest.url).replace('{BACKEND}', getServiceUrl()),
+              url: parseUrlStr(manifest.url),
             }))
           )
           .catch(() => []),

shared/index.tsx

@@ -193,4 +193,5 @@ export { isValidJson } from './utils/json-helper';
 export { MessageHelper } from './utils/message-helper';
 export { uploadFile } from './utils/upload-helper';
 export type { UploadFileResult } from './utils/upload-helper';
+export { parseUrlStr } from './utils/url-helper';
 export { sleep } from './utils/utils';

shared/utils/url-helper.ts

@@ -0,0 +1,10 @@
+import { getServiceUrl } from '../manager/service';
+
+/**
+ * 解析url, 将中间的常量替换成变量
+ * @param originUrl 原始Url
+ * @returns 解析后的url
+ */
+export function parseUrlStr(originUrl: string): string {
+  return String(originUrl).replace('{BACKEND}', getServiceUrl());
+}

web/.ministarrc.js

@@ -18,6 +18,14 @@ module.exports = {
           ),
           dest: path.resolve(__dirname, `./dist/plugins/${pluginName}/assets/`),
         },
+        {
+          src: path.resolve(
+            __dirname,
+            `./plugins/${pluginName}`,
+            './README.md'
+          ),
+          dest: path.resolve(__dirname, `./dist/plugins/${pluginName}/`),
+        },
       ],
     }),
     replace({

web/plugins/com.msgbyte.webview/README.md

@@ -0,0 +1,7 @@
+## com.msgbyte.webview
+
+为 `Tailchat` 增加 `Webview` 能力
+
+### Usage
+
+在 群组设置 -> 创建面板 可以添加网页面板。

web/plugins/com.msgbyte.webview/manifest.json

@@ -5,5 +5,6 @@
   "version": "0.0.0",
   "author": "msgbyte",
   "description": "为群组提供创建网页面板的功能",
+  "documentUrl": "/plugins/com.msgbyte.webview/README.md",
   "requireRestart": false
 }

web/src/components/Markdown.less

@@ -0,0 +1,18 @@
+.tailchat-markdown {
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    word-break: break-all;
+    margin: 20px 0;
+    line-height: 1.2;
+    text-align: left;
+    font-weight: bold;
+  }
+
+  code {
+    @apply px-2 py-1 bg-black bg-opacity-20 rounded;
+  }
+}

web/src/components/Markdown.tsx

@@ -1,6 +1,7 @@
 import React, { useCallback } from 'react';
 import { isValidStr } from 'tailchat-shared';
 import { Loadable } from './Loadable';
+import './Markdown.less';
 
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore

web/src/plugin/PluginStore/Item.tsx

@@ -3,6 +3,7 @@ import { Button, Space } from 'antd';
 import React, { useCallback, useState } from 'react';
 import {
   isValidStr,
+  parseUrlStr,
   PluginManifest,
   showAlert,
   showToasts,
@@ -51,7 +52,7 @@ export const PluginStoreItem: React.FC<{
 
     openModal(
       <ModalWrapper title={manifest.label}>
-        <DocumentView documentUrl={manifest.documentUrl} />
+        <DocumentView documentUrl={parseUrlStr(manifest.documentUrl)} />
       </ModalWrapper>
     );
   }, [manifest]);

web/src/plugin/builtin.ts

@@ -13,6 +13,7 @@ export const builtinPlugins: PluginManifest[] = [
     version: '0.0.0',
     author: 'msgbyte',
     description: '为群组提供创建网页面板的功能',
+    documentUrl: '/plugins/com.msgbyte.webview/README.md',
     requireRestart: false,
   },
   {

web/src/styles/global.less

@@ -52,6 +52,10 @@
   &.dark {
     @apply text-typography-dark bg-content-dark;
 
+    h1,h2,h3,h4,h5,h6 {
+      @apply text-typography-dark;
+    }
+
     ::-webkit-scrollbar-corner {
       background-color: transparent;
     }

web/src/styles/index.ts

@@ -1,4 +1,4 @@
 import 'antd/dist/antd.css';
 import './antd/index.less';
-import 'tailwindcss/tailwind.css';
+import './tailwind.less';
 import './global.less';

web/src/styles/tailwind.less

@@ -0,0 +1,19 @@
+@tailwind base;
+
+@layer base {
+  h1 {
+    @apply text-2xl;
+  }
+
+  h2 {
+    @apply text-xl;
+  }
+
+  h3 {
+    @apply text-lg;
+  }
+}
+
+@tailwind components;
+
+@tailwind utilities;