Add tg docs and github page custom domain docs

2025-06-21 20:12:11 +08:00
parent cd767f1aa0
commit acc3b33d77
15 changed files with 2804 additions and 45 deletions
@@ -51,6 +51,7 @@ WR.DO 是一个一站式网络工具平台，集成短链服务、临时邮箱
  - 多维度图表展示网站状态
  - 域名服务配置（动态配置各项服务是否启用，包括短链、临时邮箱（收发邮件）、子域名管理）
  - 用户列表管理（设置权限、分配使用额度、禁用用户等）
+  - 动态配置登录方式 (支持 Google, GitHub, 邮箱验证, 账户密码, LinuxDO)
  - 短链管理（管理所有用户创建的短链）
  - 邮箱管理（管理所有用户创建的临时邮箱）
  - 子域名管理（管理所有用户创建的子域名）
@@ -50,6 +50,7 @@ WR.DO is a all-in-one web utility platform featuring short links with analytics,
  - Multi-dimensional dashboard with website analytics
  - Dynamic service configuration (toggle short links, email, subdomain management)
  - User management (permissions, quotas, account control)
+  - Dynamically configure login methods (Google, GitHub, Magic Link, Credentials, LinuxDO)
  - Centralized short link administration
  - Centralized email management
  - Centralized subdomain administration
@@ -3,9 +3,11 @@
 import { useEffect, useState, useTransition } from "react";
 import Link from "next/link";
 import { useTranslations } from "next-intl";
+import pkg from "package.json";
 import { toast } from "sonner";
 import useSWR from "swr";

+import { siteConfig } from "@/config/site";
 import { fetcher } from "@/lib/utils";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -239,7 +241,29 @@ export default function AppConfigs({}: {}) {
              )}
            </div>

-            <VersionNotifier />
+            <div
+              className="flex items-center gap-1 text-xs text-muted-foreground/90"
+              style={{ fontFamily: "Bahamas Bold" }}
+            >
+              Powered by
+              <Link
+                href={siteConfig.url}
+                target="_blank"
+                rel="noreferrer"
+                className="font-medium underline-offset-2 hover:underline"
+              >
+                {siteConfig.name}
+              </Link>
+              <Link
+                href={`${siteConfig.links.github}/releases/latest`}
+                target="_blank"
+                rel="noreferrer"
+                className="font-thin underline-offset-2 hover:underline"
+              >
+                v{pkg.version}
+              </Link>
+              <VersionNotifier />
+            </div>
          </div>
        </CollapsibleContent>
      </Collapsible>
@@ -97,8 +97,6 @@ function shouldPushToTelegram(
    .map((email) => email.trim())
    .filter((email) => email.length > 0);

-  console.log("[Email]", whiteListArray, email.to);
-
  return whiteListArray.includes(email.to);
 }

@@ -74,54 +74,55 @@ const VersionNotifier: React.FC<VersionNotifierProps> = ({
    return () => clearInterval(interval);
  }, []);

-  if (!showUpdate) {
-    return (
+  return (
+    <>
      <Button
        onClick={checkVersion}
        disabled={isLoading}
        variant={"outline"}
-        // size={"sm"}
-        className={`flex items-center gap-2 ${className}`}
+        size={"sm"}
+        className={`ml-auto flex items-center gap-2 text-xs ${className}`}
      >
        <RefreshCw className={`size-4 ${isLoading ? "animate-spin" : ""}`} />
        {t("Check for updates")}
      </Button>
-    );
-  }
+      {showUpdate && (
+        <div className="fixed bottom-4 right-4 z-50">
+          <div className="max-w-xs rounded-lg border bg-muted p-4 shadow-xl dark:border-gray-700 dark:bg-gray-800">
+            <div className="mb-2 flex items-center justify-between">
+              <div className="mr-6 flex items-center space-x-2">
+                <span className="text-sm font-medium text-gray-900 dark:text-white">
+                  🎉 {t("New version available")}: {latestVersion}
+                </span>
+              </div>
+              <Button
+                onClick={() => setShowUpdate(false)}
+                className="px-2 text-muted-foreground"
+                title="Dismiss"
+                variant={"ghost"}
+                size={"sm"}
+              >
+                <X className="size-4" />
+              </Button>
+            </div>

-  return (
-    <div className="max-w-xs rounded-lg border bg-muted p-4 shadow-xl dark:border-gray-700 dark:bg-gray-800">
-      <div className="mb-2 flex items-center justify-between">
-        <div className="flex items-center space-x-2">
-          <span className="text-sm font-medium text-gray-900 dark:text-white">
-            🎉 {t("New version available")}: {latestVersion}
-          </span>
+            <div className="flex space-x-3">
+              <a
+                href={`https://github.com/${githubRepo}/releases/latest`}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="flex-1 rounded bg-blue-600 px-3 py-2 text-center text-sm font-medium text-white transition-colors hover:bg-blue-700"
+              >
+                {t("Update now")}
+              </a>
+              <Button onClick={dismissUpdate} variant={"outline"} size={"sm"}>
+                {t("Dismiss")}
+              </Button>
+            </div>
+          </div>
        </div>
-        <Button
-          onClick={() => setShowUpdate(false)}
-          className="px-2 text-muted-foreground"
-          title="Dismiss"
-          variant={"ghost"}
-          size={"sm"}
-        >
-          <X className="size-4" />
-        </Button>
-      </div>
-
-      <div className="flex space-x-3">
-        <a
-          href={`https://github.com/${githubRepo}/releases/latest`}
-          target="_blank"
-          rel="noopener noreferrer"
-          className="flex-1 rounded bg-blue-600 px-3 py-2 text-center text-sm font-medium text-white transition-colors hover:bg-blue-700"
-        >
-          {t("Update now")}
-        </a>
-        <Button onClick={dismissUpdate} variant={"outline"} size={"sm"}>
-          {t("Dismiss")}
-        </Button>
-      </div>
-    </div>
+      )}
+    </>
  );
 };

@@ -81,6 +81,11 @@ export const docsConfig: DocsConfig = {
    {
      title: "Examples",
      items: [
+        {
+          title: "Github Page Custom Domain",
+          href: "/docs/examples/github-page",
+          icon: "page",
+        },
        {
          title: "Cloudflare Custom Domain",
          href: "/docs/examples/cloudflare",
@@ -146,6 +151,11 @@ export const docsConfig: DocsConfig = {
          href: "/docs/developer/database",
          icon: "page",
        },
+        {
+          title: "Telegram Bot",
+          href: "/docs/developer/telegram-bot",
+          icon: "page",
+        },
        {
          title: "Components",
          href: "/docs/developer/components",
@@ -1,4 +1,156 @@
 ---
-title: Telegram Bot
+title: Telegram 邮件推送功能配置指南
 description: How to configure Telegram bot
---
+---
+
+## 功能概述
+
+WR.DO 支持将接收到的邮件自动推送到 Telegram 群组或私聊中，让您能够实时收到邮件通知。支持自定义消息模板、多个聊天群组推送以及白名单过滤等功能。
+
+相关配置位于 `localhost:3000/admin/system` 的 `电子邮件配置中`。
+
+
+## 配置参数说明
+
+### 必需参数
+
+| 系统参数名（请勿修改） | 类型 | 说明 |
+|--------|------|------|
+| `enable_tg_email_push` | boolean | 是否启用 Telegram 推送功能 |
+| `tg_email_bot_token` | string | Telegram Bot Token |
+| `tg_email_chat_id` | string | 目标聊天 ID（支持多个，逗号分隔） |
+
+### 可选参数
+
+| 系统参数名（请勿修改） | 类型 | 说明 |
+|--------|------|------|
+| `tg_email_template` | string | 自定义消息模板 |
+| `tg_email_target_white_list` | string | 邮件地址白名单（逗号分隔） |
+
+## 第一步：创建 Telegram Bot
+
+### 1. 与 BotFather 对话
+
+1. 在 Telegram 中搜索 `@BotFather`
+2. 发送 `/start` 开始对话
+3. 发送 `/newbot` 创建新机器人
+
+### 2. 设置机器人信息
+
+1. 输入机器人的显示名称（例如：`Email Notifier`）
+2. 输入机器人的用户名（必须以 `bot` 结尾，例如：`my_email_bot`）
+3. BotFather 会返回一个 Token，格式类似：`123456789:ABCdefGHIjklMNOpqrSTUvwxyz`
+
+## 第二步：获取聊天 ID
+
+### 方法一：私聊获取
+
+1. 在 Telegram 中搜索您刚创建的机器人
+2. 发送 `/start` 或任意消息给机器人
+3. 打开浏览器，访问：
+
+   ```bash
+   https://api.telegram.org/bot<YOUR_BOT_TOKEN>/getUpdates
+   ```
+
+   将 `<YOUR_BOT_TOKEN>` 替换为您的实际 Token
+4. 在返回的 JSON 中找到 `"chat":{"id":123456789}` 部分，这个数字就是您的聊天 ID
+
+### 方法二：群组获取
+
+1. 将机器人添加到目标群组
+2. 在群组中发送任意消息 @ 您的机器人（例如：`@my_email_bot hello`）
+3. 访问上述 API 链接
+4. 找到对应的群组聊天 ID（通常是负数，如：`-123456789`）
+
+### 方法三：使用其他机器人
+
+1. 搜索 `@userinfobot` 或 `@chatidbot`
+2. 发送消息获取聊天 ID
+
+## 第三步：系统配置
+
+打开 `localhost:3000/admin/system` 页面，点击 `电子邮件配置`，填写对应的参数。
+
+## 第四步：自定义消息模板
+
+### 默认消息格式
+
+如果不设置自定义模板，系统会使用以下默认格式：
+
+```bash
+📧 *New Email*
+
+*From:* `发件人姓名 <邮箱地址>`
+*To:* `收件人邮箱`
+*Subject:* 邮件主题
+*Date:* 发送日期
+
+\`\`\`Content
+邮件内容（前2000字符）
+\`\`\`
+```
+
+### 自定义模板
+
+您可以使用以下变量来自定义消息模板：
+
+| 变量 | 说明 |
+|------|------|
+| `{{from}}` | 发件人信息 |
+| `{{to}}` | 收件人邮箱 |
+| `{{subject}}` | 邮件主题 |
+| `{{text}}` | 邮件文本内容 |
+| `{{date}}` | 发送日期 |
+
+### 模板示例
+
+```md
+🔔 收到新邮件\n\n发件人：{{from}}\n主题：{{subject}}\n时间：{{date}}\n\n内容：\n{{text}}
+```
+
+## 功能特性
+
+### 1. 多聊天群组支持
+- 支持同时向多个 Telegram 群组或私聊发送通知
+- 使用逗号分隔多个聊天 ID
+- 发送失败不会影响其他群组的推送
+
+### 2. 白名单过滤
+- 支持设置收件人邮箱白名单
+- 只有白名单中的邮箱收到邮件时才会推送到 Telegram
+- 如果不设置白名单，则推送所有邮件
+
+### 3. 内容处理
+- 自动去除 HTML 标签
+- 内容超过 2000 字符时自动截断
+- 支持 Markdown 格式显示
+
+### 4. 错误处理
+- 自动重试机制
+- 详细的错误日志记录
+- 部分发送失败不影响整体流程
+
+## 故障排除
+
+### 常见问题
+
+1. **机器人无法发送消息**
+   - 检查 Bot Token 是否正确
+   - 确认机器人已被添加到目标群组
+   - 确认机器人在群组中有发送消息的权限
+
+2. **获取不到聊天 ID**
+   - 确保已经向机器人发送过消息
+   - 检查 API 请求 URL 是否正确
+   - 尝试使用专门的机器人获取 ID
+
+3. **消息格式异常**
+   - 检查自定义模板中的变量是否正确
+   - 确认 Markdown 语法没有错误
+   - 测试时可以先使用默认模板
+
+4. **部分群组收不到消息**
+   - 检查聊天 ID 是否正确
+   - 确认机器人在对应群组中
+   - 查看服务器日志中的错误信息
@@ -0,0 +1,10 @@
+---
+title: Github Page
+description: Free parsing custom domain names.
+---
+
+Foollow https://github.com/[account]/[repo]/settings/pages to deploy your github page, add your custom domain name like `abc.wr.do`.
+
+Then back to https://wr.do/dashboard/records, config the `CNAME` content:
+
+![](/_static/examples/github.png)
@@ -23,12 +23,16 @@ WR.DO is a all-in-one web utility platform featuring short links with analytics,
  - Unlimited mailbox creation
  - Receive unlimited emails (powered by Cloudflare Email Worker)
  - Send emails (powered by Resend)
+  - Support catch-all emails
+  - Support push to telegram groups
  - API endpoints for mailbox creation
  - API endpoints for inbox retrieval

 - 🌐 **Subdomain Management Service**:
  - Manage DNS records across multiple Cloudflare accounts and domains
  - Create various DNS record types (CNAME, A, TXT, etc.)
+  - Support enabling application mode (user submission, admin approval)
+  - Support email notification of administrator and user domain application status

 - 📡 **Open API Module**:
  - Website metadata extraction API
@@ -42,6 +46,7 @@ WR.DO is a all-in-one web utility platform featuring short links with analytics,
  - Multi-dimensional dashboard with website analytics
  - Dynamic service configuration (toggle short links, email, subdomain management)
  - User management (permissions, quotas, account control)
+  - Dynamically configure login methods (Google, GitHub, Magic Link, Credentials, LinuxDO)
  - Centralized short link administration
  - Centralized email management
  - Centralized subdomain administration